Inspiration:
The inspiration for Star Shooter comes from a variety of sources, including classic arcade games like Space Invaders and Galaga, as well as more modern games like Geometry Wars and Asteroids. These games typically involve shooting at large moving targets, often with a spaceship or other vehicle as the player’s avatar. The use of space-themed graphics, such as stars and comets, and the inclusion of a timer and score system are also one of the common features of shooting games. The game draws inspiration from science fiction movies and TV shows, which often depict space battles and laser gun fights.
Features and challenges:
One of the main features of the game is that it uses object-oriented programming to create dots and bullets that move around the screen. I had to use arrays to hold all of the dots and bullets, and I spent a lot of time making sure that the movement and collision detection was smooth and accurate, using efficient algorithms for collision detection. I used the testIntersection() function that allows the measurement of the distance between the radius of the bullet and the comet. If the distance is less than or equal to the sum of their radii, the bullet has intersected with the dot.
testIntersection(dot) {
var d = dist(this.x, this.y, dot.x, dot.y);
if (d <= this.r + dot.r) {
return true;
}
}
preload(): This function is used to load all the necessary assets (images) for the game before it starts. It is called once when the program starts. The arguments are the file paths to the image files that need to be loaded. The function works by using the loadImage() function provided by p5.js to load the images and store them in global variables for later use.
mousePressed(): This function is called once every time the left mouse button is pressed. It is used to create a new bullet object and add it to the bullets array. The function works by creating a new instance of the Bullet class and passing the current x-coordinate of the mouse as an argument. The new bullet is then added to the bullets array.
keyPressed(): This function is called once every time a key is pressed. It is used to create a new bullet object and add it to the bullets array when the spacebar key is pressed. The function works by checking if the key that was pressed is the spacebar key, and if it is, creating a new instance of the Bullet class and adding it to the bullets array.
Bullet.display(): This method is used to display the bullet on the canvas. It takes no arguments. The function works by drawing a rectangle on the canvas with a white fill color and a size of 10×20 pixels, using the bullet’s x- and y-coordinates.
Bullet.move() : This method is used to move the bullet up the screen. It takes no arguments. The function works by subtracting a fixed value from the bullet’s y-coordinate every frame, causing it to move up the screen.
Bullet.testIntersection(): This method is used to test if the bullet has intersected with a dot (enemy). It takes a single argument, which is a dot object to test against. The function works by calculating the distance between the center of the bullet and the center of the dot, and comparing it to the sum of their radii. If the distance is less than or equal to the sum of their radii, the bullet has intersected with the dot.
Dot.display(): This method is used to display the dot on the canvas. It takes no arguments. The function works by drawing an ellipse on the canvas with a red fill color and a size of 60×60 pixels, using the dot’s x- and y-coordinates.
Dot.move(): This method is used to move the dot around the canvas. It takes no arguments. The function works by adding a random value to the dot’s x- and y-coordinates every frame, causing it to move in a random direction. If the dot reaches the edge of the canvas, it is wrapped around to the opposite edge.