The Advanced Game Developer’s Toolkit: Create Amazing Web-based Games with JavaScript and HTML5

298 Pages·2017·4.33 MB·English

by  Rex van der Spuy [Rex van der Spuy]

Rex van der Spuy
The Advanced Game Developer’s
Toolkit
Create Amazing Web-based Games with
JavaScript and HTML5
Rex van der Spuy Toronto, Ontario, Canada
Any source code or other supplementary material referenced
by the author in this book is available to readers on GitHub via
the book's product page, located at
www.apress.com/9781484210987 . For more detailed
information, please visit
http://www.apress.com/source-code .
ISBN 978-1-48421098-7
e-ISBN 978-1-4842-1097-0
DOI 10.1007/978-1-4842-1097-0
Library of Congress Control Number: 2017945373
© Rex van der Spuy 2017
This work is subject to copyright. All rights are reserved by
the Publisher, whether the whole or part of the material is
concerned, specifically the rights of translation, reprinting,
reuse of illustrations, recitation, broadcasting, reproduction on
microfilms or in any other physical way, and transmission or
information storage and retrieval, electronic adaptation,
computer software, or by similar or dissimilar methodology
now known or hereafter developed.
Trademarked names, logos, and images may appear in this
book. Rather than use a trademark symbol with every
occurrence of a trademarked name, logo, or image we use the
names, logos, and images only in an editorial fashion and to
the benefit of the trademark owner, with no intention of
infringement of the trademark. The use in this publication of
trade names, trademarks, service marks, and similar terms,
even if they are not identified as such, is not to be taken as an
expression of opinion as to whether or not they are subject to
proprietary rights.
While the advice and information in this book are believed to
be true and accurate at the date of publication, neither the
authors nor the editors nor the publisher can accept any legal
responsibility for any errors or omissions that may be made.
The publisher makes no warranty, express or implied, with
respect to the material contained herein.
Printed on acid-free paper Distributed to the book trade
worldwide by Springer Science+Business Media New York,
233 Spring Street, 6th Floor, New York, NY 10013. Phone 1-
800-SPRINGER, fax [phone], e-mail orders-
[email protected], or visit www.springeronline.com.
Apress Media, LLC is a California LLC and the sole member
(owner) is Springer Science + Business Media Finance Inc
(SSBM Finance Inc). SSBM Finance Inc is a Delaware
corporation.
Acknowledgments
In Chapters 2 and 3 , the walking elf character was based on
graphics designed by Wulax (opengameart.org/content/lpc-
medieval-fantasy-character-sprites), and forest background
graphics were based on tiles designed by Leonard Pabin
(opengameart.org/content/whispers-of-avalon-grassland-
tileset).
The heart, skull, and marmot graphics were designed by
Matt Hackett (
https://opengameart.org/users/richtaur ) and
score a perfect 5/5 Tigherhats. Go Lost Decade Games!
http://www.lostdecadegames.com .
The isometric cubes in Chapter 4 were by author
GameArtForge (
https://opengameart.org/content/isometric-
cubes-set-01 ).
Contents
1. Chapter 1: Getting Started
1. What You Need to Know
1. Hexi and Ga
2. The Source Code
2. Chapter 2: Using Tiled Editor
1. Choosing Your Images
2. Making a Map
3. Setting Images Properties
4. Using Layers
5. Building the Map
6. Understanding the JSON Map Data
7. Using JSON Data to Build the Level
1. Deciding How to Use the Data
2. The Game Code API
8. Writing the makeTiledWorld Function
9. Creating the Game World
1. Creating the Sprites
2. Changing the Sprite’s Depth Layer
10. A Scrolling World Camera
11. Summary
3. Chapter 3: Tile-Based Collision
1. Understanding Tile-Based Collision
2. Collecting Items
1. Designing the Game World
2. Initializing the Game World
3. Understanding the Bomb Map
4. Moving the Alien in Alignment with the Grid
5. Collisions with Moving Sprites
6. Checking Collisions by Comparing Array Locations
7. Giving the Bombs a Random Direction
8. Collision Detection
3. Using Corner Points
1. A Reusable Tile-Based Collision Function
4. Using Inverse Collision Detection to Check for Obstacles
5. Tile-Based Collision for Role Playing Games
1. Defining the Collision Area
6. Collisions with Obstacles
1. Collisions with Items
7. Summary
4. Chapter 4: Isometric Maps
1. Isometric Basics
1. Making a Cartesian Tile Map
2. Making an Isometric Tile Map
2. Working with Isometric Properties
3. Moving Around an Isometric World
4. Isometric Collision Detection
5. Depth Layering
1. Sorting a Sprite by Its z Property Value
2. Layering 3D Isometric Sprites
3. Updating Depths
6. Making Isometric Maps with Tiled Editor
1. Configuring and Building the Map
2. The makeIsoTiledWorld Function
3. Building the Game World
7. Summary
5. Chapter 5: Pathfinding Basics
1. Random Movement Through a Maze
1. Direction and Speed
2. Moving the Sprite in the Game Loop
3. Is the Sprite Centered Over a Tile Cell?
4. Finding the Valid Directions
2. Hunting the Alien
1. Calculating the Vector
2. Finding the Closest Direction
3. Line of Sight
1. Calculating the Vector
2. Finding the Positions of the Collision Points
3. Testing the Points for Collisions with Obstacles
4. The lineOfSight Function
4. Tile-Based Line of Sight
1. Tile-Based Collision
2. Limiting the Angle
3. The tileBasedLineOfSight Function
5. Summary
6. Chapter 6: Finding the Shortest Path
1. Understanding A*
1. Calculating Costs
2. Finding the Second Step
3. Linking the Nodes Through Their Parents
2. A* in Code
1. Creating a Node Map
2. The shortestPath Function
3. Using the shortestPath Function
3. Understanding Heuristics
4. Rounding Corners
5. Walking the Path
6. Extending and Customizing A*
1. Variable Terrain
2. Influence Map
3. Dijkstra’s Algorithm
7. Summary
7. Chapter 7: More Fun with Tile-Based Games
1. Using Extra Game Data for AI Systems
1. Storing Hidden Game Data in Arrays
2. Adding an AI Controlled Car
2. Broadphase and Narrowphase Collision
1. The Spatial Grid
2. Implementing a Spatial Grid
3. Coding the Spatial Grid
4. Other Broadphase Collision Strategies
3. Summary
8. Index