diff --git a/index.html b/index.html index af638da..a46ee5b 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,7 @@

Guessing Game

less?

- +
diff --git a/index.js b/index.js index f3bc6d8..b680982 100644 --- a/index.js +++ b/index.js @@ -5,12 +5,12 @@ const messages = document.getElementsByClassName('message'); const tooHighMessage = document.getElementById('too-high'); const tooLowMessage = document.getElementById('too-low'); const maxGuessesMessage = document.getElementById('max-guesses'); -const numberOfGuessesMessage = document.getElementById('num-of-guesses'); +const numberOfGuessesMessage = document.getElementById('number-of-guesses'); const correctMessage = document.getElementById('correct'); let targetNumber; -const attempts = 0; -const maxNumberOfAttempts = 5; +let attempts = 0; +let maxNumberOfAttempts = 5; // Returns a random number from min (inclusive) to max (exclusive) // Usage: @@ -22,18 +22,22 @@ function getRandomNumber(min, max) { return Math.floor(Math.random() * (max - min)) + min; } + function checkGuess() { // Get value from guess input element - const guess = parseInt(guessInput.value, 10); + let guess = parseInt(guessInput.value, 10); attempts = attempts + 1; - hideAllMessages(); + if (guess === targetNumber) { numberOfGuessesMessage.style.display = ''; numberOfGuessesMessage.innerHTML = `You made ${attempts} guesses`; correctMessage.style.display = ''; + tooLowMessage.style.display = 'none'; + tooHighMessage.style.display = 'none'; + maxGuessesMessage.style.display = 'none'; submitButton.disabled = true; guessInput.disabled = true; @@ -42,8 +46,10 @@ function checkGuess() { if (guess !== targetNumber) { if (guess < targetNumber) { tooLowMessage.style.display = ''; + tooHighMessage.style.display = 'none'; } else { - tooLowMessage.style.display = ''; + tooHighMessage.style.display = ''; + tooLowMessage.style.display = 'none'; } const remainingAttempts = maxNumberOfAttempts - attempts; @@ -52,32 +58,41 @@ function checkGuess() { numberOfGuessesMessage.innerHTML = `You guessed ${guess}.
${remainingAttempts} guesses remaining`; } - if (attempts ==== maxNumberOfAttempts) { + if (attempts === maxNumberOfAttempts) { submitButton.disabled = true; guessInput.disabled = true; + maxGuessesMessage.style.display = ''; + tooHighMessage.style.display = 'none'; + tooLowMessage.style.display = 'none'; + } guessInput.value = ''; - resetButton.style.display = ''; + resetButton.style.display= ''; } function hideAllMessages() { - for (let elementIndex = 0; elementIndex <= messages.length; elementIndex++) { + for ( let elementIndex = 0; elementIndex < messages.length; elementIndex++) { messages[elementIndex].style.display = 'none'; + + + //console.log(messages[elementIndex]); } } - -funtion setup() { +hideAllMessages(); +function setup() { // Get random number targetNumber = getRandomNumber(1, 100); console.log(`target number: ${targetNumber}`); // Reset number of attempts - maxNumberOfAttempts = 0; + //maxNumberOfAttempts = 5; + attempts=0; + // Enable the input and submit button - submitButton.disabeld = false; + submitButton.disabled = false; guessInput.disabled = false; hideAllMessages();