Chronometer Lab Promises in Javascript

javascript/chronometer.js

@@ -1,34 +1,47 @@
 class Chronometer {
   constructor() {
-    // ... your code goes here
+    this.currentTime = 0; //stores time in secnds
+    this.intervalId = null; // stores id of interval so we can clear it out later
+
+
+
   }
 
+
   start(callback) {
-    // ... your code goes here
-  }
+    this.intervalId = setInterval(() => {
+      this.currentTime += 1;
+      if (callback) callback(); //gets called every second and increments
+    }, 1000) //increments every second
+  }
+
+getMinutes() {
+    return Math.floor(this.currentTime / 60); // Minutes are the number of full 60 seconds
+}
 
-  getMinutes() {
-    // ... your code goes here
-  }
+getSeconds() {
+    return this.currentTime % 60; // Seconds are the remainder after dividing by 60
+}
 
-  getSeconds() {
-    // ... your code goes here
-  }
 
   computeTwoDigitNumber(value) {
-    // ... your code goes here
+    return value < 10 ? `0${value}` : `${value}`; // takes a number an returns it as two-digit 
+    //if num is less than 10, pad it with 0;
   }
 
   stop() {
-    // ... your code goes here
+    clearInterval(this.intervalId); //clears interval so it stops counting
   }
 
   reset() {
-    // ... your code goes here
+    this.currentTime = 0; //resets time to 0
   }
 
   split() {
-    // ... your code goes here
+    const minutes = this.computeTwoDigitNumber(this.getMinutes());
+    const seconds = this.computeTwoDigitNumber(this.getSeconds());
+
+    return `${minutes}:${seconds}`; //returns time in format MM:SS
   }
 }
 

javascript/index.js

@@ -4,6 +4,7 @@ const chronometer = new Chronometer();
 const btnLeftElement = document.getElementById('btnLeft');
 const btnRightElement = 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');
@@ -14,52 +15,77 @@ 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.getMinutes();
+  const formattedMinutes = chronometer.computeTwoDigitNumber(minutes);
+  minDecElement.innerText = formattedMinutes[0]; // Tens place
+  minUniElement.innerText = formattedMinutes[1]; // Units place
 }
 
 function printSeconds() {
-  // ... your code goes here
-}
+  const seconds = chronometer.getSeconds();
 
-// ==> BONUS
-function printMilliseconds() {
-  // ... your code goes here
+  const formattedSeconds = chronometer.computeTwoDigitNumber(seconds);
+  secDecElement.innerText = formattedSeconds[0]; // Tens place
+  secUniElement.innerText = formattedSeconds[1]; // Units place
 }
 
+n
 function printSplit() {
-  // ... your code goes here
+  const splitTime = chronometer.split();
+  const li = document.createElement("li") // creates list to save split time
+  li.className = "list-item";
+  li.innerText = splitTime;
+  splitsElement.appendChild(li);
 }
 
 function clearSplits() {
-  // ... your code goes here
+  splitsElement.innerHTML = "";
 }
 
 function setStopBtn() {
-  // ... your code goes here
-}
+  btnLeftElement.innerText = 'STOP';
+  btnLeftElement.className = 'btn stop';}
 
 function setSplitBtn() {
-  // ... your code goes here
-}
+  btnRightElement.innerText = 'SPLIT';
+  btnRightElement.className = 'btn split';}
 
 function setStartBtn() {
-  // ... your code goes here
+  btnLeftElement.innerText = 'START';
+  btnLeftElement.className = 'btn start';
 }
 
 function setResetBtn() {
-  // ... your code goes here
+  btnRightElement.innerText = 'RESET';
+  btnRightElement.className = 'btn reset';
 }
 
 // Start/Stop Button
 btnLeftElement.addEventListener('click', () => {
-  // ... your code goes here
+  if (btnLeftElement.classList.contains('start')) {
+    setStopBtn();
+    setSplitBtn();
+    chronometer.start(printTime); // pass printTime as callback
+
+  } else {
+    setStartBtn();
+    setResetBtn();
+    chronometer.stop();
+  }
 });
 
 // Reset/Split Button
 btnRightElement.addEventListener('click', () => {
-  // ... your code goes here
+  if (btnRightElement.classList.contains('reset')) {
+    chronometer.reset();
+    printTime(); // update display after reset
+    clearSplits();
+  } else {
+    printSplit();
+  }
 });