Introduction

As your first JavaScript MP, this MP serves as an introduction to programming in JavaScript. To complete this MP, you will complete two tasks:

1. Connecting the JavaScript you will write to the HTML web page (we will walk you through this part)
2. Programming a function to check if you guessed the secret number.

This MP, like all MPs in CS 105, is a solo assignment. Review the course syllabus to understand exactly what is expected of you when it comes to academic integrity.

Downloading

To get started, you will first need to download the base files for MP1 here. The file you downloaded is a ZIP file and must be extracted before it can be used.

• If you are on OS X, double clicking on the file you downloaded will extract it as a folder.
• If you are on Windows, you must right click the file and click Extract All.... If you double click instead of extracting, your MP will not work!

Once extracted, you should have a directory that has exactly two files: mp1.html and mp1.js. By default mp1.html will open up in a web browser, which should display the MP1 web page. If you attempt to guess a number, you will notice that it does not work since we have not programmed it to do anything yet!

Part 1

Connecting the web page with the JavaScript

We have already provided a lot of the code to get you started and the HTML is almost entirely complete. However, you need to do one small thing to connect the HTML web page to the JavaScript that you will write in Step 2.

Open up mp1.html in a plain text editor and complete the following:

1. Scroll down to Line 37, which reads: <input type="button" value="Guess!">
2. After value="Guess!" but before the >, we will add a new attribute to the HTML tag. Add onclick="processGuess()", making sure to leave at least one space between the new attribute and value attribute.
3. Your new Line 37 should now read: <input type="button" value="Guess!" onclick="processGuess()">

By doing this, you have instructed your web browser to run the JavaScript function processGuess() when the button on the web page is clicked. Make sure to save your HTML and then to test that you did this correctly before starting on Part 2!

Testing

To check if you have completed Part 1, open (or reload) your MP1 HTML page inside of a web browser. After refreshing, enter a number into the text box and press "Check!":

• Part 1 is COMPLETE if, when you press "Check!", the web page pops up a message that says:
  Your HTML is talking to the JavaScript -- but your checkNumber function did not return a value!
• If your web page does nothing at all when you press "Check!", you did not complete Part 1 correctly. Carefully review the instructions and try again.

Part 2

Programming the Number Checker

For Part 2, you must complete the checkNumber function that is found in mp1.js. The checkNumber function has two parameters:

• secretNumber, the randomly generated secret number (a number in the range 1-100)
• guessedNumber, the number that was guessed by the user

With those two parameters, the checkNumber function must do the following:

• Return "Guess Smaller" if the user should guess a smaller number next time in order to get to the random number.
• Return "Guess Larger" if the user should guess a larger number next time in order to get to the random number.
• Return "Correct" if the user guessed the number correctly.

Testing

When you are ready to test Part 2, make sure to save the mp1.js file and then open or refresh the mp1.html page in a web browser. Enter a number into the text box and press "Check!":

• Part 2 is complete if a log of your guesses and the outcome appears below your guess text box and button.
• If a log of your guesses does NOT appear, you have a bug somewhere in your code.
  • If any messages pop up, read the message. We have included some helpful tips for common errors.
  • Use your JavaScript console built into Chrome and/or Firefox to see if there are any error messages that are given to you by your browser.

Submission and Grading

Due to the very simple nature of this MP, there will be no partial credit. You should make sure your MP works completely before submitting it.

Submit MP1 here