I am having trouble with my simon game

1

I’m at the point in programming my game where simon shows his pattern, but my trigger to fire clicks is not working :frowning: I would be very greatful for any help. I am feeling discouraged right now that I am not able to figure it out at this moment.

var track3 = new Audio();
track3.src = ‘https://s3.amazonaws.com/freecodecamp/simonSound1.mp3’;

var head= $("#head").click (function (){
$("#head").css (“background-color”,“black”);
$("#head").css({ opacity: 0.9});
track3.play ();
setTimeout(function() {
$("#head").css({ opacity: 0.0 });
$("#head").css(“background-color”,"");
}, 300);
});

var shoulders= $("#shoulders").click (function (){

$("#shoulders").css (“background-color”,“cyan”);
track3.play();
setTimeout(function() {
$("#shoulders").css(“background-color”,"");
}, 300);
});

var knees= $("#knees").click (function (){

$("#knees").css (“background-color”,“mediumPurple”);
track3.play ();
setTimeout(function() {
$("#knees").css(“background-color”, “”);
}, 300);
});

var toes= $("#toes").click (function (){

$("#toes").css (“background-color”,“mediumSpringGreen”);
track3.play();
setTimeout(function() {
$("#toes").css(“background-color”, “”);
}, 300);
})

var round= 0;
var player= [ ];
var simon=[ ];
var pat= [“head”, “shoulders”, “knees”, “toes”];

$(".start").click(function (){
simon=[ ];
player=[ ];
round=[ ];
additionalRound();
})

function additionalRound(){
round ++;
$(“h2”).html(“Round:” +round);
setTimeout(function() {
$(“h2”).html(“HEAD, SHOULDERS, KNEES, AND TOES!”);
},2660);
sequence();
}

function sequence (){
simon.push(pat[Math.floor (Math.random ()*4 )]);
blinkerBeats ();
}

function blinkerBeats() {
for (var i = 0; i < simon.length; i++) {
setTimeout(function() {
$(simon[i]).trigger(‘click’);
}, i * 800);
}
}

2

Use this for blinker beats


Also, it’s hard to tell from the code why your buttons aren’t firing, so I suggest you solve one problem at a time. When blinker beats is running, disable all buttons, then when it finishes, enable them so you can start clicking. Maybe it will help.
Also, I see no way to identify whether the right button has been clicked. What makes clicking toes different from heads and how will you know? You have a player array that has not been put to use yet.

Also, the round array is redundant, you can simply make round a variable and show it where you show the level and increment by 1

Incase you want to know more feel free to ask.

1 Like
3

Thank you for the suggestions…I will try to use your helpful ideas to fix my code…the code is only made to the point that simon’s display the sequence right now, but once I fix this problem I will add the rest of my code. You are very helpful and kind :slight_smile:
-Rebecca

4

My answer was so sloppy. I apologize. After looking at your code with a fresh pair of eyes, I see the problems you needed to solve.
Stop assigning click functions to variables.
Just say $(#shoulders).click instead var shoulders =
Ooh for blinker beats, if you use the code from the website I suggested
Then call it as blinkerbeats(0) inside the sequence function, so it can start from the first number in the array.
Remove the trigger functions inside buttons and put them inside their own functions ie
For head click
function headClick() {
$("#head").css (“background-color”,“black”);
$("#head").css({ opacity: 0.9});
track3.play ();
setTimeout(function() {
$("#head").css({ opacity: 0.0 });
$("#head").css(“background-color”,"");
}, 300);
}
$(#head).click(function() {
headClick();
player.push(0)
})
This way both blinkerbeats and head can share the common headClick function because the trigger click function simon[i].trigger(‘click’) will not work. I tried it as well, it won’t work because you have not specified which button to target and which function it should trigger but you don’t need it anyway. The syntax is wrong so remove it completely and replace it with if else statements eg
If (simon[i] === 0) {
headClick();
}
else if(simon[I] === 1) {shoulderClick()}
All your code really needed was a bit of reorganization, you have all the right ideas.
Please don’t forget to use the function I shared in the article inside blinkerbeats, the for loop isn’t effective.
Remember you push a random number into simon, so use if else statements to determine which function should run when simon[i] is 0,1,2,3
Also please use the different sounds given by fcc not just one, some players remember the correct sequence by sound.
.
Sorry for not addressing your questions better yesterday, I just realized the real problems. Hope this helps.:slight_smile:

1 Like
5

Thank you for your insight. I am learning a lot from what you said. I will try your suggestions . You are very helpful. I hopefully come back with some great news :slight_smile:

1 Like
6

Hi,

Sorry this may end up throwing you into the fire from the pan… but have you tried using setInterval instead of multiple setTimeouts? setInterval repeats until you tell it not too (simply put) so instead of loads of setTimeouts you can change the colors through one setInterval loop.

anyway best of luck!

1 Like