dubey/WebGoat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial client side pagination

Browse Source
This commit is contained in:
Jason White 2016-08-29 16:13:19 -04:00
parent ac433305a9
commit 9f10fd7c57
2 changed files with 53 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
webgoat-container/src/main/resources/static/css/main.css
View File

@ -905,6 +905,11 @@ cookie-container {
display: block
}
/* General View Controls */
.show-next-page:hover {
cursor:pointer;
}
/* HINTS */
#lesson-hint-container {
display: none;
@ -943,5 +948,5 @@ cookie-container {
/* ATTACK DISPLAY */
#attack-container {
display:none;
border:1px solid red;
}

58
webgoat-container/src/main/resources/static/js/goatApp/view/LessonContentView.js
View File

@ -18,9 +18,9 @@ define(['jquery',
render: function() {
this.$el.html(this.model.get('content'));
this.makeFormsAjax();
this.initPagination();
this.ajaxifyAttackHref();
$(window).scrollTop(0); //work-around til we get the scroll down sorted out
this.initPagination();
},
//TODO: reimplement this in custom fashion maybe?
@ -37,12 +37,14 @@ define(['jquery',
},
initPagination: function() {
//console.log(this.$el.find('.lesson-page-wrapper').length + ' pages of content');
//get basic pagination info
this.currentPage = 0;
this.$contentPages = this.$el.find('.lesson-page-wrapper');
if (this.$contentPages.length > 1) {
this.$contentPages.hide();
this.$el.find(this.$contentPages[0]).show();
this.numPages = this.$contentPages.length;
//
if (this.numPages > 1) {
this.showCurContentPage();
this.addPaginationControls();
}
},
@ -67,15 +69,49 @@ define(['jquery',
},
addPaginationControls: function() {
// <div class="panel-body" id="lesson-page-controls">
// <span class="glyphicon-class glyphicon glyphicon-circle-arrow-left" id="show-prev-hint"></span>
// <span class="glyphicon-class glyphicon glyphicon-circle-arrow-right" id="show-next-hint"></span>
// <br/>
//
// </div>
this.$prevPageButton = $('<span>',{class:'glyphicon-class glyphicon glyphicon-circle-arrow-left show-prev-page'});
this.$prevPageButton.unbind().on('click',this.decrementPageView);
this.$nextPageButton = $('<span>',{class:'glyphicon-class glyphicon glyphicon-circle-arrow-right show-next-page'});
this.$nextPageButton.unbind().on('click',this.incrementPageView.bind(this));
var pagingControlsDiv = $('<div>',{class:'panel-body', id:'lessong-page-controls'});
pagingControlsDiv.append(this.$prevPageButton);
pagingControlsDiv.append(this.$nextPageButton);
this.$el.append(pagingControlsDiv);
this.$prevPageButton.hide()
},
incrementPageView: function() {
if (this.currentPage < this.numPages -1) {
this.currentPage++;
this.showCurContentPage();
}
if (this.currentPage >= this.numPages -1) {
//this.hideNextPageButton();
}
},
decrementPageView: function() {
if (this.currentPage > 0) {
this.currentPage--;
this.showCurContentPage();
}
if (this.currentPage == 0) {
//this.hidePrevPageButton();
}
},
showCurContentPage: function() {
this.$contentPages.hide();
this.$el.find(this.$contentPages[this.currentPage]).show();
},
hideNextPageButton: function() {
}
});