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

refactor of pagination controls

Browse Source
This commit is contained in:
Jason White
2017-04-06 09:52:31 -04:00
committed by Nanne Baars
parent 6a9f7e0b0f
commit e3d281a5f6
7 changed files with 154 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -3,13 +3,15 @@ define(['jquery',
'underscore',
'backbone',
'libs/jquery.form',
'goatApp/view/ErrorNotificationView'],
'goatApp/view/ErrorNotificationView',
'goatApp/view/PaginationControlView'],
function(
$,
_,
Backbone,
JQueryForm,
ErrorNotificationView) {
ErrorNotificationView,
PaginationControlView) {
return Backbone.View.extend({
el:'#lesson-content-wrapper', //TODO << get this fixed up in DOM
@ -37,7 +39,7 @@ define(['jquery',
return -1;
},
/* initial renering */
/* initial rendering */
render: function() {
this.$el.find('.lesson-content').html(this.model.get('content'));
this.$el.find('.attack-feedback').hide();
@ -53,23 +55,9 @@ define(['jquery',
this.currentPage = 0;
this.$contentPages = this.$el.find('.lesson-page-wrapper');
this.numPages = this.$contentPages.length;
//
this.addPaginationControls();
if (this.numPages > 1) {
//no animation on init
this.$contentPages.hide();
this.$el.find(this.$contentPages[this.currentPage]).show();
this.showNextPageButton();
this.hidePrevPageButton();
} else if (this.numPages === 1) {
this.hideNextPageButton();
this.hidePrevPageButton();
}
},
setCurrentPage: function (pageNum) {
this.currentPage = (_.isNumber(pageNum) && pageNum < this.numPages) ? pageNum : 0;
this.paginationControlView = new PaginationControlView(this.$contentPages,this.model.get('lessonUrl'));
//this.listenTo(this.paginationControlView,'page:set',this.navToPage);
},
getCurrentPage: function () {
@ -160,82 +148,9 @@ define(['jquery',
this.$curOutput.show(400)
},
/* create, show & hide pagination controls */
addPaginationControls: function() {
var pagingControlsDiv;
//this.$el.html();
//prev
var prevPageButton = $('<span>',{class:'glyphicon-class glyphicon glyphicon-circle-arrow-left show-prev-page'});
prevPageButton.unbind().on('click',this.decrementPageView.bind(this));
//next
var nextPageButton = $('<span>',{class:'glyphicon-class glyphicon glyphicon-circle-arrow-right show-next-page'});
nextPageButton.unbind().on('click',this.incrementPageView.bind(this));
//add to DOM
if (this.$el.find('#lesson-page-controls').length < 1) {
pagingControlsDiv = $('<div>',{class:'panel-body', id:'lesson-page-controls'});
pagingControlsDiv.append(prevPageButton);
pagingControlsDiv.append(nextPageButton);
this.$el.find('.lesson-page-controls').append(pagingControlsDiv);
}
},
showPrevPageButton: function() {
$('span.glyphicon-class.glyphicon.glyphicon-circle-arrow-left.show-prev-page').show();
},
hidePrevPageButton: function() {
$('span.glyphicon-class.glyphicon.glyphicon-circle-arrow-left.show-prev-page').hide();
},
showNextPageButton: function() {
$('span.glyphicon-class.glyphicon.glyphicon-circle-arrow-right.show-next-page').show();
},
hideNextPageButton: function() {
$('span.glyphicon-class.glyphicon.glyphicon-circle-arrow-right.show-next-page').hide();
},
/* increment, decrement & display handlers */
incrementPageView: function() {
if (this.currentPage < this.numPages -1) {
this.currentPage++;
window.location.href = this.model.get('lessonUrl') + '/' + this.currentPage;
//this.showCurContentPage(true);Con
}
if (this.currentPage > 0) {
this.showPrevPageButton();
}
if (this.currentPage >= this.numPages -1) {
this.hideNextPageButton();
this.showPrevPageButton;
}
},
decrementPageView: function() {
if (this.currentPage > 0) {
this.currentPage--;
window.location.href = this.model.get('lessonUrl') + '/' + this.currentPage;
//this.showCurContentPage(false);
}
if (this.currentPage < this.numPages -1) {
this.showNextPageButton();
}
if (this.currentPage == 0) {
this.hidePrevPageButton();
this.showNextPageButton()
}
},
showCurContentPage: function(isIncrement) {
showCurContentPage: function(pageNum) {
this.$contentPages.hide();
this.$el.find(this.$contentPages[this.currentPage]).show();
this.$el.find(this.$contentPages[pageNum]).show();
},
findAssigmentEndpointOnPage: function(pageNumber) {
@ -248,42 +163,13 @@ define(['jquery',
},
navToPage: function (pageNum) {
this.setCurrentPage(pageNum);//provides validation
this.showCurContentPage(this.currentPage);
this.hideShowNavButtons();
this.showCurContentPage(pageNum);
this.paginationControlView.setCurrentPage(pageNum);//provides validation
this.paginationControlView.hideShowNavButtons();
var assignmentPath = this.findAssigmentEndpointOnPage(pageNum);
Backbone.trigger('navigatedToPage',{'pageNumber':pageNum, 'assignmentPath' : assignmentPath});
},
hideShowNavButtons: function () {
//one page only
if (this.numPages === 1) {
this.hidePrevPageButton();
this.hideNextPageButton();
}
//first page
if (this.currentPage === 0) {
this.hidePrevPageButton();
if (this.numPages > 1) {
this.showNextPageButton();
}
return;
}
// > first page, but not last
if (this.currentPage > 0 && this.currentPage < this.numPages -1) {
this.showNextPageButton();
this.showPrevPageButton();
return;
}
// last page and more than one page
if (this.currentPage === this.numPages -1 && this.numPages > 1) {
this.hideNextPageButton();
this.showPrevPageButton();
return;
}
},
/* for testing */
showTestParam: function (param) {
this.$el.find('.lesson-content').html('test:' + param);