codeSleuth.js

var playerOne = true;
var playerTwo = false;
var playerOneScore = 0;
var playerTwoScore = 0;
var buttonIds = ["colorButton1", "colorButton2", "colorButton3", "colorButton4"];
var correctButtonId;

// kicks the game off
onEvent("startButton", "click", function() {
  setScreen("screen1");
  colorMyButtons();
});

// these event listeners respond to the user tapping on one of the buttons.
// when the button is tapped, the program checks to see if its 
onEvent("colorButton1", "click", function() {
  handleColorButtonClick("colorButton1");
});

onEvent("colorButton2", "click", function() {
  handleColorButtonClick("colorButton2");
});

onEvent("colorButton3", "click", function() {
  handleColorButtonClick("colorButton3");
});

onEvent("colorButton4", "click", function() {
  handleColorButtonClick("colorButton4");
});

// checks to see if the user selected the right answer.
// if they did, they gain a point. 
function handleColorButtonClick(selectedButtonId) {
  if (playerOne == true) {
    setProperty("playerOneScoreLabel", "border-width", 0);
    setProperty("playerTwoScoreLabel", "border-width", 1);
    if (selectedButtonId == correctButtonId) {
      playerOneScore = playerOneScore + 1;
      setText("playerOneScoreLabel", playerOneScore);
    } 
  } else {
    setProperty("playerOneScoreLabel", "border-width", 1);
    setProperty("playerTwoScoreLabel", "border-width", 0);
    if (selectedButtonId == correctButtonId) {
      playerTwoScore = playerTwoScore + 1;
      setText("playerTwoScoreLabel", playerTwoScore);
    }
  }
  if (playerOneScore == 10 || playerTwoScore == 10) {
    setScreen("gameOverScreen");
    getWinner();
  }
  togglePlayerTurn();
  colorMyButtons();
}

// toggles between playerOne's turn and playerTwo's
function togglePlayerTurn() {
  playerOne = !playerOne;
  playerTwo = !playerTwo;
}

// generates a random RGB color, and makes one slightly different RGB color
function generateRgb() {
  var rValue = randomNumber(0, 255);
  var gValue = randomNumber(0, 255);
  var bValue = randomNumber(0, 255);
  return [rgb(rValue, gValue, bValue), rgb(rValue + 50, gValue + 50, bValue + 50)];
}

// changes the color of the buttons after each turn. one button will be 
// a slightly different color from the others.
function colorMyButtons() {
  var index = randomNumber(0, 3);
  correctButtonId = buttonIds[index];
  var colors = generateRgb();
  for (var i = 0; i < buttonIds.length; i++) {
    if (i != index) {
      var button = buttonIds[i];
      setProperty(button, "background-color", colors[0]);
    } else {
      setProperty(buttonIds[index], "background-color", colors[1]);
    }
  }
}

function getWinner() {
  var message;
  if (playerOne == true){
    message = "Player One is the winner!";
  } else {
    message = "Player Two is the winner!";
  }
  setText("gameOverLabel", message);
}