Tennis Scoreboard

Overview

A web application that implements a scoreboard for a tennis match. The idea is taken from here

Technologies / tools used:

Application interface

Home page

URL - '/home'

• Links leading to the new match and the list of completed matches pages

New match page

URL - /new-match

Interface:

• HTML form with fields “Player name 1”, “Player name 2” and a “start” button. For simplicity, let's assume that player names are unique. A player cannot play with himself.
• Clicking the “start” button will result in a POST request to /new-match

POST request handler:

• Checks for the existence of players in the Players table. If a player with this name does not exist, we create one.
• Create an instance of the Match class (containing the players' ids and current score) and put it into the collection of current matches (existing only in the application memory or in key-value storage). The key of the collection is the UUID, the value is the Match class instance
• Redirect to the page /match-score?uuid=$match_id

Match score page

URL - /match-score?uuid=$match_id. GET parameter uuid contains the UUID of the match.

Interface:

• Table with player names, current score
• Forms and buttons for actions - “player 1 won the current point”, “player 2 won the current point”
• Clicking the buttons leads to a POST request to /match-score?uuid=$match_id, the fields of the submitted form contain the id of the player who won the point.

POST request handler:

• Retrieves an instance of the Match class from the collection
• According to which player won the point, updates the match score
• If the match is not over - renders the match score table with the buttons described above
• If the match is over:
  • Delete the match from the collection of current matches
  • Write the finished match to SQL database
  • Rendering the final score

Match result page

• The match result page is returned when the match ends.
• The address is the same as the match itself.
• Shows winner name

Played matches page

URL - /matches?page=$page_number&filter_by_player_name=$player_name. GET parameters:

• page - page number. If the parameter is not specified, the first page is implied
• filter_by_player_name - name of the player whose matches we are looking for. If the parameter is not set, all matches are displayed

Interface:

• Form with filter by player name. An input field for the name and a “search” button. A GET request of the form /matches?filter_by_player_name=${NAME} is generated when clicked.
• List of matches found
• Page switch, if more matches are found than can fit on one page.

Database diagram

Requirements

• Java 17+
• Apache Maven
• Tomcat 10
• Intellij IDEA

Project launch

1. Clone the repository:

   git clone https://github.com/ssss1131/tennis-Scoreboard.git
   

2. Open Intellij IDEA and in Main Menu -> Open select the folder you have decloned.

3. In Intellij IDEA, select Run -> Edit Configuration.

4. In the pop-up window, click "+" and add Tomcat :

   

5. Then click "Fix" :

   

6. In the window that pops up, select :

   

7. In the Application context leave the following :

   

8. Click Apply and start Tomcat