week 10 stopwatch

week-10/index.html

@@ -0,0 +1,58 @@
+// Making stopwatch
+
+  <section>
+    <p1>0m</p1>
+    <p2>0s</p2>
+
+    <button id="start">Start</button>
+    <button id="reset">Reset</button>
+
+  </section>
+
+  <script> 
+
+    let start = document.querySelector("#start")
+    let stop = document.querySelector("#stop")
+    let restart = document.querySelector("#restart")
+    let p1 = document.querySelector("p1")  
+    let p2 = document.querySelector("p2") 
+
+    let seconds = 0;
+    let minutes = 0;
+    let timer;
+
+    function startTimer(){
+    timer = setInterval(updateDisplay, 1000)
+    updateDisplay()
+    };     
+
+    function updateDisplay(){
+        if (seconds == 59){
+          minutes = minutes + 1;
+          seconds = -1;
+        }
+
+      seconds++;
+      p1.innerHTML = `${minutes}m`
+      p2.innerHTML = `${seconds}s`
+      console.log("interval running", seconds)  
+    }
+
+    function stopTimer(){
+      clearInterval(timer)
+    }
+
+    function resetTimer(){
+      stopTimer()
+      console.log("reset")
+      seconds = -1;
+      minutes = 0;
+      updateDisplay()
+    }
+
+    start.addEventListener('click', startTimer)
+    reset.addEventListener('click', resetTimer)
+
+
+  </script>
+