Lab: Rock - Paper- Scissors Coding Challenge

rock-paper-scissors.md

“Rock – Paper – Scissors” Coding Challenge

Hope you know the rules for this game! If not, here is the gist – rock beats scissors, scissors beats paper and paper beats rock.

The objective of this project is to create a functional interface that will allow a user to play this game with a bot as many times as possible within a stipulated amount of time.

Create a page that will have the following:

1. 2 input fields. One will take minutes and the other will take seconds.
2. A block to show the timer.
3. 3 buttons representing rock, paper and scissors. The user should be able to click on a button to indicate his/her choice.
4. A block to show what the bot chose.
5. Have three score blocks to show the number of wins, losses and draws respectively for the user. For example, if the user chose “Rock” and the bot randomly chose “Scissors”, it is a win for the user. If the user and the bot choose the same item, it will be considered a draw for both the user and the bot.
6. A start button. (optional)
7. A restart button.

What should the page do:

1. Allow the user to input a number on each field. This number will represent the maximum time allowed for the user to play.
2. Once the user inputs a number and clicks on the start button, the timer should count down every second starting with the number provided by the user. The timer should stop once it reaches 0.
3. Warn the user once the timer reaches 10 seconds
4. Once the timer starts, allow the user to indicate his/her choice.
5. As soon as the user makes his choice, have the bot make a choice randomly between “Rock”, “Paper” and “Scissors”.
6. The score blocks (wins, losses and draws) should be zero to begin with. Once the bot makes the random choice, determine the outcome based on what the user and the bot chose and then update the score blocks for the user.
7. The restart button should restart the timer (starting from the input number) and reinitialize all scores to zero.
8. The user should be able to play as many times as he/she wishes within the stipulated time (i.e., until the timer reaches 0).
9. Once the timer expires (reaches0) show a message indicating who won.

How the page should be:

• Responsive
• Simple and pretty

Please use:

• HTML5
• CSS3
• Javascript and jQuery
• SASS/LESS is a plus

Please do not use:

• Bootstrap or Foundation
• jQuery plugins

Please create a git repository and work on it. Commit frequently. Once the task is completed, please share the repository link.

Any improvements and enhancements on the above task will be a plus.