108 lines
No EOL
3.4 KiB
JavaScript
108 lines
No EOL
3.4 KiB
JavaScript
var curAction = "wait";
|
|
var previousAction = "wait"
|
|
var startTime = new Date();
|
|
var curTime = new Date();
|
|
var timeMS = 0;
|
|
var FlagMilisecond = 1;
|
|
var timer = document.getElementById("stopwatch").getElementsByClassName("timer")[0];
|
|
|
|
tick();
|
|
|
|
// NOT OPTIMIZED, place in start switch
|
|
var t = setInterval(tick, 10);
|
|
|
|
const sleep = ms => new Promise(r => setTimeout(r, ms));
|
|
|
|
async function Stopwatch(action) {
|
|
switch (action) {
|
|
case "start":
|
|
console.log("start function started");
|
|
if (previousAction == "start") { break; }
|
|
startTime = new Date();
|
|
curAction = "increase";
|
|
tick();
|
|
previousAction = "start";
|
|
document.getElementById("start-cro").style.color = "greenyellow";
|
|
document.getElementById("start-cro").style.borderTopColor = "greenyellow";
|
|
document.getElementById("start-cro").style.borderLeftColor = "greenyellow";
|
|
await sleep(200);
|
|
document.getElementById("start-cro").style.color = "grey";
|
|
document.getElementById("start-cro").style.borderTopColor = "grey";
|
|
document.getElementById("start-cro").style.borderLeftColor = "grey";
|
|
break;
|
|
case "stop":
|
|
curAction = "stop";
|
|
tick();
|
|
previousAction = "stop";
|
|
document.getElementById("stop-cro").style.color = "red";
|
|
document.getElementById("stop-cro").style.borderTopColor = "red";
|
|
document.getElementById("stop-cro").style.borderLeftColor = "red";
|
|
await sleep(200);
|
|
document.getElementById("stop-cro").style.color = "white";
|
|
document.getElementById("stop-cro").style.borderTopColor = "white";
|
|
document.getElementById("stop-cro").style.borderLeftColor = "white";
|
|
document.getElementById("start-cro").style.color = "white";
|
|
document.getElementById("start-cro").style.borderTopColor = "white";
|
|
document.getElementById("start-cro").style.borderLeftColor = "white";
|
|
break;
|
|
|
|
default:
|
|
// console.error("no action (old script)");
|
|
break;
|
|
}
|
|
}
|
|
|
|
function updateMsec() {
|
|
timer.getElementsByClassName("msec")[0].innerHTML = getDigits(Math.floor((timeMS / 10) % 100), 2);
|
|
}
|
|
|
|
function updateSec() {
|
|
timer.getElementsByClassName("sec")[0].innerHTML = getDigits(Math.floor((timeMS / 1000) % 60), 2);
|
|
}
|
|
|
|
function updateMin() {
|
|
timer.getElementsByClassName("min")[0].innerHTML = getDigits(Math.floor((timeMS / 1000 / 60) << 0), 2);
|
|
}
|
|
|
|
|
|
function getDigits(str, num) {
|
|
return ("0" + str).slice(-num);
|
|
}
|
|
|
|
function tick() {
|
|
switch (curAction) {
|
|
case "increase":
|
|
curTime = new Date();
|
|
timeMS = (curTime.getTime() - startTime.getTime());
|
|
if (FlagMilisecond) {
|
|
updateMsec();
|
|
}
|
|
updateSec();
|
|
updateMin();
|
|
break;
|
|
case "stop":
|
|
timer.getElementsByClassName("min")[0].innerHTML = "00";
|
|
timer.getElementsByClassName("sec")[0].innerHTML = "00";
|
|
timer.getElementsByClassName("msec")[0].innerHTML = "00";
|
|
curAction = "wait";
|
|
previousAction = "stop"
|
|
break;
|
|
default:
|
|
// console.error("no action (old script)");
|
|
break;
|
|
}
|
|
}
|
|
|
|
function toggleTimerMsec() {
|
|
let chx = document.getElementById("chx-timerMsec");
|
|
if (chx.checked) {
|
|
FlagMilisecond = 1;
|
|
timer.getElementsByClassName("msec")[0].style.display = "flex";
|
|
document.getElementById("stopwatch-msec-dot").style.display = "flex";
|
|
} else {
|
|
FlagMilisecond = 0;
|
|
timer.getElementsByClassName("msec")[0].style.display = "none";
|
|
document.getElementById("stopwatch-msec-dot").style.display = "none";
|
|
}
|
|
tick();
|
|
} |