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

update layout to use format and calculatePages, properties array

Browse source
This commit is contained in:
Fred Chasen 2014-01-26 21:54:09 -08:00
parent 96ada6783b
commit 0b6d852586
5 changed files with 109 additions and 49 deletions
Download patch file Download diff file Expand all files Collapse all files

2
hooks/default/smartimages.js
View file

@ -4,7 +4,7 @@ EPUBJS.Hooks.register("beforeChapterDisplay").smartimages = function(callback, r
iheight = renderer.height,//chapter.bodyEl.clientHeight,//chapter.doc.body.getBoundingClientRect().height,
oheight;
if(renderer.settings.layout != "reflowable") {
if(renderer.layoutSettings.layout != "reflowable") {
callback();
return; //-- Only adjust images for reflowable text
}

11
src/book.js
View file

@ -759,16 +759,19 @@ EPUBJS.Book.prototype.addHeadTag = function(tag, attrs) {
};
EPUBJS.Book.prototype.useSpreads = function(use) {
if(use) {
this.renderer.setMinSpreadWidth(this.settings.minSpreadWidth);
console.warn("useSpreads is deprecated, use forceSingle or set a layoutOveride instead");
if(use === false) {
this.forceSingle(true);
} else {
this.renderer.setMinSpreadWidth(0);
this.forceSingle(false);
}
};
EPUBJS.Book.prototype.forceSingle = function(use) {
this.renderer.forceSingle(use);
if(this.isRendered) {
this.renderer.reformat();
}
};
EPUBJS.Book.prototype.unload = function(){

70
src/layout.js
View file

@ -1,6 +1,11 @@
EPUBJS.Layout = EPUBJS.Layout || {};
EPUBJS.Layout.Reflowable = function(documentElement, _width, _height){
EPUBJS.Layout.Reflowable = function(){
this.documentElement = null;
this.spreadWidth = null;
};
EPUBJS.Layout.Reflowable.prototype.format = function(documentElement, _width, _height){
// Get the prefixed CSS commands
var columnAxis = EPUBJS.core.prefixed('columnAxis');
var columnGap = EPUBJS.core.prefixed('columnGap');
@ -11,9 +16,9 @@ EPUBJS.Layout.Reflowable = function(documentElement, _width, _height){
var section = Math.ceil(width / 8);
var gap = (section % 2 === 0) ? section : section - 1;
this.documentElement = documentElement;
//-- Single Page
var spreadWidth = (width + gap);
var totalWidth, displayedPages;
this.spreadWidth = (width + gap);
documentElement.style.width = "auto"; //-- reset width for calculations
@ -29,19 +34,30 @@ EPUBJS.Layout.Reflowable = function(documentElement, _width, _height){
documentElement.style.width = width + "px";
return {
pageWidth : this.spreadWidth,
pageHeight : _height
};
};
totalWidth = documentElement.scrollWidth;
displayedPages = Math.round(totalWidth / spreadWidth);
EPUBJS.Layout.Reflowable.prototype.calculatePages = function() {
var totalWidth, displayedPages;
this.documentElement.style.width = "auto"; //-- reset width for calculations
totalWidth = this.documentElement.scrollWidth;
displayedPages = Math.round(totalWidth / this.spreadWidth);
return {
pageWidth : spreadWidth,
pageHeight : _height,
displayedPages : displayedPages,
pageCount : displayedPages
};
};
EPUBJS.Layout.ReflowableSpreads = function(documentElement, _width, _height){
EPUBJS.Layout.ReflowableSpreads = function(){
this.documentElement = null;
this.spreadWidth = null;
};
EPUBJS.Layout.ReflowableSpreads.prototype.format = function(documentElement, _width, _height){
var columnAxis = EPUBJS.core.prefixed('columnAxis');
var columnGap = EPUBJS.core.prefixed('columnGap');
var columnWidth = EPUBJS.core.prefixed('columnWidth');
@ -56,15 +72,16 @@ EPUBJS.Layout.ReflowableSpreads = function(documentElement, _width, _height){
//-- Double Page
var colWidth = Math.floor((width - gap) / divisor);
var spreadWidth = (colWidth + gap) * divisor;
var totalWidth, displayedPages;
this.documentElement = documentElement;
this.spreadWidth = (colWidth + gap) * divisor;
documentElement.style.width = "auto"; //-- reset width for calculations
documentElement.style.overflow = "hidden";
documentElement.style.width = width + "px";
//documentElement.style.width = width + "px";
//-- Adjust height
documentElement.style.height = _height + "px";
@ -74,20 +91,29 @@ EPUBJS.Layout.ReflowableSpreads = function(documentElement, _width, _height){
documentElement.style[columnGap] = gap+"px";
documentElement.style[columnWidth] = colWidth+"px";
totalWidth = documentElement.scrollWidth;
displayedPages = Math.ceil(totalWidth / spreadWidth);
return {
pageWidth : this.spreadWidth,
pageHeight : _height
};
};
EPUBJS.Layout.ReflowableSpreads.prototype.calculatePages = function() {
var totalWidth = this.documentElement.scrollWidth;
var displayedPages = Math.round(totalWidth / this.spreadWidth);
//-- Add a page to the width of the document to account an for odd number of pages
documentElement.style.width = totalWidth + spreadWidth + "px";
this.documentElement.style.width = totalWidth + this.spreadWidth + "px";
return {
pageWidth : spreadWidth,
pageHeight : _height,
displayedPages : displayedPages,
pageCount : displayedPages * 2
};
};
EPUBJS.Layout.Fixed = function(){
this.documentElement = null;
};
EPUBJS.Layout.Fixed = function(documentElement, _width, _height){
var columnWidth = EPUBJS.core.prefixed('columnWidth');
var viewport = documentElement.querySelector("[name=viewport");
@ -95,6 +121,7 @@ EPUBJS.Layout.Fixed = function(documentElement, _width, _height){
var contents;
var width, height;
this.documentElement = documentElement;
/**
* check for the viewport size
* <meta name="viewport" content="width=1024,height=697" />
@ -123,9 +150,14 @@ EPUBJS.Layout.Fixed = function(documentElement, _width, _height){
return {
pageWidth : width,
pageHeight : height,
displayedPages : 1,
pageCount : 1
pageHeight : height
};
};
EPUBJS.Layout.Fixed.prototype.calculatePages = function(){
return {
displayedPages : 1,
pageCount : 1
};
};

5
src/parser.js
View file

@ -219,11 +219,12 @@ EPUBJS.Parser.prototype.spine = function(spineXml, manifest){
items.forEach(function(item, index){
var Id = item.getAttribute('idref');
var cfiBase = epubcfi.generateChapter(spineNodeIndex, index, Id);
var props = item.getAttribute('properties') || '';
var vert = {
'id' : Id,
'linear' : item.getAttribute('linear') || '',
'properties' : item.getAttribute('properties') || '',
'manifestProperties' : manifest[Id].properties || '',
'properties' : props.split(' '),
'manifestProperties' : manifest[Id].properties.split(' '),
'href' : manifest[Id].href,
'url' : manifest[Id].url,
'index' : index,

56
src/renderer.js
View file

@ -19,8 +19,11 @@ EPUBJS.Renderer = function(renderMethod) {
this.epubcfi = new EPUBJS.EpubCFI();
this.spreads = true;
this.forceSingle = false;
this.resized = _.throttle(this.onResized.bind(this), 10);
this.layoutSettings = {};
//-- Adds Hook methods to the Book prototype
// Hooks will all return before triggering the callback.
EPUBJS.Hooks.mixin(this);
@ -91,7 +94,7 @@ EPUBJS.Renderer.prototype.displayChapter = function(chapter, globalLayout){
this.currentChapterCfiBase = chapter.cfiBase;
this.settings = this.reconcileLayoutSettings(globalLayout, chapter.properties);
this.layoutSettings = this.reconcileLayoutSettings(globalLayout, chapter.properties);
// Get the url string from the chapter (may be from storage)
return chapter.url().
@ -111,16 +114,24 @@ EPUBJS.Renderer.prototype.load = function(url){
var deferred = new RSVP.defer();
var loaded;
this.layoutMethod = this.determineLayout(this.settings);
// Switch to the required layout method for the settings
this.layoutMethod = this.determineLayout(this.layoutSettings);
this.layout = new EPUBJS.Layout[this.layoutMethod];
this.visible(false);
loaded = this.render.load(url);
loaded.then(function(contents) {
var formated;
this.contents = contents;
this.doc = this.render.document;
// Format the contents using the current layout method
formated = this.layout.format(contents, this.render.width, this.render.height);
this.render.setPageDimensions(formated.pageWidth, formated.pageHeight);
if(!this.initWidth && !this.initHeight){
this.render.window.addEventListener("resize", this.resized, false);
}
@ -130,6 +141,7 @@ EPUBJS.Renderer.prototype.load = function(url){
//-- Trigger registered hooks before displaying
this.beforeDisplay(function(){
var pages = this.layout.calculatePages();
var msg = this.currentChapter;
msg.cfi = this.currentLocationCfi = this.getPageCfi();
@ -137,8 +149,7 @@ EPUBJS.Renderer.prototype.load = function(url){
this.trigger("renderer:chapterDisplayed", msg);
this.trigger("renderer:pageChanged", this.currentLocationCfi);
this.layout = this.layoutMethod(contents, this.render.width, this.render.height);
this.updatePages(this.layout);
this.updatePages(pages);
this.visible(true);
@ -157,9 +168,7 @@ EPUBJS.Renderer.prototype.load = function(url){
* Returns: Object with layout properties
*/
EPUBJS.Renderer.prototype.reconcileLayoutSettings = function(global, chapter){
var properties = chapter.split(' ');
var settings = {};
var spreads = true;
//-- Get the global defaults
for (var attr in global) {
@ -168,7 +177,7 @@ EPUBJS.Renderer.prototype.reconcileLayoutSettings = function(global, chapter){
}
}
//-- Get the chapter's display type
properties.forEach(function(prop){
chapter.forEach(function(prop){
var rendition = prop.replace("rendition:", '');
var split = rendition.indexOf("-");
var property, value;
@ -216,7 +225,7 @@ EPUBJS.Renderer.prototype.determineLayout = function(settings){
this.spreads = spreads;
this.render.scroll(scroll);
this.trigger("renderer:spreads", spreads);
return EPUBJS.Layout[layoutMethod];
return layoutMethod;
};
// Shortcut to trigger the hook before displaying the chapter
@ -227,25 +236,29 @@ EPUBJS.Renderer.prototype.beforeDisplay = function(callback, renderer){
// Update the renderer with the information passed by the layout
EPUBJS.Renderer.prototype.updatePages = function(layout){
this.displayedPages = layout.displayedPages;
this.currentChapter.pages = layout.displayedPages;
this.render.setPageDimensions(layout.pageWidth, layout.pageHeight);
this.currentChapter.pages = layout.pageCount;
};
// Apply the layout again and jump back to the previous cfi position
EPUBJS.Renderer.prototype.reformat = function(){
var renderer = this;
var formated, pages;
if(!this.contents) return;
this.layout = this.layoutMethod(this.contents, this.render.width, this.render.height);
this.updatePages(this.layout);
formated = this.layout.format(this.contents, this.render.width, this.render.height);
this.render.setPageDimensions(formated.pageWidth, formated.pageHeight);
setTimeout(function(){
pages = renderer.layout.calculatePages();
renderer.updatePages(pages);
// Give the css styles time to update
clearTimeout(this.timeoutTillCfi);
this.timeoutTillCfi = setTimeout(function(){
//-- Go to current page after formating
if(renderer.currentLocationCfi){
renderer.gotoCfi(renderer.currentLocationCfi);
}
this.timeoutTillCfi = null;
}, 10);
};
@ -469,7 +482,8 @@ EPUBJS.Renderer.prototype.onResized = function(e){
// Only re-layout if the spreads have switched
if(spreads != this.spreads){
this.spreads = spreads;
this.layoutMethod = this.determineLayout(this.settings);
this.layoutMethod = this.determineLayout(this.layoutSettings);
this.layout = new EPUBJS.Layout[this.layoutMethod];
}
if(this.contents){
@ -537,13 +551,23 @@ EPUBJS.Renderer.prototype.setMinSpreadWidth = function(width){
};
EPUBJS.Renderer.prototype.determineSpreads = function(cutoff){
if(this.width < cutoff || !cutoff) {
if(this.forceSingle || !cutoff || this.width < cutoff) {
return false; //-- Single Page
}else{
return true; //-- Double Page
}
};
EPUBJS.Renderer.prototype.forceSingle = function(bool){
if(bool) {
this.forceSingle = true;
this.spreads = false;
} else {
this.forceSingle = false;
this.spreads = this.determineSpreads(width);
}
};
//-- Content Replacements
EPUBJS.Renderer.prototype.replace = function(query, func, finished, progress){