chore: handle ff

Author: solygambas

078-speak number guessing game/script.js

@@ -1,57 +1,63 @@
-const messageElement = document.getElementById("msg");
-
-const randomNumber = getRandomNumber();
-
-window.SpeechRecognition =
+const SpeechRecognition =
   window.SpeechRecognition || window.webkitSpeechRecognition;
-let recognition = new window.SpeechRecognition();
-recognition.lang = "en-US";
-recognition.start();
+if (!SpeechRecognition) {
+  document.body.innerHTML = `
+    <h2>Sorry, your browser does not support Speech Recognition.</h2>
+    <p>Please use Chrome or Edge for the best experience.</p>
+  `;
+} else {
+  const messageElement = document.getElementById("msg");
 
-function getRandomNumber() {
-  return Math.floor(Math.random() * 100) + 1;
-}
+  const randomNumber = getRandomNumber();
+  let recognition = new SpeechRecognition();
+  recognition.lang = "en-US";
+  recognition.start();
 
-function onSpeak(event) {
-  const message = event.results[0][0].transcript;
-  writeMessage(message);
-  checkNumber(message);
-}
+  function getRandomNumber() {
+    return Math.floor(Math.random() * 100) + 1;
+  }
+
+  function onSpeak(event) {
+    const message = event.results[0][0].transcript;
+    writeMessage(message);
+    checkNumber(message);
+  }
 
-function writeMessage(message) {
-  messageElement.innerHTML = `
+  function writeMessage(message) {
+    messageElement.innerHTML = `
     <div>You said: </div>
     <span class="box">${message}</span>
   `;
-}
-
-function checkNumber(message) {
-  const number = +message;
-  if (Number.isNaN(number)) {
-    messageElement.innerHTML += "<div>That is not a valid number</div>";
-    return;
-  }
-  if (number > 100 || number < 1) {
-    messageElement.innerHTML += "<div>Number must be between 1 and 100</div>";
-    return;
   }
-  if (number === randomNumber) {
-    document.body.innerHTML = `
+
+  function checkNumber(message) {
+    const number = +message;
+    if (Number.isNaN(number)) {
+      messageElement.innerHTML += "<div>That is not a valid number</div>";
+      return;
+    }
+    if (number > 100 || number < 1) {
+      messageElement.innerHTML += "<div>Number must be between 1 and 100</div>";
+      return;
+    }
+    if (number === randomNumber) {
+      document.body.innerHTML = `
           <h2>Congrats! You have guessed the number! <br><br>
           It was ${number}</h2>
           <button class="play-again" id="play-again">Play Again</button>
         `;
-  } else if (number > randomNumber) {
-    messageElement.innerHTML += "<div>GO LOWER</div>";
-  } else {
-    messageElement.innerHTML += "<div>GO HIGHER</div>";
+    } else if (number > randomNumber) {
+      messageElement.innerHTML += "<div>GO LOWER</div>";
+    } else {
+      messageElement.innerHTML += "<div>GO HIGHER</div>";
+    }
   }
-}
 
-// Event Listeners
-recognition.addEventListener("result", onSpeak);
-recognition.addEventListener("end", () => recognition.start());
+  // Event Listeners
+  recognition.addEventListener("result", onSpeak);
+  recognition.addEventListener("end", () => recognition.start());
 
-document.body.addEventListener("click", (e) => {
-  if (e.target.id == "play-again") history.go(0);
-});
+  document.body.addEventListener("click", (e) => {
+    if (e.target.id == "play-again") history.go(0);
+  });
+}