Book Image

HTML5 Game Development by Example: Beginner's Guide

By : Seng Hin Mak
Book Image

HTML5 Game Development by Example: Beginner's Guide

By: Seng Hin Mak

Overview of this book

Table of Contents (18 chapters)
HTML5 Game Development by Example Beginner's Guide Second Edition
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
9
Building a Physics Car Game with Box2D and Canvas
Index

Chapter 8. Building a Multiplayer Draw-and-Guess Game with WebSockets

We built several local single-player games in the previous chapters. In this chapter, we will build a multiplayer game with the help of WebSockets. WebSockets enable us to create event-based server-client architecture. The messages are passed between all connected browsers instantly. We will combine the Canvas drawing, JSON data packing, and several techniques learned in the previous chapters to build the draw-and-guess game.

In this chapter, we will learn the following topics:

  • Trying an existing multiuser sketchpad that shows drawings from different connected users through WebSockets

  • Installing a WebSocket server that is implemented by node.js

  • Connecting the server from a browser

  • Creating an instant chat room with the WebSocket API

  • Creating a multiuser drawing pad in the Canvas

  • Building a draw-and-guess game by integrating the chat room and drawing with game logic

The following screenshot shows the draw-and-guess game that...