"Simon Game" Help

Hello, I seem to be having a problem with my Simon Game. I cannot find a way to stall for the next button change that the program is supposed to make. As you can see from my program, the properties of the buttons are changed simultaneously and I would like to allow for some gap time in between. However, I am not sure how to do that. I have labeled the part in my code where I would want to add this functionality. It has been commented as //Help. It would be really helpful if someone can show me how I can perform this task.

Thanks for your response. However even after I changed it, I do not get the pause between the button presses that I am looking for. Is their some way I can pause between when I am transitioning from changing the properties of one button to another.

@mthaker1

I’d suggest using setTimeout( () => {}, i * interval) for that, where i is the number of turns and the interval is however much time you want between turns.

Okay I will try that and see if it works.

Thanks for the reply. I’ve gotten everything to work except for the delay between the flashes. I tried using .delay() in many areas however it did not work. Maybe I could get a hint as to where to place my .delay() function.

I would recommend using a setTimeout function as well, and putting them somewhere inside your .click functions. I’ve tried using .delay() but it also didn’t work out for me.

Yes, I just tried using the setTimeout function, I used a setTimeout function with a longer duration to light up the function and a setTimeout function with a shorter duration to reduce the opacity of the button to its original state. However, this solution does not seem to work as well. So I am not sure where to place my setTimeout function to ensure that the program works correctly. My program seems to be working well in all other categories but I just need a little pause time when transitioning between buttons.

Another problem I found is that the opacity doesn’t change back to normal while the program is running. Thus, I was wondering if someone could look at what I’m doing wrong and mention things I might need to add to my program to make it work.

Ok, I’ve taken a closer look at your code and come up with something:

   function displayCompTurn(){
     for(var i = 0; i < series.length;i++){
       playButtons(series[i], i);
     }
  }
  
  function playButtons(element, i){
    
  setTimeout( function () {
      if(element == "red"){
      redSound.play();
    }
    else if(element == "green"){
      greenSound.play();
    }
    else if(element == "yellow"){
      yellowSound.play();
    }
    else if(element == "blue"){
      blueSound.play();
    }
      console.log("Working");
      document.getElementById(element).style.opacity = "1";
      
      setTimeout(function(){
      document.getElementById(element).style.opacity = "0.4";
    },600);
    }, i * 650);

This sets the timeout between computer turn displays to 650ms times the number of turns, and then removes it 600ms after it’s been called. You’ll still want to add a delay between the player’s last action and the next computer turn, just for playability.

Hi, thanks for your reply. I have implemented your method and it does fix some of the problems I was having. However, as per your suggesstion on adding a delay between the players’ last action and the next computer turn. I have no idea how I would this and where I would add it into my code. I tried adding it to my for loop, as so

function displayCompTurn(){
for(var i = 0; i < series.length;i++){
playButtons(series[i]);
setInterval(
function(){ widget.Rotator.rotate() },
3000
);
}
}

But I did not achieve the function that I was hoping for. So I just need help as to how and where I will need to place the delay, to achieve the desirable function.

Thank you so much for helping me solve this problem. I found the problem with my code. It turned that there was a missing element that I forgot to include in my code and I always thought it was there when it really wasn’t. It was a careless mistake. However I would like to thank the freecodecamp forum, rmdawson71, znicholasbrown, and migohunter for providing me with advice throughout the project. Thank you very much guys.

2 Likes

I just fixed that problem. Thanks for the suggestion. I found it really helpful.