1
0
Fork 0
mirror of https://github.com/futurepress/epub.js.git synced 2025-10-04 15:09:16 +02:00

Resizing based on container size

This commit is contained in:
Fred Chasen 2014-09-16 17:25:48 -04:00
parent 251ac3cdc4
commit cf603fcca8
4 changed files with 162 additions and 58 deletions

View file

@ -100,6 +100,17 @@ EPUBJS.Renderer.prototype.resize = function(_width, _height){
var width = _width;
var height = _height;
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 stagewidth = width - padding.left - padding.right;
var stageheight = height - padding.top - padding.bottom;
if(!_width) {
width = window.innerWidth;
}
@ -107,14 +118,23 @@ EPUBJS.Renderer.prototype.resize = function(_width, _height){
height = window.innerHeight;
}
this.container.style.width = width + "px";
this.container.style.height = height + "px";
// this.container.style.width = width + "px";
// this.container.style.height = height + "px";
this.trigger("resized", {
width: this.width,
height: this.height
});
this.views.forEach(function(view){
if(this.settings.axis === "vertical") {
view.resize(stagewidth, 0);
} else {
view.resize(0, stageheight);
}
}.bind(this));
};
EPUBJS.Renderer.prototype.onResized = function(e) {
@ -192,9 +212,11 @@ EPUBJS.Renderer.prototype.display = function(what){
// TODO: check for fragments
var split = what.split("#");
var href = split[0];
this.book.opened.then(function(){
var section = this.book.spine.get(what);
var section = this.book.spine.get(href);
var rendered;
this.displaying = true;
@ -231,6 +253,16 @@ EPUBJS.Renderer.prototype.render = function(section){
var rendered;
var 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(!section) {
rendered = new RSVP.defer();
@ -241,9 +273,9 @@ EPUBJS.Renderer.prototype.render = function(section){
view = new EPUBJS.View(section);
if(this.settings.axis === "vertical") {
view.create(bounds.width, 0);
view.create(width, 0);
} else {
view.create(0, bounds.height);
view.create(0, height);
}
@ -263,7 +295,7 @@ EPUBJS.Renderer.prototype.render = function(section){
return view.expand();
}.bind(this))
.then(function(){
// this.rendering = false;
this.rendering = false;
view.show();
this.trigger("rendered", view.section);
return view;
@ -334,7 +366,7 @@ EPUBJS.Renderer.prototype.backwards = function(view){
rendered.reject(new Error("Reject Backwards"));
return rendered.promise;
}
console.log("going backwards")
// console.log("going backwards")
this.rendering = true;
@ -408,7 +440,7 @@ EPUBJS.Renderer.prototype.fillVertical = function() {
if (height && bottom && (bottom < height)) { //&& (this.last().section.index + 1 < this.book.spine.length)) {
return this.forwards().then(this.fillVertical.bind(this));
} else {
// this.rendering = false;
this.rendering = false;
defer.resolve();
return defer.promise;
}
@ -422,7 +454,7 @@ EPUBJS.Renderer.prototype.fillHorizontal = function() {
if (width && right && (right <= width)) { //&& (this.last().section.index + 1 < this.book.spine.length)) {
return this.forwards().then(this.fillHorizontal.bind(this));
} else {
// this.rendering = false;
this.rendering = false;
defer.resolve();
return defer.promise;
}
@ -514,7 +546,7 @@ EPUBJS.Renderer.prototype.replacements = function(view, renderer) {
EPUBJS.Renderer.prototype.afterDisplay = function(view, renderer) {
var task = new RSVP.defer();
view.document.documentElement.style.padding = this.settings.padding;
// view.document.documentElement.style.padding = this.settings.padding;
task.resolve();
return task.promise;
};