diff --git a/index.html b/index.html
index af638da..2d9010d 100644
--- a/index.html
+++ b/index.html
@@ -15,7 +15,7 @@
Guessing Game
less?
-
+
diff --git a/index.js b/index.js
index 4c2a94e..9783dd7 100644
--- a/index.js
+++ b/index.js
@@ -1,5 +1,15 @@
const guessInput = document.getElementById('guess');
const submitButton = document.getElementById('submit');
+
+//event listener to validate input data
+guessInput.addEventListener("input", () => {
+ const value = guessInput.valueAsNumber;
+
+ submitButton.disabled =
+ isNaN(value) || value < 1 || value > 99;
+});
+
+
const resetButton = document.getElementById('reset');
const messages = document.getElementsByClassName('message');
const tooHighMessage = document.getElementById('too-high');
@@ -25,6 +35,7 @@ function getRandomNumber(min, max) {
function checkGuess() {
// Get value from guess input element
const guess = parseInt(guessInput.value, 10);
+
attempts = attempts + 1;
hideAllMessages();
@@ -37,22 +48,28 @@ function checkGuess() {
submitButton.disabled = true;
guessInput.disabled = true;
- }
-
- if (guess !== targetNumber) {
+ } else {
+ //was 2 if instead if/else
if (guess < targetNumber) {
tooLowMessage.style.display = '';
} else {
- tooLowMessage.style.display = '';
+ //wrong message was displayed - tooLowMessage
+ tooHighMessage.style.display = '';
}
const remainingAttempts = maxNumberOfAttempts - attempts;
+
+ //additing of output with quontity of remain guesses
+ numberOfGuessesMessage.style.display = '';
- numberOfGuessesMessage.style.display = '';
+ if (remainingAttempts === 1) {
+ numberOfGuessesMessage.innerHTML = `You guessed ${guess}.
1 guess left`;
+ } else {
numberOfGuessesMessage.innerHTML = `You guessed ${guess}.
${remainingAttempts} guesses remaining`;
}
-
- if (attempts ==== maxNumberOfAttempts) {
+}
+// was additional '=' in row below
+ if (attempts === maxNumberOfAttempts) {
submitButton.disabled = true;
guessInput.disabled = true;
}
@@ -61,23 +78,25 @@ function checkGuess() {
resetButton.style.display = '';
}
-
+//<= massages.length can give result undefined
function hideAllMessages() {
- for (let elementIndex = 0; elementIndex <= messages.length; elementIndex++) {
+ for (let elementIndex = 0; elementIndex < messages.length; elementIndex++) {
messages[elementIndex].style.display = 'none';
}
}
-
-funtion setup() {
+//misspelling in "function"
+function setup() {
// Get random number
targetNumber = getRandomNumber(1, 100);
console.log(`target number: ${targetNumber}`);
// Reset number of attempts
- maxNumberOfAttempts = 0;
+ // Does not valid out of this function on global level: const maxNumberOfAttempts = 0; we need attempts
+ attempts = 0;
// Enable the input and submit button
- submitButton.disabeld = false;
+ // we need to turn off submitButton before input check
+ submitButton.disabled = true;
guessInput.disabled = false;
hideAllMessages();