Concept
You and your friend are space travellers who roam around various planets just for the fun of it. Racing against each other as you explore few planets is a hobby for both of you. One day, however, your spaceship malfunctions and crashes into a nearby planet. Your friend was so far ahead on the race that s/he does not realise you have crashed. You do not get injured in the crash but your spaceship is damage and all the equipments in the spaceship, including your laser gun.
An entire alien civilisation has seen you crash and perceives you as a threat. They are coming to attack you! Defend yourself with a damaged gun that shoots laser on random directions as you collect resources scattered around the planet to repair your ship and hopefully get back to your friend.
Game Dynamics
This is a simple game with simple dynamics:
- The player is movable through the arrow keys.
- The aliens/minions are not playable characters but follows the player wherever they go.
- Resources and Health Regen spawn in random places
I have made the game as simple as possible so that the player is not overwhelmed with all the functionality possible. This is mainly a time based game where the player needs to survive for the longest period of time and collect about 50 resources to win the game. However there is a catch. The resources spawn every 5 or so seconds and you will only have at most two resources dropped at any given moment. Thus, the player can not wait for all the resources to be dropped then collect it, rather the player constantly needs to move around to collect he resources. This is true for the health regeneration power up as well, however, you can have at most three of these at any given moment on screen.
Code I am proud of
The biggest thing that made working on the code easier was dividing the whole code into various different JS files and having them only focus on certain aspect. For instance, I divided the player
, minion
and weapon class into different JS files to make debugging and understanding the code easier. This also makes the filing structure logical and effective.
The hardest part of the project when either the laser or the minion were to be deleted from the canvas and the game environment after a collision. The problem is simple; when the laser hits the minion:
- The minion has to be deleted
- The arrow has to be deleted
Despite the simplicity of the problem, it was not easy to overcome. Let’s just look at minions for now. I had to figure out:
- what deleting a minion from the game environment meant.
- which minion to delete, and how do I know which is the minion in the array that I had to delete
For the first problem, I realised that deleting simply meant that I had to remove the minion from the minions
array. This would simply not display a minion object, hence removing it entirely. The next problem I ran into right after implementing the deletion code was that: as the player moves around, the minion that was deleted was not the ones that the laser hit. The deletion of minions appeared to be random. I had my eureka moment, when I realised I had to specify an id
for each minion so that I could identify which laser hit (the lasers are also id
‘ed) which minion. This way I could delete the specific minion and not break the code.
I decided to id
the objects using their indices in the array. This meant that I had to decrease the id
of the objects of the subsequent objects in their arrays by 1. This made id
reusable and limited to the number of minions in any given instance.
detectLaserHit() { for (let i = 0; i < lasers.length; i++) { let laser_pos = lasers[i].getLaserPos(); let d = dist(laser_pos.x, laser_pos.y, this.pos.x, this.pos.y); if (d < this.radius) { this.health--; if (this.health <= 0) { // Notice we delete the minion according to their id and reset the id in the following lines minions.splice(this.id, 1); // since the minion id is linked to its index in the array, we are decreasing the id of every minion that comes after the minion we killed in the array. for (let i = this.id; i < minions.length; i++) { minions[i].id -= 1; } } lasers[i].sturdiness--; if (lasers[i].sturdiness <= 0) { lasers.splice(i, 1); } } } }
Problems Encountered:
There are various problems I ran into and here is a list of them:
Note: italics means that I was able to solve them, while bolded text mean I was not.
- Sound: I had an error while running the code. The error told me that play() was being called when a new sound file was being loaded. It appeared it was an error with
createAudio
, which I swapped out withloadSound
. Another problem was that my sound was clipping because I put my play function inside thedraw
function, which was calling theplay
function multiple times. I had to take play the sound insetup
function. - Event called more than once: When suppose we are at time 10 seconds in the game, at this time I call the
upgrade_weapons
function. This was however being called multiple times in the course of the 10th second. So, I had to use a boolean flag to make sure I was only calling the functions once.if (endurance_time % 10 == 0 && upgrade_flipper) { upgrade_weapons(); upgrade_minions(); drop_health_power_up(); } // stop upgrading when upgraded once // flipping the flippler to true once the second has passed. if (endurance_time % 10 == 1) { upgrade_flipper = true; }
- Minions movement: The minions move towards the player in a trivial fashion, just changing direction straight towards the player. This creates a line of minions in the x-axis and y-axis relative to the player. I tried adding in randomness to their movement but this. I did randomise the speeds of every minion to minimise this effect, but it is still persistent.
Future improvements:
There are a lot of thing to improve on this game. Firstly the game dynamics itself. I could add in different levels and improve the weapon in different level. I could also implement a controllable weapon where you can roughly aim where to hit (with enough resources, you can repair your weapon). Another improvement could be adding in a boss alien when killed would give me tons of resources. This game could take a multiplayer approach, where my friend finds me and helps me escape the planet.