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

Scrolling Renderer remove views when they leave the screen

Browse source
This commit is contained in:
Fred Chasen 2014-08-14 17:35:45 -04:00
parent 87bd3a68ad
commit c6465177c5
9 changed files with 371 additions and 175 deletions
Download patch file Download diff file Expand all files Collapse all files

90
lib/epubjs/view.js
View file

@ -1,4 +1,4 @@
EPUBJS.View = function(options) {
EPUBJS.View = function(width, height) {
this.id = "epubjs-view:" + EPUBJS.core.uuid();
this.loading = new RSVP.defer();
this.loaded = this.loading.promise;
@ -13,9 +13,10 @@ EPUBJS.View.prototype.load = function(contents) {
this.document = this.iframe.contentDocument;
this.iframe.onload = function(e) {
this.iframe.addEventListener("load", function(event) {
var layout;
this.window = this.iframe.contentWindow;
this.window.addEventListener("resize", this.resized.bind(this), false);
this.document = this.iframe.contentDocument;
this.iframe.style.display = "block";
@ -25,15 +26,25 @@ EPUBJS.View.prototype.load = function(contents) {
this.document.body.style.display = "inline-block";
this.layout();
// This needs to run twice to get to the correct size sometimes?
this.layout();
this.iframe.style.visibility = "visible";
setTimeout(function(){
this.window.addEventListener("resize", this.resized.bind(this), false);
}.bind(this), 10); // Wait to listen for resize events
this.document.fonts.onloading = function(){
console.log("loaded fonts");
// this.layout();
}.bind(this);
// this.observer = this.observe(this.document);
loading.resolve(this);
this.loading.resolve(this);
}.bind(this);
}.bind(this));
// this.iframe.srcdoc = contents;
this.document.open();
@ -43,11 +54,6 @@ EPUBJS.View.prototype.load = function(contents) {
return loaded;
};
EPUBJS.View.prototype.unload = function() {
};
EPUBJS.View.prototype.create = function() {
this.iframe = document.createElement('iframe');
this.iframe.id = this.id;
@ -55,16 +61,19 @@ EPUBJS.View.prototype.create = function() {
this.iframe.seamless = "seamless";
// Back up if seamless isn't supported
this.iframe.style.border = "none";
this.resizing = true;
this.iframe.width = "100%";
this.iframe.style.height = "0";
this.iframe.style.height = "100%";
this.iframe.style.display = "none";
this.iframe.style.visibility = "hidden";
return this.iframe;
};
EPUBJS.View.prototype.resized = function() {
EPUBJS.View.prototype.resized = function(e) {
if (!this.resizing) {
this.layout();
@ -75,32 +84,48 @@ EPUBJS.View.prototype.resized = function() {
};
EPUBJS.View.prototype.layout = function() {
var bounds = {}, content, width = 0, height = 0;
this.resizing = true;
var bounds;
console.log("layout")
// Check bounds
bounds = this.document.body.getBoundingClientRect();
if(!bounds || (bounds.height == 0 && bounds.width == 0)) {
console.error("View not shown");
}
// Apply Changes
this.resizing = true;
this.iframe.style.height = bounds.height + "px";
this.iframe.style.width = bounds.width + "px";
// this.iframe.style.width = bounds.width + "px";
// Check again
content = this.document.body.getBoundingClientRect();
bounds = this.document.body.getBoundingClientRect();
this.resizing = true;
this.iframe.style.height = bounds.height + "px";
// this.iframe.style.width = bounds.width + "px";
height = content.height;
width = content.width;
this.width = bounds.width;
this.height = bounds.height;
this.width = width;
this.height = height;
// if(bounds.height != content.height || bounds.width != content.width) {
// // this.layout();
// console.log(bounds, content)
// }
};
EPUBJS.View.prototype.observe = function(target) {
var renderer = this;
// create an observer instance
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
renderer.layout();
});
});
// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true, subtree: true };
// pass in the target node, as well as the observer options
observer.observe(target, config);
return observer;
};
EPUBJS.View.prototype.appendTo = function(element) {
@ -118,6 +143,9 @@ EPUBJS.View.prototype.bounds = function() {
};
EPUBJS.View.prototype.destroy = function() {
// Stop observing
// this.observer.disconnect();
this.element.removeChild(this.iframe);
};