HTML and CSS Reference
In-Depth Information
Representing Levels
Alien Invasion now has all the mechanics necessary to play the game. The only missing component is to put
together some level data and a mechanism for adding enemy ships onto the screen.
Before getting into the levels, add a few more enemy types to give some variety to the page.
Setting Up the Enemies
You could create an endless number of variations of enemy movement, but for this game you'll set up five dif-
ferent types of enemy behavior using the various enemy sprite types as a start. You can play with the definitions
and add more if you like. You could make a number of other variations, but this set of five is a good start. Re-
place the enemies definition at the top of game.js with Listing 2-11 .
Listing 2-11: Enemy Definitions
var enemies = {
straight: { x: 0, y: -50, sprite: 'enemy_ship', health: 10,
E: 100 },
ltr: { x: 0, y: -100, sprite: 'enemy_purple', health: 10,
B: 200, C: 1, E: 200 },
circle: { x: 400, y: -50, sprite: 'enemy_circle', health: 10,
A: 0, B: -200, C: 1, E: 20, F: 200, G: 1, H: Math.PI/2 },
wiggle: { x: 100, y: -50, sprite: 'enemy_bee', health: 20,
B: 100, C: 4, E: 100 },
step: { x: 0, y: -50, sprite: 'enemy_circle', health: 10,
B: 300, C: 1.5, E: 60 }
With just a variation on the movement parameters, the enemies have wildly differing movement styles. The
straight enemy has only vertical velocity parameter E , so it moves downward at a constant rate.
The ltr enemy (short for left-to-right) has a constant vertical velocity, but then a sinusoidal horizontal ve-
locity (parameters B and C ) gives it a smooth sweeping motion from left to right.
The circle has primarily sinusoidal motion in both directions, but adds a time shift in the Y direction with
parameter H to give a circular motion to the enemy.
The wiggle and the step enemies have the same parameters set, just to different amounts. With a smaller
B value and larger C and E values, the wiggle enemy just snakes down the screen, while the step enemy,
with a larger B and a smaller C and E , makes its way down the page slowly by sliding back and forth across the
whole screen.
Setting Up Level Data
Knowing that levels in Alien Invasion will be populated with strings of enemies of the same type, the next step
is to figure out a good mechanism for encoding the level data in a compact manner. When that has been figured
out, you can work backward and figure out what the level object needs to do to spawn those enemies onto the
page. Working from how you want to use a piece of code back to the implementation is a good way to end up
Search WWH ::

Custom Search