$(".start").click(function() {
gamePlay();
 });
function userPlay(userArr) {
  
  $(".button1").click(function() {
    if(userArr.length <= ctr){
    userArr.push(0);
    console.log(userArr);
    $('.button1').toggleClass('button1Light');
    setTimeout(function() {
      $('.button1').toggleClass('button1Light');
    }, 1000);
    }else{
        game();
    }
  });
  $(".button2").click(function() {
    if(userArr.length <= ctr){
    userArr.push(1);
    console.log(userArr);
    $('.button2').toggleClass('button2Light');
    setTimeout(function() {
      $('.button2').toggleClass('button2Light');
    }, 1000);
    }else{
        game();
    }
  });
  $(".button3").click(function() {
    if(userArr.length <= ctr){
    userArr.push(2);
    console.log(userArr);
    $('.button3').toggleClass('button3Light');
    setTimeout(function() {
      $('.button3').toggleClass('button3Light');
    }, 1000);
    }else{
        game();
    }
  });
  $(".button4").click(function() {
    if(userArr.length <= ctr){
    userArr.push(3);
    console.log(userArr);
    $('.button4').toggleClass('button4Light');
    setTimeout(function() {
      $('.button4').toggleClass('button4Light');
    }, 1000);
    }else{
        game();
    }
  });
    
}

function checkScore() {
  console.log(gameArr.length);
  if (gameArr.length === 0) {
    return false;
  } else {
    for (var i = 0; i < gameArr.length; i++) {
      console.log(gameArr[i]);
      console.log(userArr[i]);
      if (gameArr[i] !== userArr[i]) {
        return true;
      } else {
        return false;
      }
    }
  }
}



function generateRandomSeq(ctr, val) {
  for(i = 0; i < ctr; i++){
  var num = Math.floor(Math.random() * 3);
  val.push(num);
  selectButton(num);
  console.log(val);
  }
  return val;
}

function gamePlay() {
  ctr = 1
  setInterval(function() {
    console.log(ctr)
    compArr = generateRandomSeq(ctr);
    userArr = userPlay(ctr);
    console.log(compArr)
    ctr++
     
    
  }, 300);

}

function selectButton(val) {
  switch (val) {
    case 0:
      $('.button1').toggleClass('button1Light');
      setTimeout(function() {
        // toggle back after 1 second
        $('.button1').toggleClass('button1Light');
      }, 1000);
      break;
    case 1:
      $('.button2').toggleClass('button2Light');
      setTimeout(function() {
        // toggle back after 1 second
        $('.button2').toggleClass('button2Light');
      }, 1000);
      break;
    case 2:
      $('.button3').toggleClass('button3Light');
      setTimeout(function() {
        // toggle back after 1 second
        $('.button3').toggleClass('button3Light');
      }, 1000);
      break;
    case 3:
      $('.button4').toggleClass('button4Light');
      setTimeout(function() {
        // toggle back after 1 second
        $('.button4').toggleClass('button4Light');
      }, 1000);
      break;

  }
}