HTML and CSS Reference
In-Depth Information
Your big UFO ship object wasn't too difficult to create. Let's tackle the player's ship next,
because it follows similar mechanics but adds an input monitor and SVG path.
Step 4: Create the player's ship
Because you created a path for a player's green ship with the Welcome screen, you can re-
use that code. Path
d
attributes have x and y coordinates built in, so you'll need to separate
the x/y coordinates and path data into two separate parameters. By doing so, you can dy-
namically generate an x/y position for the ship's graphic. Create the player's ship with the
following listing.
Listing 7.11. game.js—Player ship setup
Step 5: Make the player respond to keyboard input
In addition to the previous listing, you'll need an
update()
method to add values for
monitoring keyboard input. Using a mouse will also be available, but it's stored inside a
Ctrl
object that you'll create. First, finish your
Ship
object with the code in the next list-
ing.
