add multi-tap commands for fast seeking and switching rtl

dlibrary/static/viewer.js

@@ -1,6 +1,10 @@
 const PRELOAD_BACKWARD = 2;
 const PRELOAD_FORWARD = 8;
 
+const COMMAND_SEQUENCE_MAX_INTERVAL = 400;
+
+const ACCEL_PAGE_MOVEMENT = 10;
+
 document.addEventListener('DOMContentLoaded', () => {
     const currentImage = document.getElementById('current-image');
     const preloadImages = document.getElementById('preload-images');
@@ -14,6 +18,9 @@ document.addEventListener('DOMContentLoaded', () => {
     let timerLastRun = null;
     let timerAnimationRequestID = null;
 
+    let commandSequence = [];
+    let lastCommandTime = 0;
+
     function requestTimer() {
         timerAnimationRequestID = window.requestAnimationFrame(runTimer);
     }
@@ -79,10 +86,17 @@ document.addEventListener('DOMContentLoaded', () => {
         elapsed = 0;
         updateBar();
 
+        if (pageNum >= IMAGES.length) {
+            pageNum = IMAGES.length - 1;
+        }
+        if (pageNum < 0) {
+            pageNum = 0;
+        }
+
         const previous = IMAGES[currentPage];
         const current = IMAGES[pageNum];
 
-        if (current == null) {
+        if (current === null) {
             return;
         }
 
@@ -112,20 +126,41 @@ document.addEventListener('DOMContentLoaded', () => {
         }
     }
 
+    function updateCommandSequence(cmd) {
+        const now = Date.now();
+        if (now - lastCommandTime > COMMAND_SEQUENCE_MAX_INTERVAL) {
+            commandSequence = [];
+        }
+        lastCommandTime = now;
+        commandSequence.push(cmd);
+        while (commandSequence.length > 3) {
+            commandSequence.shift();
+        }
+
+        const repeating = commandSequence.length === 3 && commandSequence[0] === cmd && commandSequence[1] === cmd;
+        const alternating = commandSequence.length === 3 && commandSequence[0] === cmd && commandSequence[1] !== cmd;
+        return {
+            pageMovement: repeating ? ACCEL_PAGE_MOVEMENT : 1,
+            setRtl: alternating,
+        };
+    }
+
     function left() {
-        if (currentPage === 0) {
+        const { pageMovement, setRtl } = updateCommandSequence("left");
+        if (currentPage === 0 || setRtl) {
             rtl = true;
             localStorage.setItem(`${WORK_ID}-rtl`, rtl);
         }
-        changePage(currentPage + (rtl ? 1 : -1));
+        changePage(currentPage + ((rtl ? 1 : -1) * pageMovement));
     }
 
     function right() {
-        if (currentPage === 0) {
+        const { pageMovement, setRtl } = updateCommandSequence("right");
+        if (currentPage === 0 || setRtl) {
             rtl = false;
             localStorage.setItem(`${WORK_ID}-rtl`, rtl);
         }
-        changePage(currentPage + (rtl ? -1 : 1));
+        changePage(currentPage + ((rtl ? -1 : 1) * pageMovement));
     }
 
     function restart() {