A web-based recreation of the 1978 Arcade Classic Space Invaders. Built using plain HTML, CSS, and JavaScript
The game runs fully in the browser and uses localStorage to keep track of high scores, so there is no connection to an external back-end server or database.
There are no 3rd party libraries or packages used. Features such as collision, animations, and user controls are implemented using built-in JavaScript methods and several Web API's. For example, animation and frame-by-frame logic checks are performed with help from requestAnimationFrame, which allows us to easily tell the browser that we would like to perform actions before browser repaints. Canvas Elements are heavily used to draw elements to the screen.
classDiagram
class Score
class Player
class Invader
class Bullet
class Collider
Invader : element
Invader : Collider
Invader : sourceImg
Invader : pointsValue
Invader : updateCanvas()
Invader : nextSprite()
Invader : removeInvader()
Invader *-- Collider
Bullet *-- Collider
Bullet: element
Bullet : Collider
Bullet : animationStart
Bullet : removeBullet()
Player *-- Collider
Player : element
Player : Collider
Player : sourceImg
Player : move()
Player : updateCanvas()
Score : initials
Score : score
Score : loadScores)
Score : saveScores()
Score : clearScores()
Collider : element
Collider : deleteCollider()
Collider : checkCollisions()
Thanks to the original team for assisting in crafting the original vision for this project!