From 50b99afa069931418d663deb6e5515006558e4dd Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Thu, 29 Nov 2018 15:53:10 +0300 Subject: move inline scripts from read.html to read.js; fix some eslint-related stuff --- js/index.js | 7 + js/offline.js | 5 + js/read.js | 649 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++- read.html | 645 --------------------------------------------------------- 4 files changed, 659 insertions(+), 647 deletions(-) diff --git a/js/index.js b/js/index.js index c0f2e84..a16dd44 100644 --- a/js/index.js +++ b/js/index.js @@ -4,6 +4,7 @@ let _dl_progress_timeout; +/* exported cache_refresh */ function cache_refresh(force) { if ('serviceWorker' in navigator) { localforage.getItem("epube.cache-timestamp").then(function(stamp) { @@ -21,6 +22,7 @@ function cache_refresh(force) { return false; } +/* exported toggle_fav */ function toggle_fav(elem) { const bookId = elem.getAttribute("data-book-id"); @@ -38,6 +40,7 @@ function toggle_fav(elem) { $(elem).html(msg).attr('data-is-fav', data.status); + /* global index_mode */ if (index_mode == "favorites" && data.status == 0) { $("#cell-" + bookId).remove(); } @@ -48,6 +51,7 @@ function toggle_fav(elem) { return false; } +/* global offline_remove */ function mark_offline(elem) { const bookId = elem.getAttribute("data-book-id"); @@ -78,6 +82,7 @@ function mark_offline(elem) { }); } +/* exported mark_offline_books */ function mark_offline_books() { const elems = $(".offline_dropitem"); @@ -159,6 +164,7 @@ function offline_cache(bookId, callback) { }); } +/* exported show_summary */ function show_summary(elem) { const id = elem.getAttribute("data-book-id"); @@ -176,6 +182,7 @@ function show_summary(elem) { return false; } +/* exported offline_get_all */ function offline_get_all() { if (confirm("Download all books on this page?")) { diff --git a/js/offline.js b/js/offline.js index 6fd3ddd..4f9a13a 100644 --- a/js/offline.js +++ b/js/offline.js @@ -2,6 +2,7 @@ /* global localforage, Holder */ +/* exported offline_search */ function offline_search() { const query = $(".search_query").val(); @@ -12,14 +13,17 @@ function offline_search() { return false; } +/* exported offline_remove2 */ function offline_remove2(elem) { const bookId = elem.getAttribute("data-book-id"); + /* global offline_remove */ return offline_remove(bookId, function() { $("#cell-" + bookId).remove(); }); } +/* exported offline_clear */ function offline_clear() { if (confirm("Remove all offline data?")) { @@ -151,6 +155,7 @@ function populate_list() { } +/* exported show_summary */ function show_summary(elem) { const bookId = elem.getAttribute("data-book-id"); diff --git a/js/read.js b/js/read.js index f82fc8d..04d2c15 100644 --- a/js/read.js +++ b/js/read.js @@ -1,7 +1,630 @@ 'use strict'; -/* global localforage, book, cacheId */ +/* globals ePub, localforage, book, cacheId */ +let _pagination_stored = 0; +let _last_position_sync = 0; +let _store_position = 0; + +//const _is_ios = (/iPad|iPhone|iPod/).test(navigator.userAgent) && !window.MSStream; +const _res_data = []; + +const DEFAULT_FONT_SIZE = 16; +const DEFAULT_FONT_FAMILY = "Georgia"; +const DEFAULT_LINE_HEIGHT = 140; + +function cacheId(suffix) { + return "epube-book." + $.urlParam("b") + (suffix ? "." + suffix : ""); +} + +function init_loader() { + // we need to preload resources for reader iframe because it can't utilize our + // service worker because while offline it is created outside our base server context + const res_names = [ "lib/bootstrap/v3/js/jquery.js", "lib/jquery.mobile.custom.js", + "css/transitions.css", + "js/reader.js", "css/reader.css", "js/dict.js", + "themes/default.css", "themes/mocca.css", "themes/night.css", + "themes/plan9.css", "themes/gray.css" ]; + + for (let i = 0; i < res_names.length; i++) { + fetch(res_names[i], {credentials: 'same-origin'}).then(function(resp) { + if (resp.status == 200) { + resp.text().then(function(data) { + const url = new URL(resp.url); + url.searchParams.delete("ts"); + + _res_data[url.toString()] = data; + }) + } else { + console.warn('loader failed for resource', res_names[i], resp); + } + }); + } + + check_resource_load(res_names, _res_data, 0); +} + +function check_resource_load(res_names, res_data, attempt) { + console.log("check_resource_load", attempt, res_names.length, Object.keys(res_data).length); + + if (attempt == 5) { + $(".loading_message").html("Unable to load resources."); + return; + } + + if (res_names.length != Object.keys(res_data).length) { + window.setTimeout(function() { + check_resource_load(res_names, res_data, attempt+1); + }, 250); + } else { + init_reader(); + } +} + +function init_reader() { + apply_theme(); + + $(window).on('online', function() { + console.log("we're online, storing lastread"); + + const currentCfi = book.rendition.currentLocation().start.cfi; + const currentPage = parseInt(book.locations.percentageFromCfi(currentCfi) * 100); + + $.post("backend.php", { op: "storelastread", id: $.urlParam("id"), page: currentPage, + cfi: currentCfi }, function(data) { + + if (data.cfi) { + _last_position_sync = new Date().getTime()/1000; + } + }) + .fail(function(e) { + if (e && e.status == 401) { + window.location = "index.php"; + } + }); + }); + + localforage.getItem(cacheId("book")).then(function(item) { + + // ios doesn't work with FileReader for whatever reason + if (/*!_is_ios &&*/ item) { + + console.log("loading from local storage"); + + const fileReader = new FileReader(); + + fileReader.onload = function() { + try { + book.open(this.result); + } catch (e) { + $(".loading_message").html("Unable to load book (local)."); + console.log(e); + } + }; + + fileReader.readAsArrayBuffer(item); + + } else { + + console.log("loading from network"); + + if (navigator.onLine) { + const book_url = "backend.php?op=download&id=" + $.urlParam("id"); + + $(".loading_message").html("Downloading..."); + + fetch(book_url, {credentials: 'same-origin'}).then(function(resp) { + + if (resp.status == 200) { + const bookId = $.urlParam("b"); + + // let's store this for later + localforage.setItem(cacheId('book'), resp.clone().blob()); + + // if there's no base information cached yet, let's do that too + localforage.getItem(cacheId()).then(function(info) { + if (!info) { + $.post("backend.php", {op: "getinfo", id: bookId }, function(data) { + if (data) { + localforage.setItem(cacheId(), data); + + if (data.has_cover) { + fetch("backend.php?op=cover&id=" + bookId, {credentials: 'same-origin'}).then(function(resp) { + if (resp.status == 200) { + localforage.setItem(cacheId('cover'), resp.blob()); + } + }); + } + } + }); + } + }); + + resp.blob().then(function(blob) { + + const fileReader = new FileReader(); + + fileReader.onload = function() { + book.open(this.result); + }; + + fileReader.readAsArrayBuffer(blob); + + }); + } else { + $(".loading_message").html("Unable to download book: " + resp.status + "."); + } + }).catch(function(err) { + console.warn(err); + + if ($(".loading").is(":visible")) { + $(".loading_message").html("Unable to load book (remote)."); + } + }); + + } else { + $(".loading_message").html("This book is not available offline."); + } + } + }); + + const book = ePub(); + window.book = book; + + const rendition = book.renderTo("reader", { + width: '100%', + height: '100%', + minSpreadWidth: 961 + }); + + const displayed = rendition.display(); + + // this sets default theme, then we apply CSS to already rendered content + // with apply_styles() + displayed.then(function () { + + let fontSize; + let fontFamily; + let lineHeight; + //let themeName; + + Promise.all([ + localforage.getItem("epube.fontSize"), + localforage.getItem("epube.fontFamily"), + localforage.getItem("epube.lineHeight"), + localforage.getItem("epube.theme") + ]).then(function(res) { + fontSize = res[0] ? res[0] + "px" : DEFAULT_FONT_SIZE + "px"; + fontFamily = res[1] ? res[1] : DEFAULT_FONT_FAMILY; + lineHeight = res[2] ? res[2] + "%" : DEFAULT_LINE_HEIGHT + "%"; + //themeName = res[3] ? res[3] : 'default'; + + rendition.themes.default({ + html: { + 'font-size': fontSize, + 'font-family': fontFamily, + 'line-height': lineHeight, + 'text-align': 'justify' + } + }); + + }); + }); + + rendition.hooks.content.register(function(contents) { + + contents.on("linkClicked", function(href) { + console.log('linkClicked', href); + + if (href.indexOf("://") == -1) { + $(".prev_location_btn") + .attr("data-location-cfi", book.rendition.currentLocation().start.cfi) + .show(); + + window.setTimeout(function() { + show_ui(true); + }, 50); + } + + }); + + const base_url = window.location.href.match(/^.*\//)[0]; + const res_names = [ "lib/bootstrap/v3/js/jquery.js", "lib/jquery.mobile.custom.js", + "js/reader.js", "js/dict.js" ]; + const doc = contents.document; + + for (let i = 0; i < res_names.length; i++) { + + // we need to create script element with proper context, that is inside the iframe + const elem = doc.createElement("script"); + elem.type = 'text/javascript'; + elem.text = _res_data[base_url + res_names[i]]; + + doc.head.appendChild(elem); + } + + $(contents.document.head) + .append($("