Asteroids built with raw WebGL and glMatrix for NCSU CSC 461: Introductory Computer Graphics.
This is the classic asteroids arcade game but played in 3D. Your goal is to shoot and destroy every asteroid while avoiding collisions with asteroids and also the glowing yellow suns. Once you destroy all the asteroids, you will go to the next level which will be more difficult.
To control the ship, you use the mouse to look around and press "w" to activate your thrusters to move forward. To fire lasers, press "Space" or click the left mouse button. You can pause and quit at any time by pressing "p".
Large asteroids will take two shots to destroy while small ones will take one shot. When you destroy an asteroid, it splits into two asteroids which are each one size category smaller than the original.
Destroying a large asteroid gives you 100 points while destroying small asteroids give you 50 points.
Since the game is in 3D, there is no wraparound. Instead, as you fly around asteroids and suns are constantly despawned and respawned as they enter and exit the area around you. In order to make the game more fair, the asteroids spawn most densely in the area directly in front of where you're facing and do not spawn at all in a 45 degree cone behind where you're facing. However, since suns spawn in a 50 degree cone in the direction you're moving so you need to be careful of them when travelling quickly.
To aid in debugging, there is a free camera "freecam" mode that allows you to move around and look at objects disconnected from the ship.
To enter freecam, press "b" while controlling the ship. The game will freeze and you are now in freecam mode until you press "b" again.
In freecam, you move around with wasd, ascend with space, and descend with left shift. You can also press "f" to toggle whether fog is rendered or not. You use the up and down arrow keys to increase and decrease your movement speed respectively. Press left to decrease the current level and right to increase.
Note that when you edit the level this way, no changes will happen until you press "b" to exit freecam, since the game is paused. Additionally, when you edit levels this way it directly edits the difficulty of what will be spawned in rather than completely resetting the ship and universe like would normally happen upon completing a level.
This project is built with TypeScript, Webpack, and NPM. Make sure you have a
recent version of npm installed and then, in the root of the repository, run
npm installAfter this, you can run our npm scripts of build, watch, or serve. For
development, you normally want serve. For production, you normally want
build.
npm run build
npm run watch
npm run serve
build generates a minified browser.js file in dist/ using all of the code
in src/. This file is generated by Webpack so it additionally pulls in and
minifies the glMatrix library all into one file.
watch runs build with Webpack except in development mode. Additionally, any
changes of the files will cause browser.js to be rebuilt.
serve runs watch and also starts a development server serving the dist/
directory (i.e. running the project). It should also open the project in a new
tab in your browser. Additionally, the project is live-reloaded any time you
make a change to the source code and any build/compile errors you run into will
be displayed on the webpage as well as your terminal running npm serve
- Font: Astro Space
- Laser/Missile Sound: https://www.dreamstime.com/royalty-free-sound-effect-laser-beam-sound-effect-various-projects-laser-beam-audio133389651
- Thruster Sound: https://freesound.org/people/DJT4NN3R/sounds/347576/
- Collision Sound: https://soundbible.com/308-Large-Thump-Or-Bump.html
- Music: Charon by Kaiz Akhtar