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

Add scrollType detection util, remove lang rtl guess

Browse source
This commit is contained in:
Fred Chasen 2020-05-15 10:55:29 -07:00
parent 5081589d25
commit da430d6cb1
5 changed files with 98 additions and 80 deletions
Download patch file Download diff file Expand all files Collapse all files

12
src/contents.js
View file

@ -449,7 +449,7 @@ class Contents {
var width, height;
// Test size again
clearTimeout(this.expanding);
requestAnimationFrame(this.resizeCheck.bind(this));
requestAnimationFrame(this.resizeCheck.bind(this));
}
/**
@ -698,7 +698,7 @@ class Contents {
key = "epubjs-inserted-css-" + (key || '');
if(!this.document) return false;
// Check if link already exists
styleEl = this.document.getElementById(key);
if (!styleEl) {
@ -712,7 +712,7 @@ class Contents {
/**
* Append stylesheet css
* @param {string} serializedCss
* @param {string} serializedCss
* @param {string} key If the key is the same, the CSS will be replaced instead of inserted
*/
addStylesheetCss(serializedCss, key) {
@ -721,7 +721,7 @@ class Contents {
var styleEl;
styleEl = this._getStylesheetNode(key);
styleEl.innerHTML = serializedCss;
return true;
}
@ -1026,8 +1026,8 @@ class Contents {
this.layoutStyle("paginated");
if (dir === "rtl") {
this.direction(dir);
if (dir === "rtl") {
this.direction(dir);
}
this.width(width);

89
src/managers/default/index.js
View file

@ -1,5 +1,6 @@
import EventEmitter from "event-emitter";
import {extend, defer, windowBounds, isNumber} from "../../utils/core";
import scrollType from "../../utils/scrolltype";
import Mapping from "../../mapping";
import Queue from "../../utils/queue";
import Stage from "../helpers/stage";
@ -60,28 +61,7 @@ class DefaultViewManager {
this.settings.size = size;
//Detect RTL scroll type
var definer = document.createElement('div');
definer.style.position = "absolute";
definer.style.width = "1px";
definer.style.height = "1px";
definer.style.overflow = "scroll";
definer.dir="rtl";
definer.appendChild(document.createTextNode('A'));
document.body.appendChild(definer);
var type = 'reverse';
if (definer.scrollLeft > 0) {
type = 'default';
} else {
definer.scrollLeft = 1;
if (definer.scrollLeft === 0) {
type = 'negative';
}
}
document.body.removeChild(definer);
this.settings.rtlScrollType = type;
this.settings.rtlScrollType = scrollType();
// Save the stage
this.stage = new Stage({
@ -352,7 +332,7 @@ class DefaultViewManager {
moveTo(offset){
var distX = 0,
distY = 0;
distY = 0;
if(!this.isPaginated) {
distY = offset.top;
@ -457,25 +437,23 @@ class DefaultViewManager {
this.scrollLeft = this.container.scrollLeft;
if (this.settings.rtlScrollType === "default"){
left = this.container.scrollLeft;
if (this.settings.rtlScrollType === "default"){
left = this.container.scrollLeft;
if (left > 0) {
this.scrollBy(this.layout.delta, 0, true);
} else {
next = this.views.last().section.next();
}
if (left > 0) {
this.scrollBy(this.layout.delta, 0, true);
} else {
next = this.views.last().section.next();
}
else{
left = this.container.scrollLeft + ( this.layout.delta * -1 );
if (left > this.container.scrollWidth * -1){
this.scrollBy(this.layout.delta, 0, true);
}
else{
next = this.views.last().section.next();
} else {
left = this.container.scrollLeft + ( this.layout.delta * -1 );
}
if (left > this.container.scrollWidth * -1){
this.scrollBy(this.layout.delta, 0, true);
} else {
next = this.views.last().section.next();
}
}
} else if (this.isPaginated && this.settings.axis === "vertical") {
@ -519,7 +497,7 @@ class DefaultViewManager {
var prev;
var left;
let dir = this.settings.direction;
console.log(dir);
if(!this.views.length) return;
if(this.isPaginated && this.settings.axis === "horizontal" && (!dir || dir === "ltr")) {
@ -538,25 +516,24 @@ class DefaultViewManager {
this.scrollLeft = this.container.scrollLeft;
if (this.settings.rtlScrollType === "default"){
left = this.container.scrollLeft + this.container.offsetWidth + this.layout.delta;
if (this.settings.rtlScrollType === "default"){
left = this.container.scrollLeft + this.container.offsetWidth + this.layout.delta;
if (left <= this.container.scrollWidth) {
this.scrollBy(-this.layout.delta, 0, true);
} else {
prev = this.views.first().section.prev();
}
if (left <= this.container.scrollWidth) {
this.scrollBy(-this.layout.delta, 0, true);
} else {
prev = this.views.first().section.prev();
}
else{
left = this.container.scrollLeft;
if (left < 0) {
this.scrollBy(-this.layout.delta, 0, true);
} else {
prev = this.views.first().section.prev();
}
}
else{
left = this.container.scrollLeft;
if (left < 0) {
this.scrollBy(-this.layout.delta, 0, true);
} else {
prev = this.views.first().section.prev();
}
}
} else if (this.isPaginated && this.settings.axis === "vertical") {
@ -588,7 +565,7 @@ class DefaultViewManager {
.then(function(){
var left;
if (this.layout.name === "pre-paginated" && this.layout.divisor > 1) {
left = prev.prev();
left = prev.prev();
if (left) {
return this.prepend(left);
}
@ -599,7 +576,7 @@ class DefaultViewManager {
.then(function(){
if(this.isPaginated && this.settings.axis === "horizontal") {
if (this.settings.direction === "rtl") {
if (this.settings.rtlScrollType === "default"){
if (this.settings.rtlScrollType === "default"){
this.scrollTo(0, 0, true);
}
else{

17
src/packaging.js
View file

@ -59,22 +59,7 @@ class Packaging {
this.uniqueIdentifier = this.findUniqueIdentifier(packageDocument);
this.metadata = this.parseMetadata(metadataNode);
// Detect book direction - default ltr
//RTL detection
//1. spineNode attributes page-progression-direction
//2. Language metadata field check against rtl languages
this.metadata.direction = ( function() {
var defaultDirection = "ltr";
var rtlLanguages =
["ar", "arc", "dv", "fa", "ha", "he", "khw", "ku", "ps", "ur", "yi"];
var isRTLLanguage = rtlLanguages.indexOf(this.metadata.language.toLowerCase()) > -1;
return spineNode.getAttribute("page-progression-direction") ||
isRTLLanguage ? "rtl" : "" ||
defaultDirection;
}.bind(this))();
this.metadata.direction = spineNode.getAttribute("page-progression-direction");
return {
"metadata" : this.metadata,

5
src/rendition.js
View file

@ -53,7 +53,8 @@ class Rendition {
stylesheet: null,
resizeOnOrientationChange: true,
script: null,
snap: false
snap: false,
defaultDirection: "ltr"
});
extend(this.settings, options);
@ -227,7 +228,7 @@ class Rendition {
});
}
this.direction(this.book.package.metadata.direction);
this.direction(this.book.package.metadata.direction || this.settings.defaultDirection);
// Parse metadata to get layout props
this.settings.globalLayoutProperties = this.determineLayoutProperties(this.book.package.metadata);

55
src/utils/scrolltype.js Normal file
View file

@ -0,0 +1,55 @@
// Detect RTL scroll type
// Based on https://github.com/othree/jquery.rtl-scroll-type/blob/master/src/jquery.rtl-scroll.js
export default function scrollType() {
var type = "reverse";
var definer = createDefiner();
document.body.appendChild(definer);
if (definer.scrollLeft > 0) {
type = "default";
} else {
if (typeof Element !== 'undefined' && Element.prototype.scrollIntoView) {
definer.children[0].children[1].scrollIntoView();
if (definer.scrollLeft < 0) {
type = "negative";
}
} else {
definer.scrollLeft = 1;
if (definer.scrollLeft === 0) {
type = "negative";
}
}
}
document.body.removeChild(definer);
return type;
}
export function createDefiner() {
var definer = document.createElement('div');
definer.dir="rtl";
definer.style.position = "fixed";
definer.style.width = "1px";
definer.style.height = "1px";
definer.style.top = "0px";
definer.style.left = "0px";
definer.style.overflow = "hidden";
var innerDiv = document.createElement('div');
innerDiv.style.width = "2px";
var spanA = document.createElement('span');
spanA.style.width = "1px";
spanA.style.display = "inline-block";
var spanB = document.createElement('span');
spanB.style.width = "1px";
spanB.style.display = "inline-block";
innerDiv.appendChild(spanA);
innerDiv.appendChild(spanB);
definer.appendChild(innerDiv);
return definer;
}