| |
| |
Introduction | |
| |
| |
About This Book | |
| |
| |
What You Will Need | |
| |
| |
How to Read This Book | |
| |
| |
How This Book Is Organized | |
| |
| |
| |
Building the Foundation | |
| |
| |
| |
Basic Game Development | |
| |
| |
| |
Diving Deeper | |
| |
| |
| |
The Part of Tens | |
| |
| |
We Even Use the Internet Thingy! | |
| |
| |
Icons Used in This Book | |
| |
| |
Where to Go from Here | |
| |
| |
| |
Building the Foundation | |
| |
| |
| |
Playing on the Web | |
| |
| |
Building the Framework | |
| |
| |
Setting Up Your Workshop | |
| |
| |
Web browsers | |
| |
| |
A programmer's editor | |
| |
| |
Graphics tools | |
| |
| |
Audio tools | |
| |
| |
Building Your First Game | |
| |
| |
Building a Basic Page | |
| |
| |
Dressing up the page | |
| |
| |
Providing a link | |
| |
| |
Beautifying the page | |
| |
| |
Making a style reusable | |
| |
| |
Building the next node | |
| |
| |
Adding a sound effect | |
| |
| |
Add another page for a victory | |
| |
| |
Making it your own | |
| |
| |
| |
Talking to the User | |
| |
| |
Making an Interactive Form | |
| |
| |
Adding JavaScript to Your Page | |
| |
| |
Creating the custom greeting | |
| |
| |
Making the magic happen | |
| |
| |
A program where everyone knows your name | |
| |
| |
Modifying the page itself | |
| |
| |
Adding style to your forms | |
| |
| |
Do it with style | |
| |
| |
Creating a style for the form | |
| |
| |
Outsourcing your JavaScript code | |
| |
| |
Building the Word Story Game | |
| |
| |
Designing the game | |
| |
| |
Building the HTML foundation | |
| |
| |
Adding the CSS style | |
| |
| |
Writing the code | |
| |
| |
| |
Coding Like a Pro | |
| |
| |
Working with Variables | |
| |
| |
You're just my type: Handling different data types | |
| |
| |
Using a computer program to do bad math | |
| |
| |
Managing data types correctly | |
| |
| |
Making Choices with if | |
| |
| |
Changing the greeting with if | |
| |
| |
The different flavors of if | |
| |
| |
Conditional operators | |
| |
| |
Managing Repetition with for loops | |
| |
| |
Setting up the web page | |
| |
| |
Initializing the output | |
| |
| |
Creating the basic for loop | |
| |
| |
Introducing shortcut operators | |
| |
| |
Counting backward | |
| |
| |
Counting by fives | |
| |
| |
Building While Loops | |
| |
| |
Making a basic while loop | |
| |
| |
Getting your loops to behave | |
| |
| |
Managing more complex loops | |
| |
| |
Managing, bugs with a debugger | |
| |
| |
Sending Data to and from Functions | |
| |
| |
Returning a value from a function | |
| |
| |
Sending arguments to a function | |
| |
| |
Using Arrays to Simplify Data | |
| |
| |
Building the arrays | |
| |
| |
Stepping through the books array | |
| |
| |
Using the for … in loop to access array elements | |
| |
| |
| |
Random Thoughts: Building a Simple Game | |
| |
| |
Creating Random Numbers | |
| |
| |
Seriously, math can be fun | |
| |
| |
Making the HTML form | |
| |
| |
Writing the roll() function | |
| |
| |
Building the Number Guesser | |
| |
| |
Designing the program | |
| |
| |
Building the HTML for the game | |
| |
| |
Writing the CSS for the number guesser | |
| |
| |
Thinking through the game's data | |
| |
| |
Setting up the initialization routine | |
| |
| |
Responding to the Button | |
| |
| |
| |
Basic Game Development | |
| |
| |
| |
Introducing simpleGame.js | |
| |
| |
Using a Game Engine | |
| |
| |
Essential game engine features | |
| |
| |
Gaming on the web | |
| |
| |
Building an Animation with simpleGame.js | |
| |
| |
Building your page | |
| |
| |
Initializing your game | |
| |
| |
Updating the animation | |
| |
| |
Starting from a template | |
| |
| |
Considering Objects | |
| |
| |
Making instance pudding | |
| |
| |
Adding methods to the madness | |
| |
| |
Bringing Your Game | |
| |
| |
Checking the keyboard | |
| |
| |
Moving the sprite | |
| |
| |
Baby, you can drive my car | |
| |
| |
| |
Creating Game Elements | |
| |
| |
Building Your Own Sprite Objects | |
| |
| |
Making a stock sprite object | |
| |
| |
Building your own sprite | |
| |
| |
Using your new critter | |
| |
| |
Adding a property to your critter | |
| |
| |
Adding methods to classes | |
| |
| |
Sound Programming Principles | |
| |
| |
Game Programming's Greatest Hits! | |
| |
| |
Setting up bounding rectangle collisions | |
| |
| |
Distance-based collisions | |
| |
| |
It's All About Timing | |
| |
| |
| |
Getting to a Game | |
| |
| |
Building a Real Game | |
| |
| |
Planning Your Game | |
| |
| |
Programming On the Fly | |
| |
| |
There seems to be a bug in this program | |
| |
| |
Fly, fly! fly! | |
| |
| |
Clearly, We Need an Amphibian | |
| |
| |
Making a frog | |
| |
| |
Adding a background | |
| |
| |
Managing updates | |
| |
| |
Combining the Frog and the Fly | |
| |
| |
Building a library of reusable objects | |
| |
| |
When Sprites Collide | |
| |
| |
Collisions apply to the frog and the fly | |
| |
| |
Resetting the fly - on the fly | |
| |
| |
Working with Multiple Flies | |
| |
| |
Adding the Final Touches | |
| |
| |
Adding the timer | |
| |
| |
Resetting the game | |
| |
| |
| |
Diving Deeper | |
| |
| |
| |
Motion and Animation | |
| |
| |
Physics - Even More Fun Than You Remember | |
| |
| |
Newton without all the figs | |
| |
| |
Phuzzy physics | |
| |
| |
Lost in Space | |
| |
| |
Becoming a space cadet | |
| |
| |
Building the space simulation | |
| |
| |
Don't Be a Drag - Adding Drag Effects | |
| |
| |
Drag racing | |
| |
| |
Implementing drag | |
| |
| |
Do You Catch My Drift? | |
| |
| |
Burning virtual rubber | |
| |
| |
Adding drift to your sprites | |
| |
| |
Recognizing the Gravity of the Situation | |
| |
| |
Adding rockets to your ride | |
| |
| |
Use the force (vector), Luke | |
| |
| |
Houston, We've Achieved Orbit | |
| |
| |
Round and round she goes | |
| |
| |
Decoding the alphabet soup | |
| |
| |
This isn't rocket science | |
| |
| |
Writing the orbit code | |
| |
| |
Does This Car Come with a Missile Launcher? | |
| |
| |
Projectiles in a nutshell | |
| |
| |
It's time to launch the missiles | |
| |
| |
Building a Multi-State Animation | |
| |
| |
| |
Going Mobile | |
| |
| |
Using HTML5 as a Mobile Language | |
| |
| |
Don't you need a special language? | |
| |
| |
HTML5 is a great compromise | |
| |
| |
So what else do you need? | |
| |
| |
Putting Your Game on a Server | |
| |
| |
Using a control panel | |
| |
| |
Uploading a page with a control panel | |
| |
| |
Using an FTP client | |
| |
| |
Making Your Game App-Ready | |
| |
| |
Managing the screen size | |
| |
| |
Making your game look like an app | |
| |
| |
Removing the Safari toolbar | |
| |
| |
Storing your game offline | |
| |
| |
Managing Alternate Input | |
| |
| |
Adding buttons | |
| |
| |
Responding to the mouse | |
| |
| |
Reading the Virtual Joystick | |
| |
| |
Controlling an object with the virtual joystick | |
| |
| |
Driving with joy(sticks) | |
| |
| |
Using virtual arrow keys | |
| |
| |
Tilting at windmills with the accelerometer | |
| |
| |
Reading the tilt | |
| |
| |
Calibrating the accelerometer | |
| |
| |
| |
Documenting simpleGame | |
| |
| |
Overview of simpleGame | |
| |
| |
The Scene Object | |
| |
| |
Primary properties of the Scene object | |
| |
| |
Important methods of the Scene class | |
| |
| |
The Sprite Class | |
| |
| |
Main properties of the sprite | |
| |
| |
Appearance methods of the Sprite | |
| |
| |
Movement methods of the sprite | |
| |
| |
Boundary methods of the sprite | |
| |
| |
Collision methods of the sprite | |
| |
| |
Animation methods of the sprite | |
| |
| |
Utility Classes | |
| |
| |
The Sound object | |
| |
| |
The Timer object | |
| |
| |
The virtual joystick | |
| |
| |
The virtual accelerometer | |
| |
| |
The game button | |
| |
| |
Keyboard array | |
| |
| |
Making the Game Engine Your Own | |
| |
| |
| |
The Part of Tens | |
| |
| |
| |
Ten Great Game Asset Resources | |
| |
| |
Dia Diagramming Tool | |
| |
| |
GIMP - A Powerful Image Editor | |
| |
| |
Ari's SpriteLib | |
| |
| |
Reiner's Tilesets | |
| |
| |
OpenGameArt | |
| |
| |
Blender | |
| |
| |
Audacity - Useful for Sound Effects | |
| |
| |
Freesound.org | |
| |
| |
SoundJay.com | |
| |
| |
BFXR Incredible Eight-Bit Sound Effects | |
| |
| |
InkScape | |
| |
| |
| |
Ten Concepts Behind simpleGame | |
| |
| |
Using the Canvas Tag | |
| |
| |
Looking at a canvas | |
| |
| |
Basic canvas drawing | |
| |
| |
Creating an Animation Loop | |
| |
| |
Angles in the Outfield | |
| |
| |
Transformations in Canvas | |
| |
| |
Coordinates inside coordinates | |
| |
| |
Transforming an image | |
| |
| |
Vector Projection | |
| |
| |
Examining the problem | |
| |
| |
Building a triangle | |
| |
| |
Would you like sides with that? | |
| |
| |
Solving for dx and dy | |
| |
| |
Converting components back to vectors | |
| |
| |
Using the Sound Object | |
| |
| |
Reading the Keyboard | |
| |
| |
Managing basic keyboard input | |
| |
| |
Responding to multiple key presses | |
| |
| |
Managing the Touch Interface | |
| |
| |
Handling touch data and events | |
| |
| |
Collision Detection | |
| |
| |
Enabling bounding-box collisions | |
| |
| |
Calculating the distance between sprites | |
| |
| |
Boundary Checking | |
| |
| |
| |
Ten Game Starters | |
| |
| |
Lunar Lander | |
| |
| |
The eagle has landed | |
| |
| |
Producing a text console | |
| |
| |
Enhancing the game | |
| |
| |
Mail Pilot | |
| |
| |
Building an "endless" background | |
| |
| |
Improving the top-down racer | |
| |
| |
The Marble-Rolling Game | |
| |
| |
Managing dual input | |
| |
| |
Building an array of obstacles | |
| |
| |
Improving the marble game | |
| |
| |
Whack-a-Mole | |
| |
| |
Building a mole in a hole game | |
| |
| |
Other features of the mole game | |
| |
| |
Improving the mole game | |
| |
| |
Jump and Run on Platforms | |
| |
| |
Jumping and landing | |
| |
| |
Coming in for a landing | |
| |
| |
Making draggable blocks | |
| |
| |
Improving the platform game | |
| |
| |
Pong - the Granddaddy of Them All | |
| |
| |
Building the player paddle | |
| |
| |
Adding artificial stupidity | |
| |
| |
Building a ball to bounce off boundaries | |
| |
| |
Putting some spin on the ball | |
| |
| |
Improving the Pong game | |
| |
| |
I'm a Fighter, Not a Lover - RPGs | |
| |
| |
Building the base Character class | |
| |
| |
One does not simply build an ore | |
| |
| |
We need a hero | |
| |
| |
Improving the role-playing game | |
| |
| |
Tanks - and You're Welcome! | |
| |
| |
Tanks, turrets, and shells | |
| |
| |
Building a bullet | |
| |
| |
Improving the tank game | |
| |
| |
Miles and Miles of Tiles and Tiles | |
| |
| |
Creating a Tile object | |
| |
| |
Building a map from tiles | |
| |
| |
Updating the tiles | |
| |
| |
Loading a tile map | |
| |
| |
Improving the tile world | |
| |
| |
Tic-Tac-Toe Is the Way to Go | |
| |
| |
Creating the board | |
| |
| |
Setting up the visual layout | |
| |
| |
Checking for a winning combination | |
| |
| |
Adding an AI | |
| |
| |
Improving the tic-tac-toe game | |
| |
| |
Index | |