hola

javascript/chronometer.js

@@ -1,34 +1,42 @@
 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
+    return Math.floor(this.currentTime / 60);
   }
 
   getSeconds() {
-    // ... your code goes here
+    return this.currentTime % 60;
   }
 
   computeTwoDigitNumber(value) {
-    // ... your code goes here
+    return value.toString().padStart(2, '0');
   }
 
   stop() {
-    // ... your code goes here
+    clearInterval(this.intervalId);
   }
 
   reset() {
-    // ... your code goes here
+    this.currentTime = 0;
   }
 
   split() {
-    // ... your code goes here
+    const minutes = this.computeTwoDigitNumber(this.getMinutes());
+    const seconds = this.computeTwoDigitNumber(this.getSeconds());
+    return `${minutes}:${seconds}`;
   }
 }
 

javascript/index.js

@@ -1,28 +1,33 @@
 const chronometer = new Chronometer();
 
 // get the buttons:
-const btnLeftElement = document.getElementById('btnLeft');
-const btnRightElement = document.getElementById('btnRight');
+const btnLeft = document.getElementById('btnLeft');
+const btnRight = document.getElementById('btnRight');
 
 // get the DOM elements that will serve us to display the time:
-const minDecElement = document.getElementById('minDec');
-const minUniElement = document.getElementById('minUni');
-const secDecElement = document.getElementById('secDec');
-const secUniElement = document.getElementById('secUni');
+const minDec = document.getElementById('minDec');
+const minUni = document.getElementById('minUni');
+const secDec = document.getElementById('secDec');
+const secUni = document.getElementById('secUni');
 const milDecElement = document.getElementById('milDec');
 const milUniElement = document.getElementById('milUni');
 const splitsElement = document.getElementById('splits');
 
 function printTime() {
-  // ... your code goes here
+  printMinutes();
+  printSeconds();
 }
 
 function printMinutes() {
-  // ... your code goes here
+  const minutes = chronometer.computeTwoDigitNumber(chronometer.getMinutes());
+  minDec.innerText = minutes[0];
+  minUni.innerText = minutes[1];
 }
 
 function printSeconds() {
-  // ... your code goes here
+  const seconds = chronometer.computeTwoDigitNumber(chronometer.getSeconds());
+  secDec.innerText = seconds[0];
+  secUni.innerText = seconds[1];
 }
 
 // ==> BONUS
@@ -31,35 +36,52 @@ function printMilliseconds() {
 }
 
 function printSplit() {
-  // ... your code goes here
-}
+  const splitTime = chronometer.split();
+  const splits = document.getElementById('splits');
+  const li = document.createElement('li');
+  li.innerText = splitTime;
+  splits.appendChild(li);}
 
 function clearSplits() {
-  // ... your code goes here
-}
-
-function setStopBtn() {
-  // ... your code goes here
-}
-
-function setSplitBtn() {
-  // ... your code goes here
+  document.getElementById('splits').innerHTML = '';
 }
 
 function setStartBtn() {
-  // ... your code goes here
+  btnLeft.innerText = 'STOP';
+  btnLeft.className = 'btn stop';
+  btnRight.innerText = 'SPLIT';
+  btnRight.className = 'btn split';
 }
 
-function setResetBtn() {
-  // ... your code goes here
+function setStopBtn() {
+  btnLeft.innerText = 'START';
+  btnLeft.className = 'btn start';
+  btnRight.innerText = 'RESET';
+  btnRight.className = 'btn reset';
 }
 
 // Start/Stop Button
-btnLeftElement.addEventListener('click', () => {
-  // ... your code goes here
+btnLeft.addEventListener('click', () => {
+  if (btnLeft.classList.contains('start')) {
+    // Start
+    chronometer.start(printTime);
+    setStartBtn();
+  } else {
+    // Stop
+    chronometer.stop();
+    setStopBtn();
+  }
 });
 
 // Reset/Split Button
-btnRightElement.addEventListener('click', () => {
-  // ... your code goes here
-});
+btnRight.addEventListener('click', () => {
+  if (btnRight.classList.contains('reset')) {
+    // Reset
+    chronometer.reset();
+    printTime();
+    clearSplits();
+  } else {
+    // Split
+    printSplit();
+  }
+});

package.json

@@ -33,5 +33,8 @@
   "prettier": {
     "singleQuote": true,
     "trailingComma": "none"
+  },
+  "dependencies": {
+    "lab-javascript-chronometer": "file:"
   }
 }