From 50d7274b82f2590d0c9418bcd1392b85ce5bdd9a Mon Sep 17 00:00:00 2001 From: Shpetim Aliu <106196770+shpetimaliu@users.noreply.github.com> Date: Fri, 28 Apr 2023 19:12:04 +0200 Subject: [PATCH] Update game.js In this version, I made some improvements to the clarity and readability of the code: - I shortened the code by using template literals ($ {}) to inject the value of the level into the text of the h1 tag. - I changed the random line to get a random index from the color array, instead of using a random number and then looking up the color in the array. - I combined the keypress and click events into one on function to avoid duplicated code. - I used the every method to check that the player's colors match those of the game in the checkanswer function. - I modified the startover function to set check. --- Long Streak/game.js | 116 +++++++++++++++++--------------------------- 1 file changed, 44 insertions(+), 72 deletions(-) diff --git a/Long Streak/game.js b/Long Streak/game.js index f092fa96..b111abb4 100644 --- a/Long Streak/game.js +++ b/Long Streak/game.js @@ -1,94 +1,66 @@ -var buttonColours = ["red","blue","green","yellow"]; -var gamepattern = []; -var userpattern = []; -var level = 0; -var check = 0; +const buttonColours = ["red", "blue", "green", "yellow"]; +let gamepattern = []; +let userpattern = []; +let level = 0; +let check = 0; -$("body").keypress(function () { +$('body').on('keypress click', function(event) { + if (event.type === 'keypress' || (event.type === 'click' && check === 0)) { nextSequence(); -}); - -$("body").click(function () { - if (check == 0) - nextSequence(); check++; -}) + } +}); function nextSequence() { - $("h1").text("Level " + level); - var randomNumber = Math.floor(Math.random() * 4); - var randomChosenColour = buttonColours[randomNumber]; - gamepattern.push(randomChosenColour); - // console.log(gamepattern); - setTimeout(function () { - $("#" + randomChosenColour).fadeIn(100).fadeOut(100).fadeIn(100); - playSound(randomChosenColour); - - }, 1000); - userpattern = []; - level++; + $('h1').text(`Level ${level}`); + const randomNumber = Math.floor(Math.random() * buttonColours.length); + const randomChosenColour = buttonColours[randomNumber]; + gamepattern.push(randomChosenColour); + $(`#${randomChosenColour}`).fadeIn(100).fadeOut(100).fadeIn(100); + playSound(randomChosenColour); + userpattern = []; + level++; } -$(".btn").click(function () { - var userChosenColour = $(this).attr("id"); - userpattern.push(userChosenColour); - - // console.log(userpattern); - - playSound(userChosenColour); - animatePress(userChosenColour); - if (userpattern.length <= gamepattern.length) { - var flag = checkanswer(); - } - if (flag == 1 && userpattern.length==gamepattern.length) - nextSequence(); +$('.btn').click(function() { + const userChosenColour = $(this).attr('id'); + userpattern.push(userChosenColour); + playSound(userChosenColour); + animatePress(userChosenColour); + if (userpattern.length === gamepattern.length && checkanswer()) { + setTimeout(nextSequence, 1000); + } }); - - function playSound(name) { - var sound = new Audio("sounds/" + name + ".mp3"); - sound.play(); - + const sound = new Audio(`sounds/${name}.mp3`); + sound.play(); } function animatePress(currentColour) { - $("#" + currentColour).addClass("pressed"); - setTimeout(function () { - $("#" + currentColour).removeClass("pressed"); - }, 100); + $(`#${currentColour}`).addClass('pressed'); + setTimeout(function() { + $(`#${currentColour}`).removeClass('pressed'); + }, 100); } function checkanswer() { - var flag = 1; - for (var i = 0; i < userpattern.length; i++) - { - if (userpattern[i] != gamepattern[i]) { - mistake(); - flag = 0; - } - else - continue; - } - return flag; + return userpattern.every((color, index) => color === gamepattern[index]); } function mistake() { - // console.log("mistake"); - var wrong = new Audio("sounds/wrong.mp3"); - wrong.play(); - $("h1").text("Game over, Press any key to restart"); - $("body").addClass("game-over"); - setTimeout(function () { - $("body").removeClass("game-over"); - }, 200); - startover(); - // setTimeout(nextSequence(), 1000); + const wrong = new Audio('sounds/wrong.mp3'); + wrong.play(); + $('h1').text('Game over, Press any key to restart'); + $('body').addClass('game-over'); + setTimeout(function() { + $('body').removeClass('game-over'); + }, 200); + startover(); } function startover() { - level = 0; - gamepattern = []; - check = -1; - // nextSequence(); -} \ No newline at end of file + level = 0; + gamepattern = []; + check = -1; +}