| INTRODUCTION xxiii PART I: DIVING IN CHAPTER 1: FLYING BEFORE YOU WALK 3 Introduction 3 Building a Complete Game in 500 Lines 4 Understanding the Game 4 Structuring the Game 4 The Final Game 5 Adding the Boilerplate HTML and CSS 5 Getting Started with Canvas 6 Accessing the Context 6 Drawing on Canvas 7 Drawing Images 8 Creating Your Game's Structure 9 Building Object-Oriented JavaScript 10 Taking Advantage of Duck Typing 10 Creating the Three Principle Objects 11 Loading the SpriteSheet 11 Creating the Game Object 13 Implementing the Game Object 13 Refactoring the Game Code 15 Adding a Scrolling Background 16 Putting in a Title Screen 19 Drawing Text on Canvas 19 Adding a Protagonist 21 Creating the PlayerShip Object 22 Handling User Input 22 Summary 23 CHAPTER 2: MAKING IT A GAME 25 Introduction 25 Creating the GameBoard Object 25 Understanding the GameBoard 26 Adding and Removing Objects 26 Iterating over the List of Objects 27 Defi ning the Board Methods 28 Handling Collisions 29 Adding GameBoard into the Game 30 Firing Missiles 30 Adding a Bullet Sprite 31 Connecting Missiles to the Player 32 Adding Enemies 33 Calculating Enemy Movement 33 Constructing the Enemy Object 34 Stepping and Drawing the Enemy Object 35 Adding Enemies on the Board 36 Refactoring the Sprite Classes 37 Creating a Generic Sprite Class 37 Refactoring PlayerShip 38 Refactoring PlayerMissile 39 Refactoring Enemy 39 Handling Collisions 40 Adding Object Types 40 Colliding Missiles with Enemies 41 Colliding Enemies with the Player 42 Making It Go Boom 43 Representing Levels 44 Setting Up the Enemies 44 Setting Up Level Data 45 Loading and Finishing a Level 46 Implementing the Level Object 47 Summary 49 CHAPTER 3: FINISHING UP AND GOING MOBILE 51 Introduction 51 Adding Touch Controls 51 Drawing Controls 52 Responding to Touch Events 54 Testing on Mobile 56 Maximizing the Game 57 Setting the Viewport 57 Resizing the Canvas 57 Adding to the iOS Home Screen 60 Adding a Score 60 Making It a Fair Fight 61 Summary 64 PART II: MOBILE HTML5 CHAPTER 4: HTML5 FOR MOBILE 67 Introduction 67 Capturing a Brief History of HTML5 68 Understanding How HTML5 Grew Up "Diff erent" 68 Looking Toward HTML6? HTML7? Nope, Just HTML5 68 Going to the Spec 69 Diff erentiating the HTML5 Family and HTML5 69 Using HTML5 The Right Way 70 Having Your Cake and Eating It, Too 70 Sniffi ng Browsers 70 Determining Capabilities, Not Browsers 72 Enhancing Progressively 73 Polyfi lling in the Gaps 74 Considering HTML5 from a Game Perspective 74 Canvas 74 CSS3/DOM 75 SVG 76 Considering HTML5 from a Mobile Perspective 76 Understanding the New APIs 77 What's Coming: WebAPI 77 Surveying the Mobile Browser Landscape 77 WebKit: The Market Dominator 78 Opera: Still Plugging Along 78 Firefox: Mozilla's Mobile Off ering 79 WP7 Internet Explorer 9 79 Tablets 79 Summary 79 CHAPTER 5: LEARNING SOME HELPFUL LIBRARIES 81 Introduction 81 Learning JavaScript Libraries 82 Starting with jQuery 82 Adding jQuery to Your Page 82 Understanding the $ 83 Manipulating the DOM 84 Creating Callbacks 85 Binding Events 87 Making Ajax Calls 90 Calling Remote Servers 90 Using Deferreds 91 Using Underscore.js 92 Accessing Underscore 92 Working with Collections 92 Using Utility Functions 93 Chaining Underscore Method Calls 94 Summary 94 CHAPTER 6: BEING A GOOD MOBILE CITIZEN 95 Introduction 95 Responding to Device Capabilities 96 Maximizing Real Estate 96 Resizing Canvas to Fit 97 Dealing with Browser Resizing, Scrolling, and Zooming 98 Handling Resizing 98 Preventing Scrolling and Zooming 99 Setting the Viewport 100 Removing the Address Bar 101 Confi guring Your App for the iOS Home Screen 103 Making Your Game Web App Capable 103 Adding a Startup Image 103 Confi guring Home Icons 104 Taking Mobile Performance into Consideration 105 Adapting to Limited Bandwidth and Storage 106 Optimizing for Mobile 106 Good for Mobile Is Good for All 106 Minifying Your JavaScript 107 Setting Correct Headers 108 Serving from a CDN 108 Going Offl ine Completely with Application Cache 109 Creating Your Manifest File 109 Checking If the Browser Is Online 111 Listening for More Advanced Behavior 111 A Final Word of Warning 111 Summary 112 PART III: JAVASCRIPT GAME DEV BASICS CHAPTER 7: LEARNING ABOUT YOUR HTML5 GAME DEVELOPMENT ENVIRONMENT 115 Introduction 115 Picking an Editor 116 Exploring the Chrome Developer Tools 116 Activating Developer Tools 116 Inspecting Elements 116 Viewing Page Resources 118 Tracking Network Traffi c 119 Debugging JavaScript 121 Examining the Console Tab 121 Exercising the Script Tab 123 Profi ling and Optimizing Your Code 125 Running Profi les 126 Actually Optimizing Your Game 128 Mobile Debugging 129 Summary 131 CHAPTER 8: RUNNING JAVASCRIPT ON THE COMMAND LINE 133 Introduction 133 Learning About Node.js 134 Installing Node 134 Installing Node on Windows 135 Installing Node on OS X 135 Installing Node on Linux 135 Tracking the Latest Version of Node 136 Installing and Using Node Modules 136 Installing Modules 136 Hinting Your Code 136 Uglifying Your Code 137 Creating Your Own Script 137 Creating a package.json File 138 Using Server-Side Canvas 139 Creating a Reusable Script 140 Writing a Sprite-Map Generator 141 Using Futures 141 Working from the Top Down 142 Loading Images 144 Calculating the Size of the Canvas 146 Drawing Images on the Server-Side Canvas 146 Updating and Running the Script 148 Summary 148 CHAPTER 9: BOOTSTRAPPING THE QUINTUS ENGINE: PART I 149 Introduction 149 Creating a Framework for a Reusable HTML5 Engine 150 Designing the Basic Engine API 150 Starting the Engine Code 151 Adding the Game Loop 153 Building a Better Game Loop Timer 153 Adding the Optimized Game Loop to Quintus 154 Testing the Game Loop 155 Adding Inheritance 157 Using Inheritance in Game Engines 157 Adding Classical Inheritance to JavaScript 158 Exercising the Class Functionality 161 Supporting Events 162 Designing the Event API 162 Writing the Evented Class 162 Filling in the Evented Methods 163 Supporting Components 165 Designing the Component API 166 Implementing the Component System 167 Summary 169 CHAPTER 10: BOOTSTRAPPING THE QUINTUS ENGINE: PART II 171 Introduction 171 Accessing a Game Container Element 171 Capturing User Input 174 Creating an Input Subsystem 174 Bootstrapping the Input Module 175 Handling Keyboard Events 176 Adding Keypad Controls 178 Adding Joypad Controls 181 Drawing the Onscreen Input 184 Finishing and Testing the Input 186 Loading Assets 188 Defi ning Asset Types 189 Loading Specifi c Assets 189 Finishing the Loader 191 Adding Preload Support 194 Summary 195 CHAPTER 11: BOOTSTRAPPING THE QUINTUS ENGINE: PART III 197 Introduction 197 Defi ning SpriteSheets 198 Creating a SpriteSheet Class 198 Tracking and Loading Sheets 199 Testing the SpriteSheet class 200 Adding Sprites 201 Writing the Sprite Class 201 Referencing Sprites, Properties, and Assets 203 Exercising the Sprite Object 203 Setting the Stage with Scenes 207 Creating the Quintus.Scenes Module 207 Writing the Stage Class 208 Rounding Out the Scene Functionality 212 Finishing Blockbreak 214 Summary 217 PART IV: BUILDING GAMES WITH CSS3 AND SVG CHAPTER 12: BUILDING GAMES WITH CSS3 221 Introduction 221 Deciding on a Scene Graph 221 Your Target Audience 222 Your Interaction Method 222 Your Performance Requirements 222 Implementing DOM Support 223 Considering DOM Specifi cs 223 Bootstrapping the Quintus DOM Module 223 Creating a Consistent Translation Method 224 Creating a Consistent Transition Method 227 Implementing a DOM Sprite 227 Creating a DOM Stage Class 230 Replacing the Canvas Equivalents 231 Testing the DOM Functionality 232 Summary 233 CHAPTER 13: CRAFTING A CSS3 RPG 235 Introduction 235 Creating a Scrolling Tile Map 235 Understanding the Performance Problem 236 Implementing the DOM Tile Map Class 236 Building the RPG 240 Creating the HTML File 240 Setting Up the Game 241 Adding a Tile Map 242 Creating Some Useful Components 245 Adding in the Player 248 Adding Fog, Enemies, and Loot 249 Extending the Tile Map with Sprites 253 Adding a Health Bar and HUD 255 Summary 260 CHAPTER 14: BUILDING GAMES WITH SVG AND PHYSICS 261 Introduction 261 Understanding SVG Basics 262 Getting SVG on Your Page 262 Getting to Know the Basic SVG Elements 263 Transforming SVG Elements 267 Applying Strokes and Fills 267 Beyond the Basics 270 Working with SVG from JavaScript 271 Creating SVG Elements 271 Setting and Getting SVG Attributes 272 Adding SVG Support to Quintus 272 Creating an SVG Module 273 Adding SVG Sprites 274 Creating an SVG Stage 276 Testing the SVG Class 278 Adding Physics with Box2D 280 Understanding Physics Engines 281 Implementing the World Component 281 Implementing the Physics Component 284 Adding Physics to the Example 287 Creating a Cannon Shooter 288 Planning the Game 289 Building the Necessary Sprites 290 Gathering User Input and Finishing the Game 292 Summary 294 PART V: HTML5 CANVAS CHAPTER 15: LEARNING CANVAS, THE HERO OF HTML5 297 CHAPTER 15: LEARNING CANVAS, THE HERO OF HTML5 297 Introduction 297 Getting Started with the Canvas Tag 298 Understanding CSS and Pixel Dimensions 298 Grabbing the Rendering Context 301 Creating an Image from Canvas 301 Drawing on Canvas 302 Setting the Fill and Stroke Styles 303 Setting the Stroke Details 305 Adjusting the Opacity 306 Drawing Rectangles 306 Drawing Images 306 Drawing Paths 307 Rendering Text on Canvas 308 Using the Canvas Transformation Matrix 310 Understanding the Basic Transformations 310 Saving, Restoring, and Resetting the Transformation Matrix 311 Drawing Snowfl akes 311 Applying Canvas Eff ects 313 Adding Shadows 314 Using Composition Eff ects 314 Summary 316 CHAPTER 16: GETTING ANIMATED 317 Introduction 317 Building Animation Maps 318 Deciding on an Animation API 318 Writing the Animation Module 320 Testing the Animation 323 xviii CONTENTS Adding a Canvas Viewport 325 Going Pa... |
内容加载中，请稍后...
商品评论（0条）