Merge branch 'master' into Develop

cps/static/css/libs/typeahead.css

@@ -157,7 +157,6 @@ fieldset[disabled] .twitter-typeahead .tt-input {
   list-style: none;
   font-size: 14px;
   background-color: #ffffff;
-  border: 1px solid #cccccc;
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 4px;
   -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);

cps/static/js/libs/pwstrength/pwstrength-bootstrap.js

@@ -183,7 +183,7 @@ try {
                 ];
                 $.each(sequences, function(ignore, sequence) {
                     for (j = 0; j < word.length - 2; j += 1) {
-                        // iterate the word trough a sliding window of size 3:
+                        // iterate the word through a sliding window of size 3:
                         if (
                             sequence.indexOf(
                                 word.toLowerCase().substring(j, j + 3)

cps/static/js/main.js

@@ -49,7 +49,7 @@ function elementSorter(a, b) {
     return 0;
 }
 
-// Generic control/related handler to show/hide fields based on a checkbox' value
+// Generic control/related handler to show/hide fields based on a 'checkbox' value
 // e.g.
 //  <input type="checkbox" data-control="stuff-to-show">
 //  <div data-related="stuff-to-show">...</div>
@@ -63,7 +63,7 @@ $(document).on("change", "input[type=\"checkbox\"][data-control]", function () {
     });
 });
 
-// Generic control/related handler to show/hide fields based on a select' value
+// Generic control/related handler to show/hide fields based on a 'select' value
 $(document).on("change", "select[data-control]", function() {
     var $this = $(this);
     var name = $this.data("control");
@@ -79,7 +79,7 @@ $(document).on("change", "select[data-control]", function() {
     }
 });
 
-// Generic control/related handler to show/hide fields based on a select' value
+// Generic control/related handler to show/hide fields based on a 'select' value
 // this one is made to show all values if select value is not 0
 $(document).on("change", "select[data-controlall]", function() {
     var $this = $(this);

cps/static/js/reading/epub-progress.js

@@ -1,54 +0,0 @@
-/**
- * waits until queue is finished, meaning the book is done loading
- * @param callback
- */
-function qFinished(callback){
-    let timeout=setInterval(()=>{
-        if(reader.rendition.q.running===undefined)
-            clearInterval(timeout);
-            callback();
-        },300
-    )
-}
-
-function calculateProgress(){
-    let data=reader.rendition.location.end;
-    return Math.round(epub.locations.percentageFromCfi(data.cfi)*100);
-}
-
-// register new event emitter locationchange that fires on urlchange
-// source: https://stackoverflow.com/a/52809105/21941129
-(() => {
-    let oldPushState = history.pushState;
-    history.pushState = function pushState() {
-        let ret = oldPushState.apply(this, arguments);
-        window.dispatchEvent(new Event('locationchange'));
-        return ret;
-    };
-
-    let oldReplaceState = history.replaceState;
-    history.replaceState = function replaceState() {
-        let ret = oldReplaceState.apply(this, arguments);
-        window.dispatchEvent(new Event('locationchange'));
-        return ret;
-    };
-
-    window.addEventListener('popstate', () => {
-        window.dispatchEvent(new Event('locationchange'));
-    });
-})();
-
-window.addEventListener('locationchange',()=>{
-    let newPos=calculateProgress();
-    progressDiv.textContent=newPos+"%";
-});
-
-var epub=ePub(calibre.bookUrl)
-
-let progressDiv=document.getElementById("progress");
-
-qFinished(()=>{
-    epub.locations.generate().then(()=> {
-    window.dispatchEvent(new Event('locationchange'))
-});
-})

cps/static/js/reading/epub.js

@@ -52,6 +52,32 @@ var reader;
         }
     });
 
+    // Update progress percentage
+    let progressDiv = document.getElementById("progress");
+    reader.book.ready.then((()=>{
+        let locations_key = reader.book.key()+'-locations';
+        let stored_locations = localStorage.getItem(locations_key);
+        let make_locations, save_locations;
+        if (stored_locations) {
+            make_locations = Promise.resolve(reader.book.locations.load(stored_locations));
+            // No-op because locations are already saved
+            save_locations = ()=>{};
+        } else {
+            make_locations = reader.book.locations.generate();
+            save_locations = ()=>{
+                localStorage.setItem(locations_key, reader.book.locations.save());
+            };
+        }
+        make_locations.then(()=>{
+            reader.rendition.on('relocated', (location)=>{
+                let percentage = Math.round(location.end.percentage*100);
+                progressDiv.textContent=percentage+"%";
+            });
+            reader.rendition.reportLocation();
+            progressDiv.style.visibility = "visible";
+        }).then(save_locations);
+    }));
+
     /**
      * @param {string} action - Add or remove bookmark
      * @param {string|int} location - Location or zero

cps/static/js/reading/locationchange-polyfill.js

@@ -0,0 +1,21 @@
+// register new event emitter locationchange that fires on urlchange
+// source: https://stackoverflow.com/a/52809105/21941129
+(() => {
+    let oldPushState = history.pushState;
+    history.pushState = function pushState() {
+        let ret = oldPushState.apply(this, arguments);
+        window.dispatchEvent(new Event('locationchange'));
+        return ret;
+    };
+
+    let oldReplaceState = history.replaceState;
+    history.replaceState = function replaceState() {
+        let ret = oldReplaceState.apply(this, arguments);
+        window.dispatchEvent(new Event('locationchange'));
+        return ret;
+    };
+
+    window.addEventListener('popstate', () => {
+        window.dispatchEvent(new Event('locationchange'));
+    });
+})();