1
0
Fork 0
mirror of https://github.com/futurepress/epub.js.git synced 2025-10-03 14:59:18 +02:00

split rendition into view managers

This commit is contained in:
fchasen 2016-03-24 22:45:58 -04:00
parent d9a19e5a28
commit 48216cc7ec
20 changed files with 4683 additions and 2188 deletions

View file

@ -1,7 +1,19 @@
var core = require('./core');
function Reflowable(){
this.columnAxis = core.prefixed('columnAxis');
this.columnGap = core.prefixed('columnGap');
this.columnWidth = core.prefixed('columnWidth');
this.columnFill = core.prefixed('columnFill');
this.width = 0;
this.height = 0;
this.spread = 0;
this.delta = 0;
this.column = 0;
this.gap = 0;
this.divisor = 0;
};
Reflowable.prototype.calculate = function(_width, _height, _gap, _devisor){
@ -48,32 +60,39 @@ Reflowable.prototype.calculate = function(_width, _height, _gap, _devisor){
};
Reflowable.prototype.format = function(view){
Reflowable.prototype.format = function(contents){
var $doc = view.document.documentElement;
var $body = view.document.body;//view.document.querySelector("body");
// var $doc = doc.documentElement;
// var $body = doc.body;//view.document.querySelector("body");
$doc.style.overflow = "hidden";
// $doc.style.overflow = "hidden";
contents.overflow("hidden");
// Must be set to the new calculated width or the columns will be off
// $body.style.width = this.width + "px";
$doc.style.width = this.width + "px";
// $doc.style.width = this.width + "px";
contents.width(this.width);
//-- Adjust height
$body.style.height = this.height + "px";
// $body.style.height = this.height + "px";
contents.height(this.height);
//-- Add columns
$body.style[this.columnAxis] = "horizontal";
$body.style[this.columnFill] = "auto";
$body.style[this.columnGap] = this.gap+"px";
$body.style[this.columnWidth] = this.column+"px";
// $body.style[this.columnAxis] = "horizontal";
contents.css(this.columnAxis, "horizontal");
// $body.style[this.columnFill] = "auto";
contents.css(this.columnFill, "auto");
// $body.style[this.columnGap] = this.gap+"px";
contents.css(this.columnGap, this.gap+"px");
// $body.style[this.columnWidth] = this.column +"px";
contents.css(this.columnWidth, this.column+"px");
// Add extra padding for the gap between this and the next view
view.iframe.style.marginRight = this.gap+"px";
// view.iframe.style.marginRight = this.gap+"px";
};
Reflowable.prototype.count = function(view) {
var totalWidth = view.root().scrollWidth;
Reflowable.prototype.count = function(totalWidth) {
// var totalWidth = view.root().scrollWidth;
var spreads = Math.ceil(totalWidth / this.spread);
return {
@ -83,41 +102,51 @@ Reflowable.prototype.count = function(view) {
};
function Fixed(_width, _height){
this.width = 0;
this.height = 0;
};
Fixed.prototype.calculate = function(_width, _height){
this.width = _width;
this.height = _height;
};
Fixed.prototype.format = function(view){
var width, height;
var $doc = view.document.documentElement;
var $viewport = documentElement.querySelector("[name=viewport");
/**
* check for the viewport size
* <meta name="viewport" content="width=1024,height=697" />
*/
if($viewport && $viewport.hasAttribute("content")) {
content = $viewport.getAttribute("content");
contents = content.split(',');
if(contents[0]){
width = contents[0].replace("width=", '');
}
if(contents[1]){
height = contents[1].replace("height=", '');
}
}
Fixed.prototype.format = function(contents){
var viewport = contents.viewport();
// var width, height;
//
// var $doc = doc.documentElement;
// var $viewport = $doc.querySelector("[name=viewport");
//
// /**
// * check for the viewport size
// * <meta name="viewport" content="width=1024,height=697" />
// */
// if($viewport && $viewport.hasAttribute("content")) {
// content = $viewport.getAttribute("content");
// contents = content.split(',');
// if(contents[0]){
// width = contents[0].replace("width=", '');
// }
// if(contents[1]){
// height = contents[1].replace("height=", '');
// }
// }
//-- Adjust width and height
// $doc.style.width = width + "px" || "auto";
// $doc.style.height = height + "px" || "auto";
view.resize(width, height);
if (viewport.width) {
contents.width(viewport.width);
}
if (viewport.height) {
contents.height(viewport.height);
}
//-- Scroll
$doc.style.overflow = "auto";
// $doc.style.overflow = "auto";
contents.overflow("auto");
};
@ -129,7 +158,11 @@ Fixed.prototype.count = function(){
};
function Scroll(){
this.width = 0;
this.height = 0;
this.spread = 0;
this.column = 0;
this.gap = 0;
};
Scroll.prototype.calculate = function(_width, _height){
@ -138,12 +171,14 @@ Scroll.prototype.calculate = function(_width, _height){
this.gap = 0;
};
Scroll.prototype.format = function(view){
Scroll.prototype.format = function(contents){
var $doc = view.document.documentElement;
// var $doc = doc.documentElement;
$doc.style.width = "auto";
$doc.style.height = "auto";
// $doc.style.width = "auto";
// $doc.style.height = "auto";
contents.width("auto");
contents.height("auto");
};