make viewer RTL-agnostic
This commit is contained in:
parent
ecb63ced83
commit
528ad4e6f2
|
@ -5,18 +5,18 @@ html, body {
|
|||
margin: 0;
|
||||
}
|
||||
|
||||
#button-next, #button-prev {
|
||||
#button-left, #button-right {
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
width: 30vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
#button-next {
|
||||
#button-left {
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
#button-prev {
|
||||
#button-right {
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
|
|
|
@ -5,6 +5,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
let paused = true;
|
||||
let interval;
|
||||
let elapsed = 0;
|
||||
let rtl = (localStorage.getItem(`${WORK_ID}-rtl`) !== "false");
|
||||
|
||||
function startTimer() {
|
||||
if (interval) {
|
||||
|
@ -78,6 +79,22 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
}
|
||||
}
|
||||
|
||||
function left() {
|
||||
if (currentPage === 0) {
|
||||
rtl = true;
|
||||
localStorage.setItem(`${WORK_ID}-rtl`, rtl);
|
||||
}
|
||||
changePage(currentPage + (rtl ? 1 : -1));
|
||||
}
|
||||
|
||||
function right() {
|
||||
if (currentPage === 0) {
|
||||
rtl = false;
|
||||
localStorage.setItem(`${WORK_ID}-rtl`, rtl);
|
||||
}
|
||||
changePage(currentPage + (rtl ? -1 : 1));
|
||||
}
|
||||
|
||||
function exitToWork() {
|
||||
changeDuration(duration, true);
|
||||
localStorage.setItem(`${WORK_ID}-currentPage`, 0);
|
||||
|
@ -93,7 +110,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
changeDuration(duration, !paused);
|
||||
break;
|
||||
case 37: //left
|
||||
changePage(currentPage - 1);
|
||||
left();
|
||||
break;
|
||||
case 38: //up
|
||||
if (2 <= duration && duration <= 10) {
|
||||
|
@ -105,7 +122,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
}
|
||||
break;
|
||||
case 39: //right
|
||||
changePage(currentPage + 1);
|
||||
right();
|
||||
break;
|
||||
case 40: //down
|
||||
if (duration < 10) {
|
||||
|
@ -122,7 +139,7 @@ document.addEventListener('DOMContentLoaded', () => {
|
|||
}
|
||||
};
|
||||
|
||||
document.getElementById("button-next").onclick = () => { changePage(currentPage + 1); };
|
||||
document.getElementById("button-prev").onclick = () => { changePage(currentPage - 1); };
|
||||
document.getElementById("button-left").onclick = left;
|
||||
document.getElementById("button-right").onclick = right;
|
||||
document.getElementById("button-back").onclick = exitToWork;
|
||||
});
|
||||
|
|
|
@ -17,8 +17,8 @@
|
|||
<div id="page-num"></div>
|
||||
<div id="duration"></div>
|
||||
<div id="controls">
|
||||
<div id="button-next"></div>
|
||||
<div id="button-prev"></div>
|
||||
<div id="button-left"></div>
|
||||
<div id="button-right"></div>
|
||||
<div id="button-back"></div>
|
||||
</div>
|
||||
<div id="image-container"></div>
|
||||
|
|
Loading…
Reference in a new issue