Rock Paper Scissors Project

Overview:

In this unit, coders will create a Rock, Paper, Scissors game. To create this project, coders will use JavaScript to take user input, use the Math Library to pick a random computer choice, and use conditionals to determine the winner.

Day 1

Planning

• Copy the project planning document and link a completed version in your ReadMe.

Set-Up

• Go to the repository at https://github.com/itscodenation/rockpaperscissors
• Fork this repository to your Github account and pull it down to Glitch
• Look through all the Starter Code

JavaScript

• Use JavaScript to display the value of the input on the page

HTML and CSS

• Add any more HTML elements you will need to the page
• Customize your HTML with CSS

Wrap

• Save and submit your website using the link on the session agenda.

Day 2

Javascript

• Outside of your click handler, declare the variables you'll need to track the user choice, computer choice and winner and assign them values of empty strings.
• Outside of your click handler, declare a randomNumber variable and set it equal to 0
• When the user initiates the game, generate a random number and assign it to the randomNumber variable.
• When the user initiates the game, store the user choice.
• When the user initiates the game, display user choice to the screen.

Wrap

• Save and submit your website using the link on the session agenda.

Day 3

JavaScript

• Write a conditional statement which, given the number range of randomNumber, assigns ‘rock’, ‘paper’ or ‘scissors’ to the variable that holds the computer choice.
• Display the computer choice to the screen.
• Write conditional statements that compare the user choice to the computer choice to determine the winner of the game.
• Display the winner to the screen.
• Clear the input value once a result is displayed.

Wrap

• Save and submit your website using the link on the session agenda.

Projects Extensions:

• Style your page to fit the developer's personality
• Validate the input so that it will return “Not valid input” if the user types in a wrong choice.
• Accept any form of a word regardless of capitalization (i.e. “Rock” “rock” roCk”)
• Keep track of total wins and losses, until the page refreshes.
• Allow for more variety in throwing options. Example: Rock-Paper-Scissors-Lizard-Spock

References/Tools

• Fellowship Reference Table
• How Jquery Works
• JQuery Events
• Math.random