summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--css/read.css16
-rw-r--r--js/read.js9
-rw-r--r--read.html61
-rw-r--r--themes/mocca.css2
-rw-r--r--themes/night.css3
-rw-r--r--worker.js1
6 files changed, 65 insertions, 27 deletions
diff --git a/css/read.css b/css/read.css
index f1f1172..6b9ddd2 100644
--- a/css/read.css
+++ b/css/read.css
@@ -1,11 +1,3 @@
-body.night {
- background : black;
- color : #999;
-}
-
-body.night .loading {
- background : black;
-}
.loading {
position : absolute;
color : #999;
@@ -37,7 +29,7 @@ body.night .loading {
.footer {
bottom : 5px;
left : 0px;
- width : 100%;
+ width : 100%;
height : 24px;
}
.header, .footer {
@@ -76,7 +68,7 @@ body.night .loading {
top : 32px;
bottom : 32px;
left : 96px;
- right : 96px;
+ right : 96px;
}
@media (max-width: 992px) {
@@ -98,7 +90,7 @@ body.night .loading {
right : 48px;
}
.toolbar {
- width : 128px;
+ width : 96px;
}
}
@@ -108,7 +100,7 @@ body.night .loading {
right : 32px;
}
.toolbar {
- width : 96px;
+ width : 64px;
}
}
diff --git a/js/read.js b/js/read.js
index 9d74792..ec85233 100644
--- a/js/read.js
+++ b/js/read.js
@@ -144,7 +144,12 @@ function apply_styles() {
var lineHeight = res[2] ? res[2] + "%" : DEFAULT_LINE_HEIGHT + "%";
var themeName = res[3] ? res[3] : false;
- $("#reader iframe").contents().find("*")
+ book.setStyle("fontSize", fontSize);
+ book.setStyle("fontFamily", fontFamily);
+ book.setStyle("lineHeight", lineHeight);
+ book.setStyle("textAlign", "justify");
+
+ $("#reader iframe").contents().find("p")
.css("background", "")
.css("color", "")
.css("background-color", "")
@@ -153,8 +158,6 @@ function apply_styles() {
.css("line-height", lineHeight)
.css("text-align", "justify");
- $("#reader").show();
-
});
}
diff --git a/read.html b/read.html
index dab5767..aef9d91 100644
--- a/read.html
+++ b/read.html
@@ -66,8 +66,9 @@
<div class="col-sm-9">
<select class="theme_name form-control" onchange="change_theme(this)">
<option value="default">Default</option>
- <option value="night">Night</option>
<option value="mocca">Mocca</option>
+ <option value="night">Night</option>
+ <option value="plan9">Plan9</option>
</select>
</div>
</div>
@@ -259,6 +260,8 @@
}
$(document).ready(function() {
+ apply_theme();
+
$(window).on('online', function() {
console.log("we're online, storing lastread");
@@ -362,13 +365,25 @@
});
init_taps();
- apply_theme();
document.onkeydown = hotkey_handler;
localforage.getItem("epube.enable-fullscreen").then(function(enable) {
_enable_fullscreen = enable;
});
+ EPUBJS.Hooks.register("beforeChapterDisplay").applyTheme = function(callback, renderer) {
+ var baseUrl = window.location.href.match(/^.*\//)[0];
+
+console.log('tn', themeName);
+
+ $(book.renderer.doc.head)
+ .append($("<link rel='stylesheet' id='theme_css' type='text/css'>")
+ .attr('href', baseUrl + 'themes/' + themeName + '.css'));
+
+
+ if (callback) callback();
+ }
+
EPUBJS.Hooks.register("beforeChapterDisplay").swipeDetection = function(callback, renderer) {
var baseUrl = window.location.href.match(/^.*\//)[0];
@@ -379,9 +394,6 @@
EPUBJS.core.addCss(baseUrl + "css/reader.css", null, renderer.doc.head);
- $(book.renderer.doc.head)
- .append("<link rel='stylesheet' id='theme_css' type='text/css' href='themes/default.css'>")
-
localforage.getItem("epube.disable-swipes").then(function(noswipes) {
if (!noswipes) {
@@ -425,9 +437,30 @@
});
}
- window.book = book;
+ var fontSize;
+ var fontFamily;
+ var lineHeight;
+ var 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';
+
+ book.setStyle("fontSize", fontSize);
+ book.setStyle("fontFamily", fontFamily);
+ book.setStyle("lineHeight", lineHeight);
+ book.setStyle("textAlign", "justify");
+ });
- var rendered = book.renderTo("reader");
+ window.book = book;
+ rendered = book.renderTo("reader");
$('#settings-modal').on('shown.bs.modal', function() {
@@ -646,10 +679,18 @@
});
book.on("renderer:chapterDisplayed", function() {
- $("#reader").hide();
- apply_theme();
- apply_styles();
+ // variables defined above after reading from localforage
+
+ $("#reader iframe").contents().find("p")
+ .css("background", "")
+ .css("color", "")
+ .css("background-color", "")
+ .css("font-family", fontFamily)
+ .css("font-size", fontSize)
+ .css("line-height", lineHeight)
+ .css("text-align", "justify");
+
});
book.on("renderer:keydown", hotkey_handler);
diff --git a/themes/mocca.css b/themes/mocca.css
index 42e88c6..fd27f9c 100644
--- a/themes/mocca.css
+++ b/themes/mocca.css
@@ -1,4 +1,4 @@
-body {
+body, .loading {
background : #3B3228;
color : #D0C8C6;
}
diff --git a/themes/night.css b/themes/night.css
index 782300b..12c6d87 100644
--- a/themes/night.css
+++ b/themes/night.css
@@ -1,4 +1,5 @@
-body {
+body, .loading {
background : black;
color : #ccc;
}
+
diff --git a/worker.js b/worker.js
index abca0b4..fec8908 100644
--- a/worker.js
+++ b/worker.js
@@ -20,6 +20,7 @@ self.addEventListener('install', function(event) {
'themes/default.css',
'themes/mocca.css',
'themes/night.css',
+ 'themes/plan9.css',
'lib/promise.js',
'lib/fetch.js',
'lib/zip.min.js',