diff --git a/javascript/chronometer.js b/javascript/chronometer.js index 7a13496..f7c2bce 100644 --- a/javascript/chronometer.js +++ b/javascript/chronometer.js @@ -1,34 +1,48 @@ class Chronometer { constructor() { - // ... your code goes here + // Initialize properties + this.currentTime = 0; + this.intervalId = null; } start(callback) { - // ... your code goes here + // Start the interval and increment time every second + this.intervalId = setInterval(() => { + this.currentTime++; + if (callback) callback(); // Execute callback if provided + }, 1000); } getMinutes() { - // ... your code goes here + // Calculate whole minutes passed + return Math.floor(this.currentTime / 60); } getSeconds() { - // ... your code goes here + // Get the remainder seconds after the last full minute + return this.currentTime % 60; } computeTwoDigitNumber(value) { - // ... your code goes here + // Ensure the value is two digits, padding with a leading 0 if needed + return value.toString().padStart(2, '0'); } stop() { - // ... your code goes here + // Stop the interval using the stored intervalId + clearInterval(this.intervalId); } reset() { - // ... your code goes here + // Reset the current time to 0 + this.currentTime = 0; } split() { - // ... your code goes here + // Get the formatted time in mm:ss format + const minutes = this.computeTwoDigitNumber(this.getMinutes()); + const seconds = this.computeTwoDigitNumber(this.getSeconds()); + return `${minutes}:${seconds}`; } } diff --git a/javascript/index.js b/javascript/index.js index fb3a43a..70bb1bd 100644 --- a/javascript/index.js +++ b/javascript/index.js @@ -9,20 +9,26 @@ const minDecElement = document.getElementById('minDec'); const minUniElement = document.getElementById('minUni'); const secDecElement = document.getElementById('secDec'); const secUniElement = document.getElementById('secUni'); -const milDecElement = document.getElementById('milDec'); -const milUniElement = document.getElementById('milUni'); const splitsElement = document.getElementById('splits'); +// Function to print the full time (minutes and seconds) function printTime() { - // ... your code goes here + printMinutes(); + printSeconds(); } +// Function to print minutes function printMinutes() { - // ... your code goes here + const minutes = chronometer.computeTwoDigitNumber(chronometer.getMinutes()); + minDecElement.innerHTML = minutes[0]; + minUniElement.innerHTML = minutes[1]; } +// Function to print seconds function printSeconds() { - // ... your code goes here + const seconds = chronometer.computeTwoDigitNumber(chronometer.getSeconds()); + secDecElement.innerHTML = seconds[0]; + secUniElement.innerHTML = seconds[1]; } // ==> BONUS @@ -31,35 +37,62 @@ function printMilliseconds() { } function printSplit() { - // ... your code goes here + const splitTime = chronometer.split(); + const li = document.createElement('li'); + li.className = 'list-item'; + li.innerHTML = splitTime; + splitsElement.appendChild(li); } +// Function to clear split times function clearSplits() { - // ... your code goes here + splitsElement.innerHTML = ''; // Remove all splits } +// Function to toggle the Start button to Stop function setStopBtn() { - // ... your code goes here + btnLeftElement.className = 'btn stop'; + btnLeftElement.innerHTML = 'STOP'; } -function setSplitBtn() { - // ... your code goes here +// Function to toggle the Stop button to Start +function setStartBtn() { + btnLeftElement.className = 'btn start'; + btnLeftElement.innerHTML = 'START'; } -function setStartBtn() { - // ... your code goes here +// Function to toggle the Reset button to Split +function setSplitBtn() { + btnRightElement.className = 'btn split'; + btnRightElement.innerHTML = 'SPLIT'; } +// Function to toggle the Split button to Reset function setResetBtn() { - // ... your code goes here + btnRightElement.className = 'btn reset'; + btnRightElement.innerHTML = 'RESET'; } -// Start/Stop Button +// Event listener for Start/Stop button btnLeftElement.addEventListener('click', () => { - // ... your code goes here + if (btnLeftElement.classList.contains('start')) { + chronometer.start(printTime); // Start the chronometer and update the time + setStopBtn(); // Change Start to Stop + setSplitBtn(); // Change Reset to Split + } else { + chronometer.stop(); // Stop the chronometer + setStartBtn(); // Change Stop to Start + setResetBtn(); // Change Split to Reset + } }); -// Reset/Split Button +// Event listener for Reset/Split button btnRightElement.addEventListener('click', () => { - // ... your code goes here -}); + if (btnRightElement.classList.contains('reset')) { + chronometer.reset(); // Reset the chronometer + printTime(); // Update time display to 00:00 + clearSplits(); // Clear all splits + } else { + printSplit(); // Record and display the split time + } +}); \ No newline at end of file