A-01 : Hi-Lo in JavaScript and HTML SOLVED

 Description: This is an individual assignment. You will write an application as part of an HTML file that will play a typical HiLo game, where the player guesses values in a specific range until the correct number is found. Objectives: • To practice writing HTML and JavaScript functions • To use some of the events supported by the Document Object Model • Become familiar with client-side validation and feedback techniques Requirements: 1. The entire application must be written in one HTML page using only JavaScript and HTML. 2. Call this web page a01.html 3. Do not use a any external CSS styling. This assignment is not about creating and using CSS. But if you do want to experiment with styles, define the style in theelement or use in-line styles 4. When the page initially loads, the application should prompt the user for their name. 5. After the name is entered (cannot be blank), the application will prompt the user (by name) to enter the maximum guess number a. The application will only allow the user to enter a number and will ensure the value greater than 1. 6. Your Hi-Lo application must create a random integer between 1 and the maximum guess number 7. The following must be components of the main runtime User Interface: a. A prompt and textbox to allow the user to enter a new guess at the random number b. A button to submit the guess c. A message that informs the user about their allowable guessing range • For example, let’s say the user enters 10 as their maximum number – your initial message would read “Your allowable guessing range is any value between 1 and 10.” • If the random number you chose was 7 and the user guesses 5, then after submitting their guess the message would change to “Your allowable guessing range is any value between 6 and 10” d. If the user happens to enter a number outside of the allowable range – your logic can ignore that value and simply restate your allowable guessing range message • For example, let’s say the allowable guessing range is between 6 and 10 and the user enters the value 44 or -10 … since they are number values, it’s allowed – simply restate the last allowable guessing range message e. During the game, if the user enters anything but a number, I expect your Hi-Lo game to remind the user that they need to enter a number – so display some kind of error message to that effect as well as the allowable guessing range message A-01 : f. When the user’s guess is correct, change the background colour of the page and show a message on the screen saying “You Win!! You guessed the number!!” • At this point, show a “Play Again” button and reset your page to do it again • Only this time you don’t need to prompt the user for their name – but you should prompt them for a new maximum number. 8. Make sure that all data entered is validated for proper data type and in some cases proper data ranges/values a. Remember that the objective of the code is to create a workable Hi-Lo game b. Also remember that giving the user timely feedback is a mandated usability factor Hand in: 1. The final HTML page 2. Make sure you comment appropriately (HTML header comment, JavaScript function comment blocks as well as inline comments) 3. Make sure that your Hi-Lo application runs properly and consistently within the Internet Explorer and Chrome browsers 4. When submitting your HTML to the drop-box, please ZIP it up first