Add playing flag and start timer when key is pressed

Author: JuanCarlosAcostaPeraba

03-midu-typing-game/index.html

@@ -177,6 +177,7 @@ <h3 id="results-accuracy"></h3>
 
   let words = []
   let currentTime = INITIAL_TIME
+  let playing
 
   initGame()
   initEvents()
@@ -186,6 +187,8 @@ <h3 id="results-accuracy"></h3>
     $results.style.display = 'none'
     $input.value = ''
 
+    playing = false
+
     words = INITIAL_WORDS.toSorted(
       () => Math.random() - 0.5
     ).slice(0, 50)
@@ -208,25 +211,28 @@ <h3 id="results-accuracy"></h3>
     const $firstWord = $paragraph.querySelector('word')
     $firstWord.classList.add('active')
     $firstWord.querySelector('letter').classList.add('active')
-
-    const intervalId = setInterval(() => {
-      currentTime--
-      $time.textContent = currentTime
-
-      if (currentTime === 0) {
-        clearInterval(intervalId)
-        gameOver()
-      }
-    }, 1000)
   }
 
   function initEvents() {
     document.addEventListener('keydown', () => {
       $input.focus()
+      if (!playing) {
+        playing = true
+        const intervalId = setInterval(() => {
+          currentTime--
+          $time.textContent = currentTime
+
+          if (currentTime === 0) {
+            clearInterval(intervalId)
+            gameOver()
+          }
+        }, 1000)
+      }
     })
     $input.addEventListener('keydown', onKeyDown)
     $input.addEventListener('keyup', onKeyUp)
     $button.addEventListener('click', initGame)
+
   }
 
   function onKeyDown(event) {