diff --git a/package.json b/package.json index 32b2849..728a29b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "epubjs", - "version": "0.3.22", + "version": "0.3.24", "description": "Parse and Render Epubs", "main": "lib/index.js", "jsnext:main": "src/index.js", diff --git a/src/contents.js b/src/contents.js index ec214e1..818f356 100644 --- a/src/contents.js +++ b/src/contents.js @@ -735,8 +735,8 @@ class Contents { this.css("background-color", "transparent"); } - mapPage(cfiBase, start, end) { - var mapping = new Mapping(); + mapPage(cfiBase, layout, start, end, dev) { + var mapping = new Mapping(layout, dev); return mapping.page(this, cfiBase, start, end); } diff --git a/src/layout.js b/src/layout.js index 92bb62f..0d34ed9 100644 --- a/src/layout.js +++ b/src/layout.js @@ -9,6 +9,7 @@ */ class Layout { constructor(settings) { + this.settings = settings; this.name = settings.layout || "reflowable"; this._spread = (settings.spread === "none") ? false : true; this._minSpreadWidth = settings.minSpreadWidth || 800; @@ -30,6 +31,20 @@ class Layout { this.columnWidth = 0; this.gap = 0; this.divisor = 1; + + this.props = { + name: this.name, + spread: this._spread, + flow: this._flow, + width: 0, + height: 0, + spreadWidth: 0, + delta: 0, + columnWidth: 0, + gap: 0, + divisor: 1 + }; + } /** @@ -44,6 +59,7 @@ class Layout { } else { this._flow = "paginated"; } + this.props.flow = this._flow; } return this._flow; } @@ -56,11 +72,16 @@ class Layout { */ spread(spread, min) { - this._spread = (spread === "none") ? false : true; + if (spread) { + this._spread = (spread === "none") ? false : true; + this.props.spread = this._spread; + } if (min >= 0) { this._minSpreadWidth = min; } + + return this._spread; } /** @@ -121,6 +142,15 @@ class Layout { this.columnWidth = colWidth; this.gap = gap; this.divisor = divisor; + + this.props.width = width; + this.props.height = _height; + this.props.spreadWidth = spreadWidth; + this.props.delta = delta; + + this.props.columnWidth = colWidth; + this.props.gap = gap; + this.props.divisor = divisor; } /** diff --git a/src/managers/default/index.js b/src/managers/default/index.js index 21df4b8..ee96040 100644 --- a/src/managers/default/index.js +++ b/src/managers/default/index.js @@ -442,7 +442,7 @@ class DefaultViewManager { endA = startA + (container.top - visible[0].position().bottom); startB = (container.top - visible[last].position().top) + offset; - endB = startB + pageHeight; + endB = pageHeight - startB; startPage = this.mapping.page(visible[0].contents, visible[0].section.cfiBase, startA, endA) endPage = this.mapping.page(visible[last].contents, visible[last].section.cfiBase, startB, endB); @@ -629,7 +629,7 @@ class DefaultViewManager { this.layout = layout; this.updateLayout(); - this.mapping = new Mapping(this.layout); + this.mapping = new Mapping(this.layout.props); // this.manager.layout(this.layout.format); } diff --git a/src/mapping.js b/src/mapping.js index 0f51c1e..c04a6b8 100644 --- a/src/mapping.js +++ b/src/mapping.js @@ -3,7 +3,7 @@ import EpubCFI from "./epubcfi"; class Mapping { constructor(layout, dev) { this.layout = layout; - this.horizontal = (this.layout.flow() === "paginated") ? true : false; + this.horizontal = (this.layout.flow === "paginated") ? true : false; this._dev = dev; } @@ -67,14 +67,15 @@ class Mapping { findRanges(view){ var columns = []; var scrollWidth = view.contents.scrollWidth(); - var count = this.layout.count(scrollWidth); - var column = this.layout.column; + var spreads = Math.ceil( scrollWidth / this.layout.spreadWidth); + var count = spreads * this.layout.divisor; + var columnWidth = this.layout.columnWidth; var gap = this.layout.gap; var start, end; for (var i = 0; i < count.pages; i++) { - start = (column + gap) * i; - end = (column * (i+1)) + (gap * i); + start = (columnWidth + gap) * i; + end = (columnWidth * (i+1)) + (gap * i); columns.push({ start: this.findStart(view.document.body, start, end), end: this.findEnd(view.document.body, start, end) diff --git a/src/rendition.js b/src/rendition.js index 8fb2917..c48c4bc 100644 --- a/src/rendition.js +++ b/src/rendition.js @@ -431,7 +431,7 @@ class Rendition { this._layout = new Layout(settings); this._layout.spread(settings.spread, this.settings.minSpreadWidth); - this.mapping = new Mapping(this._layout); + this.mapping = new Mapping(this._layout.props); } if (this.manager && this._layout) { diff --git a/src/utils/core.js b/src/utils/core.js index 31abdad..cf246c3 100644 --- a/src/utils/core.js +++ b/src/utils/core.js @@ -1,4 +1,8 @@ export const requestAnimationFrame = (typeof window != "undefined") ? (window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame) : false; +const ELEMENT_NODE = 1; +const TEXT_NODE = 3; +const COMMENT_NODE = 8; +const DOCUMENT_NODE = 9; export function isElement(obj) { return !!(obj && obj.nodeType == 1); @@ -242,11 +246,11 @@ export function indexOfNode(node, typeId) { } export function indexOfTextNode(textNode) { - return indexOfNode(textNode, Node.TEXT_NODE); + return indexOfNode(textNode, TEXT_NODE); } export function indexOfElementNode(elementNode) { - return indexOfNode(elementNode, Node.ELEMENT_NODE); + return indexOfNode(elementNode, ELEMENT_NODE); } export function isXml(ext) {