Time for action – building the draw-and-guess game

We will implement the game flow of the draw-and-guess game as follows:

1. First, we will add the game logic on the client side.
2. Open the index.html file in the client directory. Add the following restart button right after the send button:

   <input type="button" value="Restart" id="restart">

3. Open the html5games.websocket.js JavaScript.
4. 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,
   

5. 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,

6. When the client receives a message from the server, it parses it and checks whether it is a chat message or a line drawing...