Rock, Paper, Scissors is a designed to show that Javascript can be used to make a fun interactive game of chance. This site is aimed at those who want to play against the computer in a heads up game of chance.
-
The Rock, Paper, Scissors Heading
- Featured at the top of the page, the heading is simply to outline the name of the game.
-
The Game Area
- This section will allow the user to play the game. The user will be able to easily see buttons they can use to choose either rock, paper or scissors.
-
The Scores section
-
The Results Area
- This section shows the result of both choices and displays a message detailing if it was a win, loss or draw.
-
When testing this project I made sure to check on other devices, after deployment I used my iPhone 13 and it worked as expected. Other tests I did included the lighthouse test, on my first test you can see that I got a very low score on performance,this was because my images were sized incorrectly, I used Lint images to check the responsiveness of the images and as you can see here it outlines the issue,I then resized the images and as you can see it improved the score significantly.
-
While testing I noticed that my style.css would not change for the computer-score div, after some time I noticed that I had placed the closing /div tag in the wrong line of code as you can see here, once I placed it at the correct place then my styling worked as intended.
- HTML
- No errors were returned when passing through the official W3C validator
- CSS
- No errors were found when passing through the official (Jigsaw) validator
- JavaScript
- No errors were found when passing through the official Jshint validator
- The following metrics were returned:
- There are 6 functions in this file.
- Function with the largest signature take 2 arguments, while the median is 1.
- Largest function has 8 statements in it, while the median is 3.
- The most complex function has a cyclomatic complexity value of 3 while the median is 2.
- No errors were found when passing through the official Jshint validator
There are no unfixed bugs.
This section should describe the process you went through to deploy the project to a hosting platform (e.g. GitHub)
- The site was deployed to GitHub pages. The steps to deploy are as follows:
- In the GitHub repository, navigate to the Settings tab
- From the source section drop-down menu, select the Master Branch
- Once the master branch has been selected, the page will be automatically refreshed with a detailed ribbon display to indicate the successful deployment.
The live link can be found here - https://jakecun.github.io/RPS/
- The images used for the game icons and were taken from https://pngtree.com/so/rock-paper-scissors
- The image for the favicon was sourced from https://www.flaticon.com/free-icon/rock-paper-scissors_6831874?term=rock+paper+scissors&page=1&position=61&origin=tag&related_id=6831874