We will implement the game flow of the draw-and-guess game as follows:
First, we will add the game logic on the client side.
Open the
index.htmlfile in the client directory. Add the following restart button right after the send button:<input type="button" value="Restart" id="restart">
Open the
html5games.websocket.jsJavaScript.We need a few more constants to determine different states during the game play. Add the following highlighted code to the top of the file:
// Constants LINE_SEGMENT : 0, CHAT_MESSAGE : 1, GAME_LOGIC : 2, // Constant for game logic state WAITING_TO_START : 0, GAME_START : 1, GAME_OVER : 2, GAME_RESTART : 3,
In addition, we want a flag to indicate this player is in charge of drawing. Add the following Boolean global variable to the code:
isTurnToDraw : false,
When the client receives a message from the server, it parses it and checks whether it is a chat message or a line drawing. We have another type of message...