javascript gamer: learn to make games.

javascript gamer > brickslayer > trail

use arrow keys to move paddle

press up arrow to launch ball

press p to pause game

press enter to start


press p again to unpause

game over
level clear!
high scores

press enter to start


You made the High Score List! Enter Your Name!

download snapshot: final.tgz

Brought to you by Cornerhost.

2007/07/22 - alpha release
The code needs some cleanup, but everything is here.
Suggestions welcome in the forum.

Building Brickslayer

How to make a BreakOut clone in Javascript using Prototype.js

Development Trail

00. Setting Up Shop

Tools you will need and initial versions of the source files.

01. The Paddle: Our First Sprite

Creating a sprite and moving it manually with firebug.

02. Keyboard Control

Prototype's Cross-Browser Event System.

03. Animating the Paddle

Smooth animation with setInterval

04. Building the World

Walls, the ball, and a ton of bricks.

05. Collision Detection

Ball Physics. Unit Tests and the Math Object.

06. Keeping Score

Winning, Losing, and Slaying Bricks.

07. Adding Sound

Audio feedback with soundManager.

08. Those Other Screens

Pause. Game Over. Level Clear. The Title Screen.

09. The High Score List

Talking to a PHP Script with Prototype's AJAX support.

10. Potential Enhancements

Ideas for making this game your own.
© Copyright 2007 Sabren Enterprises Inc