diff --git a/javascript/chronometer.js b/javascript/chronometer.js index 7a1349680..e071cb7dc 100644 --- a/javascript/chronometer.js +++ b/javascript/chronometer.js @@ -1,34 +1,61 @@ class Chronometer { constructor() { - // ... your code goes here + this.currentTime = 0; + this.currentMilliseconds = 0; + this.intervalId = null; + this.millisecondsintervalId = null; } start(callback) { - // ... your code goes here + this.intervalId = setInterval(() => { + this.currentTime++; + if (callback) { + callback(); + } + }, 1000); + + this.millisecondIntervalId = setInterval(() => { + this.currentMilliseconds += 10; + if (this.currentMilliseconds >= 1000) { + this.currentMilliseconds = 0; + } + if (callback) callback(); + }, 10); } getMinutes() { - // ... your code goes here + return Math.floor(this.currentTime / 60); } getSeconds() { - // ... your code goes here + return this.currentTime % 60; + } + + getMilliseconds() { + return Math.floor(this.currentMilliseconds / 10); } computeTwoDigitNumber(value) { - // ... your code goes here + return value < 10 ? "0" + value : value.toString(); } stop() { - // ... your code goes here + clearInterval(this.intervalId); + clearInterval(this.millisecondIntervalId); + this.intervalId = null; + this.millisecondIntervalId = null; } reset() { - // ... your code goes here + this.currentTime = 0; + this.currentMilliseconds = 0; } split() { - // ... your code goes here + const minutes = this.computeTwoDigitNumber(this.getMinutes()); + const seconds = this.computeTwoDigitNumber(this.getSeconds()); + // const milliseconds = this.computeTwoDigitNumber(this.getMilliseconds()); + return `${minutes}:${seconds}`; } } @@ -36,4 +63,4 @@ class Chronometer { /* Environment setup. Do not modify the below code. */ if (typeof module !== 'undefined') { module.exports = Chronometer; -} +} \ No newline at end of file diff --git a/javascript/index.js b/javascript/index.js index fb3a43ab4..f027860b2 100644 --- a/javascript/index.js +++ b/javascript/index.js @@ -14,52 +14,87 @@ const milUniElement = document.getElementById('milUni'); const splitsElement = document.getElementById('splits'); function printTime() { - // ... your code goes here + printMinutes(); + printSeconds(); + printMilliseconds(); } function printMinutes() { - // ... your code goes here + const minutes = chronometer.getMinutes(); + const formattedMinutes = chronometer.computeTwoDigitNumber(minutes); + + minDecElement.innerText = formattedMinutes[0]; + minUniElement.innerText = formattedMinutes[1]; } function printSeconds() { - // ... your code goes here + const seconds = chronometer.getSeconds(); + const formattedSeconds = chronometer.computeTwoDigitNumber(seconds); + + secDecElement.innerText = formattedSeconds[0]; + secUniElement.innerText = formattedSeconds[1]; } // ==> BONUS function printMilliseconds() { - // ... your code goes here + const milliseconds = chronometer.getMilliseconds(); + const formattedMilliseconds = chronometer.computeTwoDigitNumber(milliseconds); + milDecElement.innerText = formattedMilliseconds[0]; + milUniElement.innerText = formattedMilliseconds[1]; } function printSplit() { - // ... your code goes here + const li = document.createElement('li'); + li.innerText = chronometer.split(); + splitsElement.appendChild(li);} + +function clearSplits() { + splitsElement.innerHTML = ''; } function clearSplits() { - // ... your code goes here + splitsElement.innerHTML = ''; } function setStopBtn() { - // ... your code goes here + btnLeftElement.className = "btn stop"; + btnLeftElement.textContent = "STOP"; } function setSplitBtn() { - // ... your code goes here + btnRightElement.className = "btn split"; + btnRightElement.textContent = "SPLIT"; } function setStartBtn() { - // ... your code goes here + btnLeftElement.className = "btn start"; + btnLeftElement.textContent = "START"; } function setResetBtn() { - // ... your code goes here + btnRightElement.className = "btn reset"; + btnRightElement.textContent = "RESET"; } // Start/Stop Button btnLeftElement.addEventListener('click', () => { - // ... your code goes here + if (btnLeftElement.classList.contains('start')) { + chronometer.start(printTime); + setStopBtn(); + setSplitBtn(); + } else { + setStartBtn(); + setResetBtn(); + chronometer.stop(); + } }); // Reset/Split Button btnRightElement.addEventListener('click', () => { - // ... your code goes here -}); + if (btnRightElement.classList.contains('reset')) { + chronometer.reset(); + printTime(); + clearSplits(); + } else if (btnRightElement.classList.contains('split')) { + printSplit(); +}});