Add playing flag and start timer when key is pressed

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) {