A simple take on the classic guessing game hangman. This verison has a single category where the player has 6 chances to guess which english premier leauge team that is the hidden word. The games rules and task is easy to understand and has a simple gallow picture that updates if the player answers wrong. Upon six wrong answers the full gallow picture is represented on the screen and the player can chose to start over again with a new randomly selcted team.

Features

Design

Technologies Used

Testing

Deployment

Credits

The hangman image starts out with a images of an empty gallow, when the player chose a letter that is not in the hidden word the images updates one bodypart at per wrong answer. The image was selected for its stickman style to keep it playful and not draw so much attention to some what macabre nature of the games name and the imagary tide to it.

The games hidden word appears represented by blank lines in the center of the screen. The amount of lines represens the amount of letters in the randomly selected word. The keyboard serves as a clickable keyboard. When the player click a letter it gets inactivated, if the letter was a part of the hidden word it appears in its correct place on the dotted line, if the letter was not in the word one chance is subtracted from the total amount of trys avavlible to the player.

The reset button dose pretty much what it says in the tin. It reverts back to the original state of the page, ie it resets the players chances, brings back the original gallow image, activates all the keyboard buttons and selects a new random team for the player to guess.

If the player gets stuck they can use the hint button. The hint button triggers an alert to the player with a hint that consists of the hidden teams homestadium.

Design choices was kept to a minum in order to focus on maximazing practising javascript. The -apple-system font style was chosen from personal preference as was the background color.

-HTML5

-CSS3

-JavaScript

Git: was used for version control by utilising the Gitpod terminal to commit to Git and Push to GitHub.

GitHub: is used as the respository for the projects code after being pushed from Git.

Testing of HTML done via https://validator.w3.org/

All pages pass without errors or warnings

Testing of CSS done via https://jigsaw.w3.org/css-validator/

All pages pass without errors or warnings

Testing of JavaScript was done via https://jshint.com/

Code passes without any Errors but with 15 warnings regarding syntax in ES6

Lighthouse testing:

The project was deployed via GitHub pages

Link to the page: https://krookmartin.github.io/Project2HangMan/

Code idea and implementaion by https://www.youtube.com/c/SimonSuhOnline

and www.w3schools.com

Code idea and implementaion by https://www.youtube.com/c/SimonSuhOnline

Images from http://www.pexels.com