diff --git a/javascript/chronometer.js b/javascript/chronometer.js index 7a1349680..ff7ec5691 100644 --- a/javascript/chronometer.js +++ b/javascript/chronometer.js @@ -1,33 +1,54 @@ class Chronometer { constructor() { - // ... your code goes here + this.currentTime = 0; + this.intervalId = null; + } start(callback) { + if(this.intervalId !== null)return; + this.intervalId= setInterval(() => { + this.currentTime++ + if(typeof callback === "function" ) { + callback() + } + }, 1000); // ... your code goes here } getMinutes() { - // ... your code goes here + return Math.floor(this.currentTime / 60) } getSeconds() { - // ... your code goes here + return Math.floor(this.currentTime % 60) + } - computeTwoDigitNumber(value) { - // ... your code goes here - } +computeTwoDigitNumber(value) { + return value.toString().padStart(2, "0"); +} + stop() { - // ... your code goes here + clearInterval(this.intervalId) + this.intervalId = null; + } reset() { - // ... your code goes here + this.currentTime= 0; + } split() { + const minutes = this.getMinutes(); + const seconds = this.getSeconds(); + + const minutesFormat = this.computeTwoDigitNumber(minutes); + const secondsFormat = this.computeTwoDigitNumber(seconds); + + return `${minutesFormat}:${secondsFormat}` // ... your code goes here } } diff --git a/javascript/index.js b/javascript/index.js index fb3a43ab4..9c0b1bade 100644 --- a/javascript/index.js +++ b/javascript/index.js @@ -1,5 +1,8 @@ + const chronometer = new Chronometer(); +console.log('hola'); + // get the buttons: const btnLeftElement = document.getElementById('btnLeft'); const btnRightElement = document.getElementById('btnRight'); @@ -13,53 +16,119 @@ const milDecElement = document.getElementById('milDec'); const milUniElement = document.getElementById('milUni'); const splitsElement = document.getElementById('splits'); +console.log('variables declaradas'); + function printTime() { - // ... your code goes here + printMinutes(); + printSeconds(); } function printMinutes() { - // ... your code goes here + const numMin = chronometer.computeTwoDigitNumber( + chronometer.getMinutes()); + + + minDecElement.textContent = numMin[0]; + minUniElement.textContent = numMin[1]; } function printSeconds() { - // ... your code goes here + const numSec = chronometer.computeTwoDigitNumber( + chronometer.getSeconds()); + + +secDecElement.textContent = numSec[0]; + secUniElement.textContent = numSec[1]; } // ==> BONUS -function printMilliseconds() { - // ... your code goes here -} +function printMilliseconds() {} function printSplit() { - // ... your code goes here + const split = chronometer.split(); + + splitsElement.textContent = split; } function clearSplits() { - // ... your code goes here + splitsElement.innerHTML = ''; } function setStopBtn() { - // ... your code goes here + chronometer.stop(); + + btnLeftElement.textContent = 'START'; + btnLeftElement.className = 'btn start'; + btnRightElement.textContent = 'RESET'; + btnRightElement.className = 'btn reset'; } function setSplitBtn() { - // ... your code goes here + const split = chronometer.split(); + const splitItem = document.createElement('li'); + splitItem.textContent = split; + splitsElement.appendChild(splitItem); } function setStartBtn() { - // ... your code goes here -} + chronometer.start(printTime); + btnLeftElement.textContent = 'STOP'; + btnLeftElement.className = 'btn stop'; + + btnRightElement.textContent = 'SPLIT'; + btnRightElement.className = 'btn split'; +} function setResetBtn() { - // ... your code goes here + chronometer.reset(); + + btnLeftElement.textContent = 'START'; + btnLeftElement.className = 'btn start'; + btnRightElement.textContent = 'RESET'; + btnRightElement.className = 'btn reset'; + + minDecElement.textContent = '0'; + minUniElement.textContent = '0'; + secDecElement.textContent = '0'; + secUniElement.textContent = '0'; + milDecElement.textContent = '0'; + milUniElement.textContent = '0'; + splitsElement.textContent = '0'; + // document.querySelector('#clock').innerHTML=` + //