update to make it work when it's out of focus

This commit is contained in:
zyqunix 2025-01-21 21:22:09 +01:00
parent 10022e6d93
commit cd314cfe4a
2 changed files with 47 additions and 21 deletions

View file

@ -9,13 +9,39 @@ const sound = new Audio('/assets/pipe.mp3');
let timer = null;
let isActive = false;
let remainingTime = 0;
let startTime = null;
function formatTime(duration) {
const milliseconds = Math.floor((duration % 1000) / 10);
const seconds = Math.floor((duration / 1000) % 60);
const minutes = Math.floor((duration / 1000 / 60) % 60);
const hours = Math.floor(duration / 1000 / 60 / 60);
return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}:${String(milliseconds).padStart(2, '0')}`;
return `${
String(hours).padStart(2, '0')
}:${
String(minutes).padStart(2, '0')
}:${
String(seconds).padStart(2, '0')
}:${
String(milliseconds).padStart(2, '0')
}`;
}
function updateTimer() {
const now = Date.now();
const elapsed = now - startTime;
remainingTime -= elapsed;
startTime = now;
if (remainingTime <= 0) {
clearInterval(timer);
sound.play();
time.textContent = "00:00:00:00";
isActive = false;
start.innerHTML = "Start";
} else {
time.textContent = formatTime(remainingTime);
}
}
start.addEventListener('click', () => {
@ -38,19 +64,9 @@ start.addEventListener('click', () => {
isActive = true;
start.innerHTML = "Stop";
startTime = Date.now();
timer = setInterval(() => {
remainingTime -= 10;
if (remainingTime <= 0) {
clearInterval(timer);
sound.play();
time.textContent = "00:00:00:00";
isActive = false;
start.innerHTML = "Start";
} else {
time.textContent = formatTime(remainingTime);
}
}, 10);
timer = setInterval(updateTimer, 10);
} else {
isActive = false;
clearInterval(timer);

View file

@ -12,10 +12,23 @@ let elapsedTime = 0;
function formatTime(duration) {
const milliseconds = Math.floor((duration % 1000) / 10);
const seconds = Math.floor((duration / 1000) % 60);
const minutes = Math.floor((duration / 1000) / 60);
const hours = Math.floor((duration / 1000) / 60 / 60);
const minutes = Math.floor((duration / 1000) / 60) % 60;
const hours = Math.floor((duration / 1000) / 3600);
return `
${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}:${String(milliseconds).padStart(2, '0')}`;
${
String(hours).padStart(2, '0')
}:${
String(minutes).padStart(2, '0')
}:${
String(seconds).padStart(2, '0')
}:${
String(milliseconds).padStart(2, '0')
}`;
}
function updateTimer() {
elapsedTime = Date.now() - startTime;
time.textContent = formatTime(elapsedTime);
}
start.addEventListener('click', () => {
@ -23,10 +36,7 @@ start.addEventListener('click', () => {
isActive = true;
start.innerHTML = "Stop";
startTime = Date.now() - elapsedTime;
timer = setInterval(() => {
elapsedTime = Date.now() - startTime;
time.textContent = formatTime(elapsedTime);
}, 10);
timer = setInterval(updateTimer, 10);
} else {
isActive = false;
clearInterval(timer);