64 lines
1.7 KiB
JavaScript
64 lines
1.7 KiB
JavaScript
const time = document.getElementById('time');
|
|
const start = document.getElementById('start');
|
|
const reset = document.getElementById('reset');
|
|
const lap = document.getElementById('lap');
|
|
const lapList = document.getElementById('lap-list');
|
|
|
|
let isActive = false;
|
|
let timer = null;
|
|
let startTime = null;
|
|
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) % 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')
|
|
}`;
|
|
}
|
|
|
|
function updateTimer() {
|
|
elapsedTime = Date.now() - startTime;
|
|
time.textContent = formatTime(elapsedTime);
|
|
}
|
|
|
|
start.addEventListener('click', () => {
|
|
if (! isActive) {
|
|
isActive = true;
|
|
start.innerHTML = "Stop";
|
|
startTime = Date.now() - elapsedTime;
|
|
timer = setInterval(updateTimer, 10);
|
|
} else {
|
|
isActive = false;
|
|
clearInterval(timer);
|
|
start.innerHTML = "Start";
|
|
}
|
|
});
|
|
|
|
reset.addEventListener('click', () => {
|
|
isActive = false;
|
|
clearInterval(timer);
|
|
timer = null;
|
|
startTime = null;
|
|
elapsedTime = 0;
|
|
time.textContent = "00:00:00:00";
|
|
start.innerHTML = "Start";
|
|
lapList.innerHTML = "";
|
|
});
|
|
|
|
lap.addEventListener('click', () => {
|
|
if (isActive) {
|
|
const lapTime = document.createElement('li');
|
|
lapTime.textContent = formatTime(elapsedTime);
|
|
lapList.appendChild(lapTime);
|
|
}
|
|
});
|