diff --git a/javascript/chronometer.js b/javascript/chronometer.js index 7a1349680..dadeb52db 100644 --- a/javascript/chronometer.js +++ b/javascript/chronometer.js @@ -1,33 +1,47 @@ class Chronometer { constructor() { + this.currentTime = 0 + this.intervalId = null // ... your code goes here } start(callback) { + this.intervalId = setInterval (() => { + this.currentTime++ + if (callback) callback() + }, 1000) // ... your code goes here } getMinutes() { + return Math.floor(this.currentTime / 60) // ... your code goes here } getSeconds() { + return this.currentTime % 60 // ... your code goes here } computeTwoDigitNumber(value) { + return value < 10 ? `0${value}` : `${value}`; // ... your code goes here } stop() { + clearInterval(this.intervalId) // ... your code goes here } reset() { + this.currentTime = 0 // ... your code goes here } split() { + const minutes = this.computeTwoDigitNumber(this.getMinutes()) + const seconds = this.computeTwoDigitNumber(this.getSeconds()) + return `${this.computeTwoDigitNumber(this.getMinutes())}:${this.computeTwoDigitNumber(this.getSeconds())}`; // ... your code goes here } } diff --git a/javascript/index.js b/javascript/index.js index fb3a43ab4..5c007232b 100644 --- a/javascript/index.js +++ b/javascript/index.js @@ -14,14 +14,23 @@ const milUniElement = document.getElementById('milUni'); const splitsElement = document.getElementById('splits'); function printTime() { + printMinutes () + printSeconds () + printMilliseconds () // ... your code goes here } function printMinutes() { + const minutes = chronometer.computeTwoDigitNumber(chronometer.getMinutes()) + minDecElement.textContent = minutes[0]; + minUniElement.textContent = minutes[1]; // ... your code goes here } function printSeconds() { + const seconds = chronometer.computeTwoDigitNumber(chronometer.getSeconds()) + secDecElement.textContent = seconds[0]; + secUniElement.textContent = seconds[1]; // ... your code goes here } @@ -31,35 +40,65 @@ function printMilliseconds() { } function printSplit() { + const li = document.createElement('li') + li.textContent = chronometer.split() + splitsElement.appendChild(li) // ... your code goes here } function clearSplits() { + splits.innerHTML = '' // ... your code goes here } function setStopBtn() { + btnLeftElement.textContent = 'STOP' + btnLeftElement.classList.remove('start') + btnLeftElement.classList.add('stop') // ... your code goes here } function setSplitBtn() { + btnRightElement.textContent = 'SPLIT' + btnRightElement.classList.remove('reset') + btnRightElement.classList.add('split') // ... your code goes here } function setStartBtn() { + btnLeftElement.textContent = 'START' + btnLeftElement.classList.remove('stop') + btnLeftElement.classList.add('start') // ... your code goes here } function setResetBtn() { + btnRightElement.textContent = 'RESET' + btnRightElement.classList.remove('split') + btnRightElement.classList.add('reset') // ... your code goes here } // Start/Stop Button btnLeftElement.addEventListener('click', () => { - // ... your code goes here + if (btnLeftElement.classList.contains('start')) { + chronometer.start(printTime) + setStopBtn() + setSplitBtn() + } else { + chronometer.stop() + setStartBtn() + setResetBtn() + } }); // Reset/Split Button btnRightElement.addEventListener('click', () => { - // ... your code goes here + if (btnRightElement.classList.contains('reset')) { + chronometer.reset() + printTime() + clearSplits() + } else { + printSplit() + } });