diff --git a/javascript/chronometer.js b/javascript/chronometer.js index 7a13496..aeef306 100644 --- a/javascript/chronometer.js +++ b/javascript/chronometer.js @@ -1,34 +1,61 @@ class Chronometer { constructor() { // ... your code goes here + this.currentTime = 0; + this.intervalId = null; } start(callback) { // ... your code goes here + this.intervalId = setInterval(() => { + this.currentTime++; + + if (callback) { + callback(); + } + }, 1000); } getMinutes() { // ... your code goes here + const minutes = Math.floor(this.currentTime / 60); + return minutes; } getSeconds() { // ... your code goes here + const seconds = this.currentTime % 60; + return seconds; } computeTwoDigitNumber(value) { // ... your code goes here + var formattedNumber = ('0' + value).slice(-2); + const val = formattedNumber.toString(); + return val; } stop() { // ... your code goes here + clearInterval(this.intervalId); } reset() { // ... your code goes here + this.currentTime = 0; } split() { // ... your code goes here + const minute = this.getMinutes(); + const minVal = this.computeTwoDigitNumber(minute); + + const second = this.getSeconds(); + const secVal = this.computeTwoDigitNumber(second); + + const formattedTime = `${minVal}:${secVal}`; + + return formattedTime; } } diff --git a/javascript/index.js b/javascript/index.js index fb3a43a..408c99f 100644 --- a/javascript/index.js +++ b/javascript/index.js @@ -15,51 +15,105 @@ 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 minutesVal = chronometer.computeTwoDigitNumber(minutes); + + minDecElement.innerHTML = minutesVal[0]; + minDecElement.innerHTML = minutesVal[1]; } function printSeconds() { // ... your code goes here + const seconds = chronometer.getSeconds(); + const secondsVal = chronometer.computeTwoDigitNumber(seconds); + + secDecElement.innerHTML = secondsVal[0]; + secUniElement.innerHTML = secondsVal[1]; } // ==> BONUS function printMilliseconds() { // ... your code goes here + } function printSplit() { // ... your code goes here + const TimeofSplit = chronometer.split(); + const newSplit = document.createElement('li'); + + newSplit.innerHTML = TimeofSplit; + splitsElement.appendChild(newSplit); } function clearSplits() { // ... your code goes here + splitsElement.innerHTML = ''; } function setStopBtn() { // ... your code goes here + btnLeftElement.innerHTML = 'STOP'; + btnLeftElement.className = 'btn stop'; } function setSplitBtn() { // ... your code goes here + if (btnLeftElement.className.includes('stop')) { + btnRightElement.innerHTML = 'SPLIT'; + btnRightElement.className = 'btn split'; + } else { + btnRightElement.innerHTML = 'RESET'; + btnRightElement.className = 'btn reset'; + } } function setStartBtn() { // ... your code goes here + btnLeftElement.innerHTML = 'START'; + btnLeftElement.className = 'btn start'; } function setResetBtn() { // ... your code goes here + if (btnLeftElement.className.includes('stop')) { + btnRightElement.innerHTML = 'SPLIT'; + btnRightElement.className = 'btn split'; + } else { + btnRightElement.innerHTML = 'RESET'; + btnRightElement.className = 'btn reset'; + } } // Start/Stop Button btnLeftElement.addEventListener('click', () => { // ... your code goes here + if (btnLeftElement.className.includes('start')) { + setStopBtn(); + setSplitBtn(); + chronometer.start(printTime); + } else { + setStartBtn(); + setResetBtn(); + chronometer.stop(); + } }); // Reset/Split Button btnRightElement.addEventListener('click', () => { // ... your code goes here + if (btnRightElement.className.includes('reset')) { + chronometer.reset(); + printTime(); + clearSplits(); + } else { + printSplit(); + } });