Table of Contents
Part 1: Kart Designs .............................................................................................................. 3
Overview ........................................................................................................................... 3
Kart Design Rationale........................................................................................................ 4
Part 2: Racetrack Development ............................................................................................. 8
General Racetrack Development ........................................................................................ 8
Additional Game Enhancements ........................................................................................ 9
Track Enhancements ..................................................................................................... 9
Kart Enhancements...................................................................................................... 14
Collision Strategy ........................................................................................................ 17
Sound Effects .............................................................................................................. 19
Interactive Main Menu and Rematch Option................................................................ 22
Part 3: Server-Clients Implementation ................................................................................. 24
Client Connection ............................................................................................................ 26
Setting Player Type ......................................................................................................... 27
Thread Creation for ClientHandler ................................................................................... 29
First Client Connection .................................................................................................... 29
Protocol In Reading and Writing UTF ............................................................................. 30
Player Leaving and New Thread ...................................................................................... 33
Critical Self-Evaluation ....................................................................................................... 35
References .......................................................................................................................... 36
Appendices ......................................................................................................................... 37
SID XXXXXXX
Table of Figures
Figure 1: Kart Rotating (1) .................................................................................................... 3
Figure 2: Kart Rotating (2) .................................................................................................... 3
Figure 3: Kart Rotating (3) .................................................................................................... 3
Figure 4: Kart Rotating (4) .................................................................................................... 3
Figure 5: Kart Rotating (5) .................................................................................................... 3
Figure 6: Kart Rotating (6) .................................................................................................... 3
Figure 7: General Red Kart Design........................................................................................ 4
Figure 8: General Blue Kart Design ...................................................................................... 4
Figure 9: Map 1 Thumbnail and Dimmed Preview ................................................................ 9
Figure 10: Map 1................................................................................................................. 10
Figure 11: Map 2 Thumbnail and Dimmed Preview ............................................................ 11
Figure 12: Map 2................................................................................................................. 12
Figure 13: Part 2: Switching Kart Skins............................................................................... 15
Figure 14: Part 2: Kart Skin Display .................................................................................... 16
Figure 15: Part 2: Collision Strategy.................................................................................... 18
Figure 16: Part 2: BGM ....................................................................................................... 20
Figure 17: Part 2: SFX ........................................................................................................ 21
Figure 18: Part 2: Rematching ............................................................................................. 23
Figure 19: New Server Console ........................................................................................... 25
Figure 20: Server Waiting For Players................................................................................. 25
Figure 21: Part 3: Client Connecting to Server .................................................................... 26
Figure 22: Part 3: Player Number Arrangement ................................................................... 27
Figure 23: Part 3: Player Number Arrangement ................................................................... 28
Figure 24: Part 3: Thread to Start New ClientHandler ......................................................... 29
Figure 25: Part 3: First Client Connection Messages ........................................................... 30
Figure 26: Part 3: Protocol Initialization .............................................................................. 30
Figure 27: Part 3: DataOutputStream.writeUTF(UTF) ......................................................... 31
Figure 28: Part 3: DataInputStream.readUTF() .................................................................... 32
Figure 29: Part 3: Clearing Leaving Player Data .................................................................. 33
Figure 30: Part 3: New Thread for Incoming Players ........................................................... 34
1
SID XXXXXXX
Table of Tables
Table 1: Part 1 Kart Images ................................................................................................... 6
Table 2: Table of User Key Controls ..................................................................................... 8
Table 3: Table of Protocols ................................................................................................. 24
2
SID XXXXXXX
Part 1: Kart Designs
Overview
For Part 1, a program that rotates images has been implemented. This program is based off
‘Animating a Series of Images’ from Deitel & Deitel’s book Java: How to Program. It consists
of 1 JFrame that has 1 JPanel that rotates 2 different kart images in a paintComponent() that
has it’s time regulated by the animationTimer. In theory, images are just rotating at what is
depicted as 22.5 degree over the time set. Practically, there are a total set of 16 images in 2
different folders named kartRedImages and kartBlueImages. These folders contain the already
rotated image that rotates to 22.5 degree clockwise from the previous image in ascending order.
Therefore the paintComponent() is essentially looping to change the images shown from
image0 to image15 to appear rotating. Once the image has reached kartRedImage15 or
kartBlueImage15, it restarts at kartRedImage0 or kartBlueImage15 with the help of the
modulus, “%” operator.
Several Screenshots of Kart Rotation
Figure 1: Kart Rotating (1)
Figure 2: Kart Rotating (2)
Figure 3: Kart Rotating (3)
Figure 4: Kart Rotating (4)
Figure 5: Kart Rotating (5)
Figure 6: Kart Rotating (6)
3
SID XXXXXXX
Kart Design Rationale
The following figures are images of the Red Kart and the Blue Kart facing upwards:
Figure 7: General Red Kart Design
Figure 8: General Blue Kart Design
As a simple method of distinguishing between both player’s karts, the karts are easily
identifiable by its unique colour schemes. Based on Table XXX, the kart remains the same size
within the 50x50 pixel limit throughout rotation with slight resolution changes. The rotation
movements are also accurately changing in the required 22.5° going down the index while
maintaining the transparent backgrounds of image as the image is in .png form. The design in
made to look aerodynamic to theoretically provide an aerodynamic force when it moves
towards a streamline of air. The kart wheels are designed to appear lower and further away
from the kart chassis for it to be stable while appearing to lower its centre of gravity. The rest
of the difference in design are mainly for aesthetic purposes while remaining integrity to
common race kart designs.
4
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Based on the example program written by Deitel & Deitel, a kart rotation program was made with some small modifications. As shown by the
code snippet above, imageName String is initialized as null to be used to change between the image and folder names. The images are stored in
folders based on their kart style such as kartRedImages and kartBlueImages. Therefore, the imageName is used to find the path of files (.png).
5
SID XXXXXXX
Table 1: Part 1 Kart Images
Index Angle of Rotation
0
kartRed<Index>
0°
Note: Comes after
Index 15
1
22.5°
2
45°
3
67.5°
4
90°
5
112.5°
6
135°
7
157.5°
8
180°
6
kartBlue<Index>
SID XXXXXXX
9
202.5°
10
225°
11
247.5°
12
270°
13
292.5°
14
315°
15
337.5°
Note: Restarts from
Index 0
Note: Due to the pixel limitations of image (50 x 50 pixels), images in certain angle rotations
will appear blurrier than the rest. Images of karts facing 0°, 90°, 180°, and 270° are the only
ones that will appear the clearest.
7
SID XXXXXXX
Part 2: Racetrack Development
General Racetrack Development
To satisfy the requirements of Part 2, a JFrame is used for the whole game while 1 JPanel is
used to display the both the karts, the map and every other detail to the JFrame. The keys used
for Player 1 are up, down, left, right, “P”, “M”, and enter key. For Player 2, the keys used are
“W”, “A”, “S”, “D”, and “Q”. The keys are managed by KeyListener and KeyEvents. To ease
the explanation of the keys used, the keys used, and its functions are tabulated below:
Table 2: Table of User Key Controls
Function
Player Key
Increases kart speed by 10, with a cap of 100
1
UP
2
W
1
LEFT
2
A
1
DOWN
2
S
1
RIGHT
2
D
1
P
2
Q
Changes map style
1
M
Starts the game
1
ENTER
Rotates kart anticlockwise
Reduces kart speed by 10, with a minimum of 0
Rotates kart clockwise
Changes kart style (skin)
8
SID XXXXXXX
Additional Game Enhancements
Aside from the basic game requirements for Part 2, some additional details has been added to
improve the immersion of this multiplayer game. As an overview, the enhancements added are
track enhancements, kart enhancements, collision strategy, sound effects. interactive main
menu and a rematch option. The rationale and the code will be elaborated in separate sections.
Track Enhancements
The track enhancements done is the changes of colour theme to the map with an addition of 1
extra map for selection. This is added to make the game more versatile while being interactive
for user enjoyment. Player 1 can toggle the “M” button to switch the maps. Only 1 player is set
to choose to prevent a scenario in which both players have opposing selections which in this
case would be Player 1. During toggling of map selection, there will be a thumbnail of map
being shown on the top right corner along with a dimmed change of map shown behind the
game setting. Critically, this addition can be also improved with more choices of maps and
allowing both players to choose the maps together during the selection stage.
Figure 9: Map 1 Thumbnail and Dimmed Preview
9
SID XXXXXXX
Figure 10: Map 1
10
SID XXXXXXX
Figure 11: Map 2 Thumbnail and Dimmed Preview
11
SID XXXXXXX
Figure 12: Map 2
12
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Only Player 1 can toggle between the maps and depending on the selected map, the specified thumbnailMaps[index] image of the map will be
previewed on the upper right corner.
13
SID XXXXXXX
Kart Enhancements
There are two kart enhancements done which are the use of transparent background for images
(.png) to depict karts more realistically and the addition of kart styles for each player. Now,
each player can choose between 2 types of karts respectively to use during the race. This aims
to improve user experience as it is giving users a sense of control when choosing a kart of their
liking. Although this improvement only gives users up to 2 karts of choice, but it still can be
enhanced by increase the variety of kart styles and skins.
14
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 13: Part 2: Switching Kart Skins
For the game settings layout, Graphics g has been used in the paintComponent() to draw prompt for user to toggle specific keys to change their
kart style. The imagesR[0] and imagesG[0] here are the preview of the kart selections of the Red kart and Green kart options. Depending on which
is the current toggled selection (default or alternate style), a rectangle will be drawn around the selected kart design to simply inform user of their
current kart selection. This applies for Player 2’s kart skins selections too.
15
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 14: Part 2: Kart Skin Display
During each repaint of both in and out of the game setting, there will be an if statement verifying the player’s kart skin of choosing. Depending
on which skin is chosen is what image will be drawn using the graphics and passing the coordinates of the kart’s location.
16
SID XXXXXXX
Collision Strategy
Several collision strategies have been implemented for the simulation of a go kart race. Firstly,
the collision strategy is that during a collision outside of the racetrack, the kart will only move
1 position based on the user control. This is so that there will not be a continuous flow of
movement while the player’s kart is out of the racetrack making it difficult for them to move.
This occurs when the player is moving in the central area and the outer area. This enhancement
has been added to depict the impact of crashing a kart and friction in movements and notify
users that they are moving towards the wrong direction.
Additionally, a collision between two karts (Player 1 and Player 2) will result in the end of a
match redirecting them to call for a rematch to play again. When a kart hits another kart (when
they are within 30 coordinate x or y or each other), the game ends notifying both players that
they have crashed each other. This has been added to instantly end the game when a crash
occurs as a game design feature in accordance with Part 2.
Below is the relevant code to for this enhancement:
17
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 15: Part 2: Collision Strategy
If the kart is located in the outer area, their speed will reduce to 0 and the kartInOutter Boolean will be true that will be used to cue a sound
effect of being on the outer. This also applies for being on the grass too for both the karts.
18
SID XXXXXXX
Sound Effects
The sound effects implemented here are royalty free sound effects available online by Adobe
Audition Sound Effects for download. To simulate a gamified experience a background music
theme has been added to loop throughout the game continuously. In general, the background
music is added to create a set atmosphere (indie/arcade-themed) of the high pacing game
throughout the game for it to seem immersive. Furthermore, sound effects are also added for
the following scenarios:
•
kart crash - amplify the impact of crash
•
kart moving on central area - to let the player know of the friction during a movement
on the central area.
•
kart moving on outer area – to let the player know of the friction during a movement
on the outer area.
•
kart speeds up – to simulate revving of engine when a kart picks up their pace
•
kart swerves (rotates) – to simulate the noise of wheels swerving during a turn
Below is the relevant code to for this enhancement:
19
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 16: Part 2: BGM
A while(true) loop of a thread will be used to loop the game’s background theme.
20
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 17: Part 2: SFX
Depending on if the kart meets the condition of if statements, certain sound effects will be played in a thread.
21
SID XXXXXXX
Interactive Main Menu and Rematch Option
The Interactive Main Menu is to help in user experience to displays game title, displays short
and simple instructions as a player guide, map number and thumbnail, kart options and current
kart selection. This is to inform users of the game controls conveniently before the start of a
game. Additionally, there is also a choice for a rematch after a game end to allow users to
replay the game with the same opponent players and return to the main menu page (for them
to optionally change their kart style or map).
As the Interactive Main Menu does not have much logic to explain, only the rematch code will
be shown below.
22
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 18: Part 2: Rematching
If the “R” key is pressed for a rematch, the condition of the game will be reset.
23
SID XXXXXXX
Part 3: Server-Clients Implementation
TCP protocol was chosen as the transport layer protocol for this multiplayer program. This is
because albeit it being slow, it ensures that all packets are successfully sent to their recipient
ensuring this collaborative game to remain synchronized throughout the whole game. The
application protocol used here is a protocol created for this game called Red-Blue Kart Racing
Protocol (RBKRP). This protocol enables players to indirectly run commands to notify the
other player of the change in their game movements. Protocol of RBKRP:
<value>:<command type>#Player <receiver player number>
Below is a table summarizing the commands that can be run by a player.
Table 3: Table of Protocols
Commands by sender
Command Type
Player 1
Player 2
<value>:R#Player 2
-
R for Round
<value>:KS#Player 2
<value>:KS#Player 1
KS for Kart Skin
<value>:M#Player 2
-
M for Map
<value>:D#Player 2
<value>:D#Player 1
D for Direction
<value>:S#Player 2
<value>:S#Player 1
S for Speed
<value>:X#Player 2
<value>:X#Player 1
X for X-coordinate
<value>:Y#Player 2
<value>:Y#Player 1
Y for Y-coordinate
To relay the information back and forth, DataInputStream and DataOutputStream has been
used. As a mean of connection, a Socket for client and ServerSocket listening on port 80 has
been used.
24
SID XXXXXXX
There is also auto sorting for client connections. If there are not clients connected yet, the first
connected client will be Player 1. If there are already any connected clients, the next client to
connect into the server will be connected as the other player. This is so that there will not be
two of the same player type connected into the server.
Moreover, unlimited connections in and out of the server without restarting server is possible
with client with a cap of two slots of clients at a time into the server. This is to ensure the game
will still run even after a disconnection and reconnection of players given that there are two
players connected. If a player is disconnected, the other player will be notified to prompt them
to wait for another player to connect before starting another round of game.
The following image is what shows up on the console of TCPserver.java when it is ran. As
there are two server thread running, the server first prints its current active connections. Since
the server just started, the slots will all be empty with zero active players while the server waits
for more connections.
Figure 19: New Server Console
When a client successfully connects into the server, the updated active connections are
printed on the server console.
Figure 20: Server Waiting For Players
25
SID XXXXXXX
Client Connection
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 21: Part 3: Client Connecting to Server
To connect into the server, the client Socket will accept the ServerSocket that listens into the same port. Then a DataInputStream and
DataOutputStream is initialized and the thread in use will state that it is creating a new ClientHandler while stating the thread number.
26
SID XXXXXXX
Setting Player Type
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 22: Part 3: Player Number Arrangement
The “playerNumber” here is an Integer array that has 2 elements that stores the active player number. However, by default, both the 2 elements
in the array are “0” to represent that there are no active players in the slots. The code snippet shown here is if there are no Player 1 and Player 2
connected in yet, then the first player connected into the server will automatically be set as Player 1. Then, a ClientHandler will be passed the
client socket, the player number, a DataInputStream and a DataOutputStream. The created ClientHandler will then be stored in a vector called
“ar”.
27
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 23: Part 3: Player Number Arrangement
Else, if there is already a Player 1 connected, then there will be a for loop to loop through the empty slots to find the index of the empty slot.
Then, the Player 2 will be set into the empty slot. Then this player is passed into the ClientHandler which is finally added into the ClientHandler
list, ar. A similar “else if” statement is done to connect in Player 1 if there is already Player 1 connected.
28
SID XXXXXXX
Thread Creation for ClientHandler
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 24: Part 3: Thread to Start New ClientHandler
A new thread will then run the ClientHandler and the total number of active players will be updated.
First Client Connection
29
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 25: Part 3: First Client Connection Messages
This occurs after player is newly connected into the server. For all the ClientHandlers in the ClientHandler List, if the client is the current player
connecting in, they will be passed their own player number while the opponent will be informed of the new player joining the game. Moreover,
the server will also print the arrival of the new player.
Protocol In Reading and Writing UTF
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 26: Part 3: Protocol Initialization
The above code is how local kart values are initialized into a string in the protocol format for it to be sent out in a DataOutputString. The
protocol for gameSetting here is <gameSetting value> + “:R#Player 2”. Another example shown here is for localDirection in a similar protocol
syntax. This syntax is used for all the values passed to the other client through the server using DataOutputString.
30
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 27: Part 3: DataOutputStream.writeUTF(UTF)
To pass the value to the server, the DataOutputString function of writeUTF(UTF). DataOutputString here is initialized as “dos”. So, if the game
has started, the player will begin to send kart updates of their local kart’s information such as the direction, speed and coordinates. Therefore, it
is written as “dos.writeUTF(<kart information>);”.
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
31
SID XXXXXXX
Figure 28: Part 3: DataInputStream.readUTF()
The received message from the server will first be initialized into a String as msg using DataInputStream function of readUTF(). If the message
sent was not directly from the opponent player, then the message will be displayed printed to the client’s console. This is because this is a
message directly from the server likely from updates regarding the connection status of the other player. Else, there will be a StringTokenizer to
split the value from the rest of the protocol. The value will be used to update the opponent’s kart details accordingly if it has changed.
32
SID XXXXXXX
Player Leaving and New Thread
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 29: Part 3: Clearing Leaving Player Data
When a player leaves, the thread will clear all data of the player before dying. This includes closing the DataInputStream and DataOutputStream
and looping through the playerNum slot number and ClientHandler list to find which player it is and clearing all of its data.
33
SID XXXXXXX
CODE SNIPPET REMOVED FOR CONFIDENTIALITY
Figure 30: Part 3: New Thread for Incoming Players
Finally, before the thread dies, the thread will create a new server object passing the dying thread number and creating a new thread to start the
server object again to wait for more players to join the gam
34
SID XXXXXXX
Critical Self-Evaluation
Overall, the final product that was produced up to Part 3 was satisfactory based on the
implementation that was managed to include as there has been implementations of almost all
the ideas of enhancements in mind. The following are future work and further enhancements
that can be implemented:
•
Increase the options of map and kart designs
•
Allow both players to select maps (while previewing the other’s choice of map) and
proceed only if both players chose the same map as a mean of communication
•
Allow both players to start the game given that both players are ready
•
Improve the User Interface to have more graphical representation
35
SID XXXXXXX
References
Deitel, P.J., Deitel, H.M., Mukherjee, S. and Bhattacharjee, A.K., 2012. Java : how to program.
9th ed., International ed. / contributions by Soumen Mukherjee, Arup Kumar
Bhattacharjee. ed. Boston, [Mass.] ;: Prentice Hall.
Docs.oracle.com. n.d. InetAddress (Java Platform SE 7 ). [online] Available at:
<https://docs.oracle.com/javase/7/docs/api/java/net/InetAddress.html> [Accessed 8
April 2022].
GeeksforGeeks. 2017. Multi-threaded Chat Application in Java | Set 2 (Client Side
Programming) - GeeksforGeeks. [online] Available at:
<https://www.geeksforgeeks.org/multi-threaded-chat-application-set-2/?ref=lbp>
[Accessed 8 April 2022].
GeeksforGeeks. 2021. Multi-threaded chat Application in Java | Set 1 (Server Side
Programming) - GeeksforGeeks. [online] Available at:
<https://www.geeksforgeeks.org/multi-threaded-chat-application-set-1/?ref=lbp>
[Accessed 8 April 2022].
Klensin, J., 2008. RFC 5321 - Simple Mail Transfer Protocol. [online] Datatracker.ietf.org.
Available at: <https://datatracker.ietf.org/doc/html/rfc5321> [Accessed 8 April 2022].
36
SID XXXXXXX
Appendices
Simple RFC for Red-Blue Kart Racing Protocol (RBKRP)
DETAIL PROTOCOL SPECIFICATION IS
REMOVED FOR CONFIDENTIALITY
37