Contents
1.2. HTML5 Game Development Best Practices
1.4. Snail Bait’s HTML and CSS
1.5. Snail Bait’s Humble Beginning
1.6. The Use of JavaScript in This Book
Chapter 2. Raw Materials and Development Environment
2.5. Shortening the Coding Cycle
Chapter 3. Graphics and Animation
3.1. Drawing Graphics and Images with the HTML5 canvas Element
3.2. Implementing Smooth HTML5 Animations
3.6. Creating Time-Based Motion
3.7. Reversing Scroll Direction
3.9. Using Parallax to Create the Illusion of Depth
4.1. Encapsulate Game Functions in a JavaScript Object
4.2. Understand JavaScript’s Persnickety this Reference
4.4. Pause or Resume the Game When the Player Presses the p Key
4.5. Freeze the Game to Ensure It Resumes Exactly Where It Left Off
4.6. Pause the Game When the Window Loses Focus
4.7. Resume a Paused Game with an Animated Countdown
5.1. Define Snail Bait’s Chrome
5.2. Fade Elements In and Out with CSS Transitions
5.3. Fade Any Element In or Out That Has a CSS Transition Associated with Its Opacity
5.4. Implement the Loading Screen
6.2. Incorporate Sprites into a Game Loop
6.4. Create and Initialize a Game’s Sprites
6.5. Define Sprites with Metadata
7.3. The Runner’s Run Behavior
7.5. Game-Independent Behaviors
Chapter 8. Time, Part I: Finite Behaviors and Linear Motion
8.1. Implement an Initial Jump Algorithm
8.2. Shift Responsibility for Jumping to the Runner
8.3. Implement the Jump Behavior
8.4. Time Animations with Stopwatches
Chapter 9. Time, Part II: Nonlinear Motion
9.1. Understand Time and Its Derivatives
9.2. Use Animation Timers and Easing Functions to Implement Nonlinear Jumping
9.3. Implement Animation Timers
9.4. Implement Easing Functions
9.5. Fine-tune Easing Functions
9.6. Implement a Realistic Bounce Behavior
9.8. Implement Nonlinear Color Changes with Animation Timers and Easing Functions
10.1. Snail Bait’s Time System
10.2. Create and Start the Time System
10.3. Incorporate the Time System into Snail Bait
10.4. Redefine the Current Time for Stopwatches and Animation Timers
10.5. Implement the Time System
Chapter 11. Collision Detection
11.1. The Collision Detection Process
11.2. Collision Detection Techniques
11.3. Snail Bait’s Collision Detection
11.4. Select Candidates for Collision Detection
11.5. Detect Collisions Between the Runner and Another Sprite
11.7. Optimize Collision Detection
11.8. Monitor Collision Detection Performance
11.9. Implement Collision Detection Edge Cases
12.3. Collision Detection, Redux
Chapter 13. Sprite Animations and Special Effects
13.1. Implement Sprite Animations
14.1. Create Sound and Music Files
14.2. Load Music and Sound Effects
14.3. Specify Sound and Music Controls
15.1. Run Snail Bait on Mobile Devices
15.3. Scale Games to Fit Mobile Devices
15.4. Change Instructions Underneath the Game’s Canvas
15.5. Change the Welcome Screen
15.6. Incorporate Touch Events
15.7. Work Around Sound Idiosyncracies on Mobile Devices
15.8. Add an Icon to the Home Screen and Run Without Browser Chrome
17.5. Warn Players When the Game Runs Slowly
17.6. Implement a Winning Animation
Chapter 18. Developer Backdoor
18.1. Snail Bait’s Developer Backdoor
18.2. The Developer Backdoor’s HTML and CSS
18.3. Reveal and Hide the Developer Backdoor
18.4. Update the Developer Backdoor’s Elements
18.5. Implement the Developer Backdoor’s Checkboxes
18.6. Incorporate the Developer Backdoor Sliders
18.7. Implement the Backdoor’s Ruler
Chapter 19. On the Server: In-game Metrics, High Scores, and Deployment
19.2. Include socket.io’s JavaScript in Snail Bait
19.3. Implement a Simple Server
19.4. Create a Socket on the Server
19.6. Create a Socket on the Client and Connect to the Server
19.10. Upload files to a Server
Chapter 20. Epilogue: Bodega’s Revenge
20.1. Design the User Interface
20.5. Implement Sprite Behaviors