https://github.com/top-submissions/foundations-rock-paper-scissors

https://github.com/top-submissions/foundations-rock-paper-scissors

foundations-path the-odin-project

Last synced: 11 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/top-submissions/foundations-rock-paper-scissors
• Owner: top-submissions
• Created: 2025-07-06T01:09:40.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2025-07-15T00:59:52.000Z (11 months ago)
• Last Synced: 2026-04-03T13:54:15.590Z (2 months ago)
• Topics: foundations-path, the-odin-project
• Language: JavaScript
• Homepage:
• Size: 14.6 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# rock-paper-scissors

## Checklist

### Tasks:

1. Touch files

    - [x] index.html

    - [x] script.js

2. Initialize index.html

    - [x] Boilerplate

    - [x] Link to script.js

3. Initialize script.js

    - Variables

        - [x] computerChoice

        - [x] humanChoice

        - [x] roundCount

        - [x] computerScore

        - [x] humanScore

    - Functions

        - [x] getComputerChoice

        - [x] getHumanChoice

        - [x] getRoundCount

        - [x] playRound

4. Create getComputerChoice function

    - [x] Use Math.random function to get a value between 0 and 1

    - [x] If value is 0-32, return rock

    - [x] If value is 33-66, return paper

    - [x] If value is 67-100, return scissors

    - [x] Assign return value to computerChoice

5. Create getHumanChoice function

    - [x] Use prompt function to get choice

    - [x] Use toLowerCase function to make case-insensitive

    - [x] Assign return value to humanChoice

6. Create getRoundCount function

    - [x] Use prompt function to get choice

    - [x] Assign return value to roundCount

7. Create playRound function

    - [x] Have computerChoice, humanChoice, roundCount as parameters

    - [x] After round, increment scores, roundCount and print result to console

8. Create calcScore function

    - [x] Check if humanScore > computerScore, print result

    - [x] Check if humanScore < computerScore, print result

    - [x] Check if humanScore === computerScore, print result

9. Build DOM structure in index.html:

    - [x] Input element for round count

    - [x] Buttons for human choice

    - [x] Labels for computer choice

    - [x] Play round button

    - [x] Label for round win

    - [x] Labels for current score

    - [x] Label for game win

10. Add styles to index.html elements

    - [x] Display flex

    - [x] FlexFlow column

    - [x] FlexFlow row

    - [x] Justify content

    - [x] Align items

    - [x] Justify items

    - [x] Flex

11. Add function to the Confirm button in round-count-container

    - [x] Add event listener click 

    - [x] Assign round count value

    - [x] Make sure that button becomes disabled after click

    - [x] Fix button being disabled at the start

12. Make Play Round button functional

    - [x] Get radio buttons and play round button from DOM

    - [x] Add event listener

    - [x] Check each radio if checked

    - [x] Assign to human choice

    - [x] Call calculate results function

13. Alter playRound function

    - [x] Add fieldset to show current round and round winner

    - [x] Add round-display-container to styles.css

    - [x] Update current round display and winner

14. Debug files

    - [x] Fix round winner and round display not working

    - [x] Fix roundCount not taking value from roundCountInput input element

    - [x] Add label to display computer choice

    - [x] Remove duplicate fieldset results-container