For mobile also set

app.js

@@ -1,79 +1,80 @@
-let gameSeq=[];
-let userSeq=[];
-let highScore=0;
+let gameSeq = [];
+let userSeq = [];
+let highScore = 0;
 
 let started = false;
-let level=0;
+let level = 0;
 
-let btns=["yellow","green","red","purple"]
-let h2=document.querySelector('h2');
+let btns = ["yellow", "green", "red", "purple"];
+let h2 = document.querySelector('h2');
 
-document.addEventListener("keypress", function(){
-      if(started===false){
+function startGame() {
+      if (!started) {
             console.log("Game started");
-            started=true;
+            started = true;
             levelUp();
       }
-});   
+}
+
+document.addEventListener("keypress", startGame);
+document.addEventListener("touchstart", startGame, { once: true });
 
-function btnFlash(btn){
+function btnFlash(btn) {
       btn.classList.add("flash");
-      setTimeout(function(){
+      setTimeout(function () {
             btn.classList.remove("flash");
       }, 250);
-};
+}
 
-function levelUp(){
-      userSeq=[];
+function levelUp() {
+      userSeq = [];
       level++;
-      h2.innerText=`Level ${level}`
-      let randIdx=Math.floor(Math.random()*4);
-      let randColor=btns[randIdx];
-      let randBtn=document.querySelector(`.${randColor}`)
+      h2.innerText = `Level ${level}`;
+      let randIdx = Math.floor(Math.random() * 4);
+      let randColor = btns[randIdx];
+      let randBtn = document.querySelector(`.${randColor}`);
       gameSeq.push(randColor);
       btnFlash(randBtn);
-};
+}
 
-function checkAns(idx){
-      if(userSeq[idx]===gameSeq[idx]){
-            if(userSeq.length==gameSeq.length){
-                  setTimeout(levelUp,1000);
-            }
-      }
-      else{
-            if(highScore<level){
-                  highScore=level;
-                  h2.innerText=`Congratulations you got new Higth Score ${highScore}`; 
+function checkAns(idx) {
+      if (userSeq[idx] === gameSeq[idx]) {
+            if (userSeq.length == gameSeq.length) {
+                  setTimeout(levelUp, 1000);
             }
-            else{
-                  h2.innerText=`Game over! your score is ${level} press any key to start game Hight Sore is ${highScore}`; 
+      } else {
+            if (highScore < level) {
+                  highScore = level;
+                  h2.innerText = `Congratulations! New High Score: ${highScore}`;
+            } else {
+                  h2.innerText = `Game Over! Your score: ${level}. Press any key or tap to restart. High Score: ${highScore}`;
             }
-            
-            document.querySelector('body').style.backgroundColor='red';
-            setTimeout(function() {
-                  document.querySelector('body').style.backgroundColor='white';
-            },150)
+
+            document.querySelector('body').style.backgroundColor = 'red';
+            setTimeout(function () {
+                  document.querySelector('body').style.backgroundColor = 'white';
+            }, 150);
             reset();
       }
 }
 
-function btnPress(){
-      let btn=this;
+function btnPress() {
+      let btn = this;
       btnFlash(btn);
-      userColor=btn.getAttribute("id");
+      let userColor = btn.getAttribute("id");
       userSeq.push(userColor);
-      checkAns(userSeq.length-1);
-};
-
-let allBtns=document.querySelectorAll('.btn');
-for(btn of allBtns){
-      btn.addEventListener('click',btnPress);
-};
+      checkAns(userSeq.length - 1);
+}
 
-function reset(){
-      gameSeq=[];
-      userSeq=[];
-      level=0;
-      started=false;
+let allBtns = document.querySelectorAll('.btn');
+for (let btn of allBtns) {
+      btn.addEventListener('click', btnPress);
 }
 
+function reset() {
+      gameSeq = [];
+      userSeq = [];
+      level = 0;
+      started = false;
+      document.addEventListener("touchstart", startGame, { once: true });
+}