I’m trying to get my audio to sound when a random button is selected by Simon, or even when the user presses it, but it is not working! Thanks in advance for your help!
//tie this if function into start button to enable random button to be selected by Simon game and audio played
if(buttons.length > 0) { //as long as greater than 0, can be two buttons, etc
function getRandomIndex(){
var random = Math.floor(Math.random() * 4);
buttons.item(random).click(); //randomIndex is parameter of item
simonGamePlays.push(random);
if(random[i]==1){
lightup = 'hit-zero-green';
$('.hit-zero-green').addClass(lightup);
$('#audio1')[0].play();
simonGamePlays.push(1);
setTimeout(function () {
$('.hit-zero-green').removeClass(lightup);
}, off);
}else if (random[i] == 2) {
lightup = 'hit-zero-red';
$('.hit-zero-red').addClass(lightup);
$('#audio-two')[0].play();
simonGamePlays.push(2);
setTimeout(function () {
$('.hit-zero-red').removeClass(lightup);
}, off);
}else if (random[i] == 3) {
lightup = 'hit-zero-blue';
$('.hit-zero-blue').addClass(lightup);
$('#audio3')[0].play();
simonGamePlays.push(3);
setTimeout(function () {
$('.hit-zero-blue').removeClass(lightup);
}, off);
}else if (random[i] == 3) {
lightup = 'hit-zero-yellow';
$('.hit-zero-yellow').addClass(lightup);
$('#audio4')[0].play();
simonGamePlays.push(4);
setTimeout(function () {
$('#sound-four').removeClass(lightup);
}, off);
}
}
//outside function
getRandomIndex(); // function call
}
} //end of turn game on function
You declared random to be a number in the line below inside your getRandomIndex function, so when you reference random[i] it is undefined, so none of your if or if else statements will evaluate to true.
Hey - I don’t know if this is all of the issue but this might be a part of it…in your HTML where you have the audio and src tags. It’s actually supposed to be like this:
Yes. Also I second the recommendation by @CandiW regarding the use of audio tag syntax. Also, be aware you have id=“audio2” on one of your audio elements, but in your JavaScript you reference “audio-two”.
Once you resolve the above issues, you still have many more logic issues to resolve.
On a side note, from a design standpoint, I would move the social media/email buttons to be below the main part of the game. They are not part of the game controls and should not be mixed in between the controls and the game buttons. You could still put them in the black section and look fine.
//tie this if function into start button to enable random button to be selected by Simon game and audio played
if(buttons.length > 0) { //as long as greater than 0, can be two buttons, etc
function getRandomIndex(){
var random = Math.floor(Math.random() * [i]);
buttons.item(random).click(); //randomIndex is parameter of item
simonGamePlays.push(random);
if(random==1){
lightup = 'hit-zero-green';
$('.hit-zero-green').addClass(lightup);
$('#audio1')[0].play();
simonGamePlays.push(1);
setTimeout(function () {
$('.hit-zero-green').removeClass(lightup);
}, off);
}else if (random== 2) {
lightup = 'hit-zero-red';
$('.hit-zero-red').addClass(lightup);
$('#audio2')[0].play();
simonGamePlays.push(2);
setTimeout(function () {
$('.hit-zero-red').removeClass(lightup);
}, off);
}else if (random == 3) {
lightup = 'hit-zero-blue';
$('.hit-zero-blue').addClass(lightup);
$('#audio3')[0].play();
simonGamePlays.push(3);
setTimeout(function () {
$('.hit-zero-blue').removeClass(lightup);
}, off);
}else if (random== 4) {
lightup = 'hit-zero-yellow';
$('.hit-zero-yellow').addClass(lightup);
$('#audio4')[0].play();
simonGamePlays.push(4);
setTimeout(function () {
$('#sound-four').removeClass(lightup);
}, off);
}
}
//outside function
getRandomIndex(); // function call
}
} //end of turn game on function
This doesn't work.....when I hit **start**, it only selects the green button lol.
And yes, I know I have some other logic issues, but I believe I can atleast get the sound to work first lol
Also, about the design, interesting point, I'll think about it...
What do you think that [i] does here? Does i have a value at this point in the code? If it does you have created a literal array with the value of i as it’s only element and then multiply it by Math.random()? You had it right the first time when you were multiplying by 4.
@RandellDawson, I previously re-wrote it to if(random==1), and if(random==2), and if(random==3), and if(random==4), but it was causing a button to disappear…so I changed it back…
That is a separate issue. If you write if (random[i] == [i]) { , the if statement will never evaluate to true. You said you wanted to focus on getting the sound to play, so I gave you suggestions of how to accomplish that.
I am heading out for a run, so I will be offline for a couple of hours.
//tie this if function into start button to enable random button to be selected by Simon game and audio played
if(buttons.length > 0) { //as long as greater than 0, can be two buttons, etc
function getRandomIndex(){
var random = Math.floor(Math.random() * 4);
buttons.item(random).click(); //randomIndex is parameter of item
simonGamePlays.push(random);
if(random ==1){
lightup = 'hit-zero-green';
$('.hit-zero-green').addClass(lightup);
$('#audio1')[0].play();
simonGamePlays.push(1);
setTimeout(function () {
$('.hit-zero-green').removeClass(lightup);
}, off);
}else if (random == 2) {
lightup = 'hit-zero-red';
$('.hit-zero-red').addClass(lightup);
$('#audio2')[0].play();
simonGamePlays.push(2);
setTimeout(function () {
$('.hit-zero-red').removeClass(lightup);
}, off);
}else if (random == 3) {
lightup = 'hit-zero-blue';
$('.hit-zero-blue').addClass(lightup);
$('#audio3')[0].play();
simonGamePlays.push(3);
setTimeout(function () {
$('.hit-zero-blue').removeClass(lightup);
}, off);
}else if (random == 4) {
lightup = 'hit-zero-yellow';
$('.hit-zero-yellow').addClass(lightup);
$('#audio4')[0].play();
simonGamePlays.push(4);
setTimeout(function () {
$('#sound-four').removeClass(lightup);
}, off);
}
}
//outside function
getRandomIndex(); // function call
}
} //end of turn game on function
