var secretNumber = Math.floor(Math.random() * 101);
var guess = document.getElementById("guess");
var answer = document.getElementById("answer");
var container = document.getElementById("container");
var correctGuess = document.getElementById("correctGuess");
var guessButton = document.getElementById("guessButton");
var retryButton = document.getElementById("retryButton");
var scores = document.getElementsByClassName("score");
var i = 0;
var j = 0;
console.log(secretNumber);

function checkGuess(){
	if (guess.value > 100 || guess.value < 0 || guess.value == ""){
		answer.innerHTML = "The number should be between 0 and 100.";
	}
	else if (guess.value == secretNumber){
		i++;
		answer.innerHTML = "You guessed right in " + i + " tries.";
		container.style.border = "10px solid #4dbe4d";
		guess.style.display = "none";
		guessButton.style.display = "none";
		retryButton.style.display = "block";
		correctGuess.innerHTML = guess.value;
		correctGuess.style.display = "block";
		scores[j].style.color = "#4dbe4d";
	} else if( guess.value < secretNumber){
		i++;
		answer.innerHTML = "Too low.";
		container.style.border = "10px solid red";
		scores[j].style.color = "red";
		j++;
		if(i == 10){
			answer.innerHTML = "Game over.";
			guessButton.style.display = "none";
			retryButton.style.display = "block";
		}
	} else if( guess.value > secretNumber){
		i++;
		answer.innerHTML = "Too high.";
		container.style.border = "10px solid red";
		scores[j].style.color = "red";
		j++;
		if(i == 10){
			answer.innerHTML = "Game over.";
			guessButton.style.display = "none";
			retryButton.style.display = "block";
		}
	}
}

function clearAnswer(){
	answer.innerHTML = "";
	container.style.border = "none";
}


function playAgain(){
	i = 0;
	for (k = 0; k < scores.length; k++) {
  		scores[k].style.color = "white";
	}
	secretNumber = Math.floor(Math.random() * 101);
	console.log(secretNumber);
	guess.value="";
	answer.innerHTML="";
	guessButton.style.display = "block";
	retryButton.style.display = "none";
	guess.style.display = "block";
	correctGuess.style.display = "none";
	container.style.border = "none";
	j = 0;
}


guess.addEventListener("keyup", function(event) {
  if (event.keyCode === 13) {
   event.preventDefault();
   guessButton.click();
  }
});