From 086a8112e6ff7eedf793ed84c081e5e940a3755f Mon Sep 17 00:00:00 2001 From: xenofem Date: Sat, 27 Apr 2024 05:03:58 -0400 Subject: [PATCH] add multi-tap commands for fast seeking and switching rtl --- dlibrary/static/viewer.js | 45 ++++++++++++++++++++++++++++++++++----- 1 file changed, 40 insertions(+), 5 deletions(-) diff --git a/dlibrary/static/viewer.js b/dlibrary/static/viewer.js index b1a47b2..a81edf2 100644 --- a/dlibrary/static/viewer.js +++ b/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() {