Initial client side pagination
This commit is contained in:
parent
ac433305a9
commit
9f10fd7c57
@ -905,6 +905,11 @@ cookie-container {
|
|||||||
display: block
|
display: block
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* General View Controls */
|
||||||
|
.show-next-page:hover {
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
|
||||||
/* HINTS */
|
/* HINTS */
|
||||||
#lesson-hint-container {
|
#lesson-hint-container {
|
||||||
display: none;
|
display: none;
|
||||||
@ -943,5 +948,5 @@ cookie-container {
|
|||||||
/* ATTACK DISPLAY */
|
/* ATTACK DISPLAY */
|
||||||
|
|
||||||
#attack-container {
|
#attack-container {
|
||||||
display:none;
|
border:1px solid red;
|
||||||
}
|
}
|
@ -18,9 +18,9 @@ define(['jquery',
|
|||||||
render: function() {
|
render: function() {
|
||||||
this.$el.html(this.model.get('content'));
|
this.$el.html(this.model.get('content'));
|
||||||
this.makeFormsAjax();
|
this.makeFormsAjax();
|
||||||
this.initPagination();
|
|
||||||
this.ajaxifyAttackHref();
|
this.ajaxifyAttackHref();
|
||||||
$(window).scrollTop(0); //work-around til we get the scroll down sorted out
|
$(window).scrollTop(0); //work-around til we get the scroll down sorted out
|
||||||
|
this.initPagination();
|
||||||
},
|
},
|
||||||
|
|
||||||
//TODO: reimplement this in custom fashion maybe?
|
//TODO: reimplement this in custom fashion maybe?
|
||||||
@ -37,12 +37,14 @@ define(['jquery',
|
|||||||
},
|
},
|
||||||
|
|
||||||
initPagination: function() {
|
initPagination: function() {
|
||||||
//console.log(this.$el.find('.lesson-page-wrapper').length + ' pages of content');
|
//get basic pagination info
|
||||||
this.currentPage = 0;
|
this.currentPage = 0;
|
||||||
this.$contentPages = this.$el.find('.lesson-page-wrapper');
|
this.$contentPages = this.$el.find('.lesson-page-wrapper');
|
||||||
if (this.$contentPages.length > 1) {
|
this.numPages = this.$contentPages.length;
|
||||||
this.$contentPages.hide();
|
//
|
||||||
this.$el.find(this.$contentPages[0]).show();
|
if (this.numPages > 1) {
|
||||||
|
this.showCurContentPage();
|
||||||
|
this.addPaginationControls();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -67,15 +69,49 @@ define(['jquery',
|
|||||||
},
|
},
|
||||||
|
|
||||||
addPaginationControls: function() {
|
addPaginationControls: function() {
|
||||||
// <div class="panel-body" id="lesson-page-controls">
|
this.$prevPageButton = $('<span>',{class:'glyphicon-class glyphicon glyphicon-circle-arrow-left show-prev-page'});
|
||||||
// <span class="glyphicon-class glyphicon glyphicon-circle-arrow-left" id="show-prev-hint"></span>
|
this.$prevPageButton.unbind().on('click',this.decrementPageView);
|
||||||
// <span class="glyphicon-class glyphicon glyphicon-circle-arrow-right" id="show-next-hint"></span>
|
|
||||||
// <br/>
|
this.$nextPageButton = $('<span>',{class:'glyphicon-class glyphicon glyphicon-circle-arrow-right show-next-page'});
|
||||||
//
|
this.$nextPageButton.unbind().on('click',this.incrementPageView.bind(this));
|
||||||
// </div>
|
|
||||||
|
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() {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user