mirror of
https://github.com/futurepress/epub.js.git
synced 2025-10-03 14:59:18 +02:00
Updated Expands and Layout methods
This commit is contained in:
Fred Chasen
parent
6b25126f00
commit
b88aab25d9
14 changed files with 1116 additions and 766 deletions
|
|
@ -34,12 +34,12 @@ EPUBJS.Continuous.prototype.attachListeners = function(){
|
|||
window.addEventListener("resize", this.onResized.bind(this), false);
|
||||
}
|
||||
|
||||
|
||||
if(this.settings.infinite) {
|
||||
//this.infinite = new EPUBJS.Infinite(this.container);
|
||||
//this.infinite.on("scroll", this.check.bind(this));
|
||||
this.start();
|
||||
}
|
||||
|
||||
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.display = function(what){
|
||||
|
|
@ -55,7 +55,7 @@ EPUBJS.Continuous.prototype.display = function(what){
|
|||
this.displaying = true;
|
||||
|
||||
if(section){
|
||||
view = new EPUBJS.View(section);
|
||||
view = new EPUBJS.View(section, this.viewSettings);
|
||||
|
||||
// This will clear all previous views
|
||||
this.q.enqueue(this.fill, view);
|
||||
|
|
@ -95,16 +95,14 @@ EPUBJS.Continuous.prototype.afterDisplayed = function(currView){
|
|||
var index = this.views.indexOf(currView);
|
||||
|
||||
var prevView, nextView;
|
||||
// this.resizeView(currView);
|
||||
|
||||
|
||||
if(index + 1 === this.views.length && next) {
|
||||
nextView = new EPUBJS.View(next);
|
||||
nextView = new EPUBJS.View(next, this.viewSettings);
|
||||
this.q.enqueue(this.append, nextView);
|
||||
}
|
||||
|
||||
if(index === 0 && prev) {
|
||||
prevView = new EPUBJS.View(prev);
|
||||
prevView = new EPUBJS.View(prev, this.viewSettings);
|
||||
this.q.enqueue(this.prepend, prevView);
|
||||
}
|
||||
|
||||
|
|
@ -115,40 +113,6 @@ EPUBJS.Continuous.prototype.afterDisplayed = function(currView){
|
|||
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.afterDisplayedAbove = function(currView){
|
||||
|
||||
var bounds = currView.bounds(); //, style, marginTopBottom, marginLeftRight;
|
||||
// var prevTop = this.container.scrollTop;
|
||||
// var prevLeft = this.container.scrollLeft;
|
||||
|
||||
if(currView.countered) {
|
||||
this.afterDisplayed(currView);
|
||||
return;
|
||||
}
|
||||
// bounds = currView.bounds();
|
||||
|
||||
if(this.settings.axis === "vertical") {
|
||||
this.scrollBy(0, bounds.height, true);
|
||||
} else {
|
||||
this.scrollBy(bounds.width, 0, true);
|
||||
}
|
||||
|
||||
// if(this.settings.axis === "vertical") {
|
||||
// currView.countered = bounds.height - (currView.countered || 0);
|
||||
// this.infinite.scrollTo(0, prevTop + bounds.height, true)
|
||||
// } else {
|
||||
// currView.countered = bounds.width - (currView.countered || 0);
|
||||
// this.infinite.scrollTo(prevLeft + bounds.width, 0, true);
|
||||
// }
|
||||
currView.countered = true;
|
||||
|
||||
// this.removeShownListeners(currView);
|
||||
|
||||
this.afterDisplayed(currView);
|
||||
|
||||
if(this.afterDisplayedAboveHook) this.afterDisplayedAboveHook(currView);
|
||||
|
||||
};
|
||||
|
||||
// Remove Previous Listeners if present
|
||||
EPUBJS.Continuous.prototype.removeShownListeners = function(view){
|
||||
|
|
@ -161,29 +125,37 @@ EPUBJS.Continuous.prototype.removeShownListeners = function(view){
|
|||
|
||||
EPUBJS.Continuous.prototype.append = function(view){
|
||||
this.views.push(view);
|
||||
// view.appendTo(this.container);
|
||||
this.container.appendChild(view.element);
|
||||
|
||||
|
||||
// view.on("shown", this.afterDisplayed.bind(this));
|
||||
view.onShown = this.afterDisplayed.bind(this);
|
||||
// this.resizeView(view);
|
||||
|
||||
return this.check();
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.prepend = function(view){
|
||||
this.views.unshift(view);
|
||||
// view.prependTo(this.container);
|
||||
this.container.insertBefore(view.element, this.container.firstChild);
|
||||
|
||||
view.onShown = this.afterDisplayedAbove.bind(this);
|
||||
// view.on("shown", this.afterDisplayedAbove.bind(this));
|
||||
view.onShown = this.afterDisplayed.bind(this);
|
||||
|
||||
//might need to enqueue
|
||||
view.on("resized", this.counter.bind(this));
|
||||
|
||||
// this.resizeView(view);
|
||||
return this.check();
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.counter = function(bounds){
|
||||
|
||||
if(this.settings.axis === "vertical") {
|
||||
this.scrollBy(0, bounds.heightDelta, true);
|
||||
} else {
|
||||
this.scrollBy(bounds.widthDelta, 0, true);
|
||||
}
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.fill = function(view){
|
||||
|
||||
if(this.views.length){
|
||||
|
|
@ -221,6 +193,8 @@ EPUBJS.Continuous.prototype.remove = function(view) {
|
|||
|
||||
this.container.removeChild(view.element);
|
||||
|
||||
view.off("resized");
|
||||
|
||||
if(view.shown){
|
||||
view.destroy();
|
||||
}
|
||||
|
|
@ -253,21 +227,42 @@ EPUBJS.Continuous.prototype.isVisible = function(view, _container){
|
|||
var position = view.position();
|
||||
var container = _container || this.container.getBoundingClientRect();
|
||||
|
||||
if((position.bottom >= container.top - this.settings.offset) &&
|
||||
!(position.top >= container.bottom + this.settings.offset) &&
|
||||
if(this.settings.axis === "horizontal" &&
|
||||
(position.right >= container.left - this.settings.offset) &&
|
||||
!(position.left >= container.right + this.settings.offset)) {
|
||||
|
||||
return true;
|
||||
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
} else if(this.settings.axis === "vertical" &&
|
||||
(position.bottom >= container.top - this.settings.offset) &&
|
||||
!(position.top >= container.bottom + this.settings.offset)) {
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.check = function(){
|
||||
var checking = new RSVP.defer();
|
||||
var container = this.container.getBoundingClientRect();
|
||||
var container;//this.container.getBoundingClientRect();
|
||||
|
||||
// Temp
|
||||
if(!this.settings.height) {
|
||||
var width = window.innerWidth;
|
||||
var height = window.innerHeight;
|
||||
container = {
|
||||
top: 0,
|
||||
left: 0,
|
||||
right: width,
|
||||
bottom: height,
|
||||
width: width,
|
||||
height: height
|
||||
}
|
||||
} else {
|
||||
container = this.container.getBoundingClientRect();
|
||||
}
|
||||
|
||||
this.views.forEach(function(view){
|
||||
var visible = this.isVisible(view, container);
|
||||
|
|
@ -275,6 +270,7 @@ EPUBJS.Continuous.prototype.check = function(){
|
|||
if(visible) {
|
||||
|
||||
if(!view.shown && !this.rendering) {
|
||||
|
||||
this.q.enqueue(function(){
|
||||
|
||||
return this.render(view)
|
||||
|
|
@ -285,7 +281,7 @@ EPUBJS.Continuous.prototype.check = function(){
|
|||
|
||||
}.bind(this));
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
|
@ -331,8 +327,17 @@ EPUBJS.Continuous.prototype.trim = function(){
|
|||
|
||||
EPUBJS.Continuous.prototype.erase = function(view, above){ //Trim
|
||||
|
||||
var prevTop = this.container.scrollTop;
|
||||
var prevLeft = this.container.scrollLeft;
|
||||
var prevTop;
|
||||
var prevLeft;
|
||||
|
||||
if(this.settings.height) {
|
||||
prevTop = this.container.scrollTop;
|
||||
prevLeft = this.container.scrollLeft;
|
||||
} else {
|
||||
prevTop = window.scrollY;
|
||||
prevLeft = window.scrollX;
|
||||
}
|
||||
|
||||
var bounds = view.bounds();
|
||||
|
||||
this.remove(view);
|
||||
|
|
@ -349,33 +354,6 @@ EPUBJS.Continuous.prototype.erase = function(view, above){ //Trim
|
|||
};
|
||||
|
||||
|
||||
// EPUBJS.Continuous.prototype.resizeView = function(view) {
|
||||
// var bounds = this.container.getBoundingClientRect();
|
||||
// var styles = window.getComputedStyle(this.container);
|
||||
// var padding = {
|
||||
// left: parseFloat(styles["padding-left"]) || 0,
|
||||
// right: parseFloat(styles["padding-right"]) || 0,
|
||||
// top: parseFloat(styles["padding-top"]) || 0,
|
||||
// bottom: parseFloat(styles["padding-bottom"]) || 0
|
||||
// };
|
||||
// var width = bounds.width - padding.left - padding.right;
|
||||
// var height = bounds.height - padding.top - padding.bottom;
|
||||
|
||||
// if(this.settings.axis === "vertical") {
|
||||
// view.resize(width, 0);
|
||||
// } else {
|
||||
// view.resize(0, height);
|
||||
// }
|
||||
// };
|
||||
|
||||
// EPUBJS.Continuous.prototype.paginate = function(options) {
|
||||
// this.pagination = new EPUBJS.Paginate(this, {
|
||||
// width: this.settings.width,
|
||||
// height: this.settings.height
|
||||
// });
|
||||
// return this.pagination;
|
||||
// };
|
||||
|
||||
EPUBJS.Continuous.prototype.checkCurrent = function(position) {
|
||||
var view, top;
|
||||
var container = this.container.getBoundingClientRect();
|
||||
|
|
@ -409,15 +387,28 @@ EPUBJS.Continuous.prototype.checkCurrent = function(position) {
|
|||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.start = function() {
|
||||
|
||||
var scroller;
|
||||
|
||||
this.tick = EPUBJS.core.requestAnimationFrame;
|
||||
|
||||
this.prevScrollTop = this.container.scrollTop;
|
||||
this.prevScrollLeft = this.container.scrollLeft;
|
||||
if(this.settings.height) {
|
||||
this.prevScrollTop = this.container.scrollTop;
|
||||
this.prevScrollLeft = this.container.scrollLeft;
|
||||
} else {
|
||||
this.prevScrollTop = window.scrollY;
|
||||
this.prevScrollLeft = window.scrollX;
|
||||
}
|
||||
|
||||
this.scrollDeltaVert = 0;
|
||||
this.scrollDeltaHorz = 0;
|
||||
|
||||
this.container.addEventListener("scroll", function(e){
|
||||
if(this.settings.height) {
|
||||
scroller = this.container;
|
||||
} else {
|
||||
scroller = window;
|
||||
}
|
||||
|
||||
window.addEventListener("scroll", function(e){
|
||||
if(!this.ignore) {
|
||||
this.scrolled = true;
|
||||
} else {
|
||||
|
|
@ -438,9 +429,14 @@ EPUBJS.Continuous.prototype.start = function() {
|
|||
EPUBJS.Continuous.prototype.onScroll = function(){
|
||||
|
||||
if(this.scrolled) {
|
||||
|
||||
scrollTop = this.container.scrollTop;
|
||||
scrollLeft = this.container.scrollLeft;
|
||||
|
||||
if(this.settings.height) {
|
||||
scrollTop = this.container.scrollTop;
|
||||
scrollLeft = this.container.scrollLeft;
|
||||
} else {
|
||||
scrollTop = window.scrollY;
|
||||
scrollLeft = window.scrollX;
|
||||
}
|
||||
|
||||
if(!this.ignore) {
|
||||
|
||||
|
|
@ -468,8 +464,14 @@ EPUBJS.Continuous.prototype.onScroll = function(){
|
|||
this.scrollDeltaVert += Math.abs(scrollTop-this.prevScrollTop);
|
||||
this.scrollDeltaHorz += Math.abs(scrollLeft-this.prevScrollLeft);
|
||||
|
||||
this.prevScrollTop = this.container.scrollTop;
|
||||
this.prevScrollLeft = this.container.scrollLeft;
|
||||
if(this.settings.height) {
|
||||
this.prevScrollTop = this.container.scrollTop;
|
||||
this.prevScrollLeft = this.container.scrollLeft;
|
||||
} else {
|
||||
this.prevScrollTop = window.scrollY;
|
||||
this.prevScrollLeft = window.scrollX;
|
||||
}
|
||||
|
||||
|
||||
clearTimeout(this.scrollTimeout);
|
||||
this.scrollTimeout = setTimeout(function(){
|
||||
|
|
@ -489,8 +491,13 @@ EPUBJS.Continuous.prototype.scrollBy = function(x, y, silent){
|
|||
if(silent) {
|
||||
this.ignore = true;
|
||||
}
|
||||
this.container.scrollLeft += x;
|
||||
this.container.scrollTop += y;
|
||||
|
||||
if(this.settings.height) {
|
||||
this.container.scrollLeft += x;
|
||||
this.container.scrollTop += y;
|
||||
} else {
|
||||
window.scrollBy(x,y);
|
||||
}
|
||||
|
||||
this.scrolled = true;
|
||||
};
|
||||
|
|
@ -499,8 +506,13 @@ EPUBJS.Continuous.prototype.scrollTo = function(x, y, silent){
|
|||
if(silent) {
|
||||
this.ignore = true;
|
||||
}
|
||||
this.container.scrollLeft = x;
|
||||
this.container.scrollTop = y;
|
||||
|
||||
if(this.settings.height) {
|
||||
this.container.scrollLeft = x;
|
||||
this.container.scrollTop = y;
|
||||
} else {
|
||||
window.scrollTo(x,y);
|
||||
}
|
||||
|
||||
this.scrolled = true;
|
||||
|
||||
|
|
@ -511,3 +523,13 @@ EPUBJS.Continuous.prototype.scrollTo = function(x, y, silent){
|
|||
// return;
|
||||
// };
|
||||
};
|
||||
|
||||
EPUBJS.Continuous.prototype.resizeView = function(view) {
|
||||
|
||||
if(this.settings.axis === "horizontal") {
|
||||
view.lock(null, this.stage.height);
|
||||
} else {
|
||||
view.lock(this.stage.width, null);
|
||||
}
|
||||
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue