yetangitu/epub.js
1
0
Fork 0
mirror of https://github.com/futurepress/epub.js.git synced 2025-10-05 15:32:55 +02:00
Code Issues Releases Wiki Activity

Fix rendering compensation events

Browse source
This commit is contained in:
fchasen 2015-03-02 22:25:22 -05:00
parent b486232685
commit 4c5a8c7f12
6 changed files with 1621 additions and 2118 deletions
Download patch file Download diff file Expand all files Collapse all files

3572
dist/epub.js vendored
View file

File diff suppressed because it is too large Load diff

6
dist/epub.min.js vendored
View file

File diff suppressed because one or more lines are too long

15
examples/pages.html
View file

@ -140,6 +140,21 @@
pagination.prev();
}, false);
document.addEventListener("keyup", function(e){
// Left Key
if ((e.keyCode || e.which) == 37) {
pagination.prev();
}
// Right Key
if ((e.keyCode || e.which) == 39) {
pagination.next();
}
}, false);
</script>
</body>

2
lib/epubjs/paginate.js
View file

@ -121,7 +121,7 @@ EPUBJS.Paginate.prototype.registerLayoutMethod = function(view) {
this.formated = this.layout.format(this.settings.width, this.settings.height, this.settings.gap);
// Add extra padding for the gap between this and the next view
view.element.style.paddingRight = this.layout.gap+"px";
view.iframe.style.marginRight = this.layout.gap+"px";
// Set the look ahead offset for what is visible
this.renderer.settings.offset = this.formated.pageWidth;

21
lib/epubjs/rendition.js
View file

@ -231,7 +231,7 @@ EPUBJS.Rendition.prototype.render = function(view) {
view.create();
// Fit to size of the container, apply padding
this.resizeView(view);
// this.resizeView(view);
// Render Chain
return view.display(this.book.request)
@ -263,8 +263,7 @@ EPUBJS.Rendition.prototype.afterDisplayed = function(currView){
var index = this.views.indexOf(currView);
var prevView, nextView;
this.resizeView(currView);
// this.resizeView(currView);
if(index + 1 === this.views.length && next) {
nextView = new EPUBJS.View(next);
@ -276,7 +275,8 @@ EPUBJS.Rendition.prototype.afterDisplayed = function(currView){
this.prepend(prevView);
}
this.removeShownListeners(currView);
// this.removeShownListeners(currView);
currView.onShown = this.afterDisplayed.bind(this);
};
@ -286,8 +286,10 @@ EPUBJS.Rendition.prototype.afterDisplayedAbove = function(currView){
// var prevTop = this.container.scrollTop;
// var prevLeft = this.container.scrollLeft;
if(currView.countered) return;
if(currView.countered) {
this.afterDisplayed(currView);
return;
}
// bounds = currView.bounds();
if(this.settings.axis === "vertical") {
@ -295,6 +297,7 @@ EPUBJS.Rendition.prototype.afterDisplayedAbove = function(currView){
} else {
this.infinite.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)
@ -420,16 +423,15 @@ EPUBJS.Rendition.prototype.isVisible = function(view, _container){
// Fit to size of the container, apply padding
// this.resizeView(view);
if(!view.shown && !this.rendering) {
console.log("render", view.index);
// console.log("render", view.index);
this.render(view);
}
} else {
if(view.shown) {
// console.log("off screen", view.index);
view.destroy();
console.log("destroy:", view.section.index)
// console.log("destroy:", view.section.index)
}
}
};
@ -476,7 +478,6 @@ EPUBJS.Rendition.prototype.erase = function(view, above){ //Trim
if(this.settings.axis === "vertical") {
this.infinite.scrollTo(0, prevTop - bounds.height, true);
} else {
console.log("remove left:", view.section.index)
this.infinite.scrollTo(prevLeft - bounds.width, 0, true);
}
}

103
lib/epubjs/view.js
View file

@ -9,8 +9,8 @@ EPUBJS.View = function(section) {
this.element.classList.add("epub-view");
this.element.style.display = "inline-block";
// this.element.style.minHeight = "100px";
this.element.style.height = 0;
this.element.style.width = 0;
this.element.style.height = "0px";
this.element.style.width = "0px";
this.element.style.overflow = "hidden";
@ -18,6 +18,10 @@ EPUBJS.View = function(section) {
this.rendered = false;
this.observe = false;
this.width = 0;
this.height = 0;
};
EPUBJS.View.prototype.create = function(width, height) {
@ -35,28 +39,36 @@ EPUBJS.View.prototype.create = function(width, height) {
this.resizing = true;
// this.iframe.style.display = "none";
this.iframe.style.visibility = "hidden";
this.element.appendChild(this.iframe);
this.rendered = true;
if(width || height){
this.resize(width, height);
}
// this.iframe.style.display = "none";
// this.iframe.style.visibility = "hidden";
this.element.appendChild(this.iframe);
this.rendered = true;
if(this.width && this.height){
this.resize(this.width, this.height);
}
return this.iframe;
};
// TODO: minimize resizes
EPUBJS.View.prototype.resize = function(width, height) {
var borders = this.borders();
if(width){
if(this.iframe) {
this.iframe.style.width = width + "px";
}
if(this.shown) {
this.element.style.width = height + "px";
this.element.style.width = width + borders.width + "px";
}
}
@ -65,7 +77,7 @@ EPUBJS.View.prototype.resize = function(width, height) {
this.iframe.style.height = height + "px";
}
if(this.shown) {
this.element.style.height = height + "px";
this.element.style.height = height + borders.height + "px";
}
}
@ -91,8 +103,6 @@ EPUBJS.View.prototype.resized = function(e) {
};
EPUBJS.View.prototype.display = function(_request) {
this.shown = true;
return this.section.render(_request)
.then(function(contents){
return this.load(contents);
@ -186,12 +196,17 @@ EPUBJS.View.prototype.expand = function(_defer, _count, _func) {
return expanded;
}
height = bounds.height; //this.document.documentElement.scrollHeight; //window.getComputedStyle?
width = this.document.documentElement.scrollWidth;
console.log("expand", count, this.index, height, width)
if(count <= MAX && (this.width != width || this.height != height)) {
// this.iframe.style.height = height + "px";
// this.iframe.style.width = width + "px";
this.resize(width, height);
setTimeout(function(){
count += 1;
if(_func){
@ -207,10 +222,7 @@ EPUBJS.View.prototype.expand = function(_defer, _count, _func) {
this.width = width;
this.height = height;
// this.iframe.style.height = height + "px";
// this.iframe.style.width = width + "px";
this.resize(width, height);
// expanding.resolve();
return expanded;
};
@ -247,25 +259,18 @@ EPUBJS.View.prototype.observe = function(target) {
EPUBJS.View.prototype.show = function() {
// this.iframe.style.display = "block";
this.style = window.getComputedStyle(this.element);
this.paddingTopBottom = parseInt(this.style.paddingTop) + parseInt(this.style.paddingBottom) || 0;
this.paddingLeftRight = parseInt(this.style.paddingLeft) + parseInt(this.style.paddingRight) || 0;
this.marginTopBottom = parseInt(this.style.marginTop) + parseInt(this.style.marginBottom) || 0;
this.marginLeftRight = parseInt(this.style.marginLeft) + parseInt(this.style.marginRight) || 0;
this.borderTopBottom = parseInt(this.style.borderTop) + parseInt(this.style.borderBottom) || 0;
this.borderLeftRight = parseInt(this.style.borderLeft) + parseInt(this.style.borderRight) || 0;
var borders = this.borders();
this.element.style.width = this.width + "px";
this.element.style.height = this.height + "px";
this.element.style.width = this.width + borders.width + "px";
this.element.style.height = this.height + borders.height + "px";
// this.iframe.style.display = "inline-block";
// this.iframe.style.visibility = "visible";
this.onShown(this);
this.trigger("shown", this);
this.iframe.style.visibility = "visible";
this.shown = true;
this.onShown(this);
this.trigger("shown", this);
};
EPUBJS.View.prototype.hide = function() {
@ -282,6 +287,37 @@ EPUBJS.View.prototype.onShown = function(view) {
// Stub, override with a custom functions
};
EPUBJS.View.prototype.borders = function() {
if(this.iframe && !this.iframeStyle) {
this.iframeStyle = window.getComputedStyle(this.iframe);
this.paddingTopBottom = parseInt(this.iframeStyle.paddingTop) + parseInt(this.iframeStyle.paddingBottom) || 0;
this.paddingLeftRight = parseInt(this.iframeStyle.paddingLeft) + parseInt(this.iframeStyle.paddingRight) || 0;
this.marginTopBottom = parseInt(this.iframeStyle.marginTop) + parseInt(this.iframeStyle.marginBottom) || 0;
this.marginLeftRight = parseInt(this.iframeStyle.marginLeft) + parseInt(this.iframeStyle.marginRight) || 0;
this.borderTopBottom = parseInt(this.iframeStyle.borderTop) + parseInt(this.iframeStyle.borderBottom) || 0;
this.borderLeftRight = parseInt(this.iframeStyle.borderLeft) + parseInt(this.iframeStyle.borderRight) || 0;
}
if(this.element && !this.elementStyle) {
this.elementStyle = window.getComputedStyle(this.element);
this.elpaddingTopBottom = parseInt(this.elementStyle.paddingTop) + parseInt(this.elementStyle.paddingBottom) || 0;
this.elpaddingLeftRight = parseInt(this.elementStyle.paddingLeft) + parseInt(this.elementStyle.paddingRight) || 0;
this.elmarginTopBottom = parseInt(this.elementStyle.marginTop) + parseInt(this.elementStyle.marginBottom) || 0;
this.elmarginLeftRight = parseInt(this.elementStyle.marginLeft) + parseInt(this.elementStyle.marginRight) || 0;
this.elborderTopBottom = parseInt(this.elementStyle.borderTop) + parseInt(this.elementStyle.borderBottom) || 0;
this.elborderLeftRight = parseInt(this.elementStyle.borderLeft) + parseInt(this.elementStyle.borderRight) || 0;
}
return {
height: this.paddingTopBottom + this.marginTopBottom + this.borderTopBottom,
width: this.paddingLeftRight + this.marginLeftRight + this.borderLeftRight
}
};
EPUBJS.View.prototype.bounds = function() {
// var bounds = this.element.getBoundingClientRect();
// var bounds = {
@ -289,8 +325,8 @@ EPUBJS.View.prototype.bounds = function() {
// height: this.element.offsetHeight
// };
return {
height: this.height + this.paddingTopBottom + this.marginTopBottom + this.borderTopBottom,
width: this.width + this.paddingLeftRight + this.marginLeftRight + this.borderLeftRight
height: this.height + this.paddingTopBottom + this.marginTopBottom + this.borderTopBottom + this.elpaddingTopBottom + this.elmarginTopBottom + this.elborderTopBottom,
width: this.width + this.paddingLeftRight + this.marginLeftRight + this.borderLeftRight + this.elpaddingLeftRight + this.elmarginLeftRight + this.elborderLeftRight
}
};
@ -303,8 +339,9 @@ EPUBJS.View.prototype.destroy = function() {
this.shown = false;
this.iframe = null;
}
// this.element.style.height = 0;
// this.element.style.width = 0;
// this.element.style.height = "0px";
// this.element.style.width = "0px";
};
RSVP.EventTarget.mixin(EPUBJS.View.prototype);