Asteroids JS

My take on the classic Atari arcade game Asteroids. I built this over a week during my free time, which is more a testament to the ease of use of HTML and JavaScript than my own development skills.

There are some changes and improvements I would like to make, like persisting your high score, but I decided to totally stop after a week on the principle that I made it in a week ¯\_(ツ)_/¯

Play it here!

How to Play

If you're playing with a keyboard, you'll see the default controls on the right. If you want to rebind the controls, click the named key below the command, and type the key you would like to use. You turn the ship left or right relative to the direction it's facing.

Firing thrusters propels the ship forward; being in outer space, there's no friction (although I've set a maximum speed) so you'll keep moving in the direction you last fired the thrusters. If you collide with an asteroid, it'll destroy your ship and lose you a life. Fire a missile to destroy an asteroid; large asteroids will break into two smaller ones.

As you destroy asteroids, more will appear at the edges of the screen ad infinitum, though no more will appear if there are seven or more on screen already. You only get points for destroying the smallest size asteroid (out of three sizes). Check out the options menu to toggle control methods, and adjust the rendering color.

Mobile Compatibility

This works on mobile, though you're likely to zoom in from double tapping the fire or thruster buttons. The ship turns toward your finger if you hold it on the screen. If the yellow and red buttons don't appear, click the options button and toggle the control type to "touchscreen". The yellow button fires thrusters, the red button fires missiles.

Built using the Canvas Rendering Context Web API.