smoother progress bar, prevent browser from interfering with escape key

This commit is contained in:
xenofem 2024-01-25 14:11:28 -05:00
parent 6461b05bb2
commit b295ee2ad8

View file

@ -1,3 +1,5 @@
const PROGRESS_UPDATE_INTERVAL = 50;
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
const pages = Array.from(document.querySelectorAll('img.viewer-image')); const pages = Array.from(document.querySelectorAll('img.viewer-image'));
let currentPage = parseInt(localStorage.getItem(`${WORK_ID}-currentPage`)) || 0; let currentPage = parseInt(localStorage.getItem(`${WORK_ID}-currentPage`)) || 0;
@ -16,13 +18,13 @@ document.addEventListener('DOMContentLoaded', () => {
if (paused) { if (paused) {
return; return;
} }
elapsed += 100; elapsed += PROGRESS_UPDATE_INTERVAL;
if (elapsed >= duration*1000) { if (elapsed >= duration*1000) {
changePage(currentPage + 1); changePage(currentPage + 1);
} }
updateBar(); updateBar();
}, },
100 PROGRESS_UPDATE_INTERVAL,
); );
} }
@ -119,15 +121,19 @@ document.addEventListener('DOMContentLoaded', () => {
switch (event.key) { switch (event.key) {
case "ArrowLeft": case "ArrowLeft":
event.preventDefault();
left(); left();
break; break;
case "ArrowRight": case "ArrowRight":
event.preventDefault();
right(); right();
break; break;
case " ": case " ":
event.preventDefault();
changeDuration(duration, !paused); changeDuration(duration, !paused);
break; break;
case "ArrowUp": case "ArrowUp":
event.preventDefault();
if (2 <= duration && duration <= 10) { if (2 <= duration && duration <= 10) {
changeDuration(duration - 1, false); changeDuration(duration - 1, false);
} else if (10 < duration && duration <= 20) { } else if (10 < duration && duration <= 20) {
@ -137,6 +143,7 @@ document.addEventListener('DOMContentLoaded', () => {
} }
break; break;
case "ArrowDown": case "ArrowDown":
event.preventDefault();
if (duration < 10) { if (duration < 10) {
changeDuration(duration + 1, false); changeDuration(duration + 1, false);
} else if (10 <= duration && duration < 20) { } else if (10 <= duration && duration < 20) {
@ -146,9 +153,11 @@ document.addEventListener('DOMContentLoaded', () => {
} }
break; break;
case "Enter": case "Enter":
event.preventDefault();
restart(); restart();
break; break;
case "Escape": case "Escape":
event.preventDefault();
exitToWork(); exitToWork();
break; break;
} }