Html5 games: novice to ninja

Intro
 HTML5 Games: Novice to Ninja
 Notice of Rights
 Notice of Liability
 Trademark Notice
 About Earle Castledine
 About SitePoint
 Table of Contents
 Preface
 Who Should Read This Book?
 Acknowledgments
 Conventions Used
 Code Samples
 Tips, Notes, and Warnings
 Hey, You!
 Ahem, Excuse Me ...
 Make Sure You Always ...
 Watch Out!
 Supplementary Materials
 Press Space to Start
 
 This Might Seem Strange to You
 Game Design
 A Brief History
 Games and JavaScript
 Strengths of JavaScript
 Limitations of JavaScript
 Bringing Static Typing to JavaScript
 The Future of HTML5 Games
 Enough Talk Make GamesThese Are Just Guidelines
 Modules
 Making Art
 Rasterizing
 Copyright
 Build Tools and Workflow
 Bypassing Budo
 Version Control Systems
 Valuable Time Spent
 Staying Motivated
 Get Ready!
 Drawing Things
 
 Don Get Pigeonholed
 DOM vs Canvas vs WebGL
 Plain O
 DOM
 Finding DOM Elements
 Why Not DOM?
 Canvas API
 Using the Console
 Using the Context
 Drawing Some Shapes
 Skim the Following if You are Super Impatient
 Degrees vs Radians
 Images
 Transformations
 HSL
 Blending and Alpha
 Performance Considerations
 Game Engines vs Reinventing the Wheel Game Libraries and EnginesGodot
 Quick, Draw
 Game Loops & User Input
 
 The Loop
 The Loop Exists
 The Old-school Way
 Looping with HTML5
 Commit This Loop to Memory
 An Even More Accurate Loop
 Tiny Movement
 Switch Tabs
 User Input
 Keyboard Input
 Structuring the Code, or Not?
 Game Genre Doesn't Really Matter
 Mouse Controls
 Why are we doing this every frame?
 Creating Your Game Library
 When to Add Things to Your Library
 Our Game Architecture Idea
 One Approach of Many
 Variable Names
 Returning the Same Item
 The Renderer
 Following Canvas's Conventions
 Thinking Beyond Canvas Font BaselineBonus Renderer Features
 Adding the Loop
 The update Method
 Game Entities
 Adding Some Action
 A Space Shoot-em-up
 Setting Up the Game
 A Controllable Player
 Moving Things
 A Player That Shoots
 Playing Fast and Loose, for Now
 Removing Entities
 Optimization
 The Bad Guys Strike Back
 A Neat Randomization Trick
 Collisions at Last!
 Imperfect Collisions
 Game Over
 Animation, Levels, Maps, Camerasâ#x80
 Œ
 
 An Unexpected Proposition
 De-boilerplating Our Prototypes
 Starting a New Game
 Skip Ahead if You are Impatient
 A Little Help with the Children Sprites with Zing!Affine Transitions
 Sprite Translation
 Scaling Sprites
 Creating and Adding to the Scene in One line
 Math Helper Functions
 Zero-based Random Numbers
 Anchor Points
 Sprite Rotation
 An Unexpected Assignment
 Sprite Sheets & Animation
 Sprite Sheets
 Where to Get Sprite Sheets
 Creating the TileSprite
 Why is it called a sprite?
 Different Sprite Sheet Formatting
 Cell-based Animation: the Easy Way
 Using Remainder
 Cell-based Animation: A More Powerful Way
 You Can Use This Mechanism Everywhere
 Adjusting the Anchor Point
 The Animation Manager
 Tile Maps