RobbleRabble / assignments

0 stars 0 forks source link

20 - scoreboard - intro to javascript #26

Closed RobbleRabble closed 4 years ago

RobbleRabble commented 4 years ago

Score Board

For this assignment, you are creating a simple interactive scoreboard for your favorite sport.

Requirements

Refer to this mockup to design your page:

Use the HTML and CSS here to jump-start your project.
A user should be able to update a score and the teams playing.

Explorer Mode

Part 1:

[x] Create a new project using the beta stack and implement the design using the given HTML & CSS.
[x] Assign click events to the update buttons to update the corresponding values on the page. The score buttons should adjust the current score by a "hard-coded" value.
[x] Deploy your site.

Part 2:

[ ] Add an if statement to stop each team's score from going below 0.
[ ] Add an if statement to stop each team's score from going above 21
[ ] When a team gets 21 points, disable the buttons and display a message to the user of who won
[ ] Add a reset button that resets the scoreboard back to each team having 0 points and re-enables the buttons

Adventure Mode

[ ] Add more CSS to the winning teams score to indicate who won.
[ ] Implement a Quarter/Period Tracker that would be appropriate for the sport.
[ ] Add some styling to make it more presentable. Have fun with it.
[ ] Make the layout responsive.

Epic Mode

[ ] Add a Timer that counts down automatically and updates the period/quarter appropriately.
[ ] Save/load the information to local storage.
[ ] Add anything else that your sport would have on its scoreboard (e.g., fouls, sacks, shots on goal).
[ ] Improve the UX to help to make scorekeeping by your sport easier.

RobbleRabble commented 4 years ago

https://hardcore-poitras-f6e0c1.netlify.com/

RobbleRabble commented 4 years ago

https://github.com/Kil-dozer/checkthescoreboard explorer