Book Image

HTML5 Games Development by Example: Beginner's Guide

By : Makzan
Book Image

HTML5 Games Development by Example: Beginner's Guide

By: Makzan

Overview of this book

<p>HTML5 promises to be the hot new platform for online games. HTML5 games work on computers, smartphones, and tablets – including iPhones and iPads. Be one of the first developers to build HTML5 games today and be ready for tomorrow!</p> <p>The book will show you how to use latest HTML5 and CSS3 web standards to build card games, drawing games, physics games and even multiplayer games over the network. With the book you will build 6 example games with clear step-by-step tutorials.</p> <p>HTML5, CSS3 and related JavaScript API is the latest hot topic in Web. These standards bring us the new game market, HTML5 Games. With the new power from them, we can design games with HTML5 elements, CSS3 properties and JavaScript to play in browsers.</p> <p>The book divides into 9 chapters with each one focusing on one topic. We will create 6 games in the book and specifically learn how we draw game objects, animate them, adding audio, connecting players and building physics game with Box2D physics engine.</p>
Table of Contents (16 chapters)
HTML5 Games Development by Example
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface

Summary


We learned a lot in this chapter about drawing shapes and creating interaction with the new HTML5 canvas element and the drawing API.

Specifically, we covered:

  • Drawing different paths and shapes in canvas, including circles, arcs, and lines.

  • Adding mouse events and interaction with the drawn paths in the canvas.

  • Dragging drawn paths in the canvas.

  • Checking line intersection with the help of mathematics formulas.

  • Creating an untangle puzzle game in which players need to drag the circles so the connecting lines are not intersected by each other.

Now that we've learned about basic drawing functions in the canvas and drawing API, use them to create a puzzle solving game in canvas. We're ready to learn some advanced drawing techniques in canvas. In the next chapter, we will enhance our untangle puzzle game with more canvas drawing APIs, such as drawing text, drawing images, and drawing gradients.