Space ships battle game developed in pure Html5 and JS.
A & D kyes to move. Spacebar to shoot. Ez.
The game is based in canvas. There are 3 basic elements; The player, the enemies and the shooted bullets by both.
The idea is that a player have to kill enemies shooting bullets. When bullets collision with enemies, they loose health and finally dies.
Player have lives, when collides with a bullet dies.
Enemies have 1 life. When collides with bullets from player, enemy dies.
There are 2 differents bullets; 1 shooteds by enemies and another 1 shooteds by the player. So I can check the correct collision.
- Sprites.
- Help screen.
- Player name.
- Health bar.
- Record (puntuations).
- Enemy explosion, throwing bullets (shooting)
- Boss?
- next level
Screen |
---|
-canvasWidth:Number |
-canvasHeight:Number |
+buildDom() |
+splashScreen() |
+gameScreen() |
+gameOverScreen() |
Character |
---|
-canvas:(Canvas) |
-x:Number |
-y:Number |
-direction:Number |
-sizeX:Number |
-sizeY:Number |
+constructor(canvas:Canvas) |
+draw(canvas:Canvas) |
+move() |
+checkCollisions(canvas:Canvas) |
+shoot() |
+receiveDamage() |
+loseLife() |
+die() |
Enemy extends Character |
---|
+constructor() |
+update() |
+destroy() |
+die() |
+@checkCollisions() |
Player extends Character |
---|
+constructor() |
+update() |
+@checkCollisions() |
+@die() |
Bullet extends Character |
---|
+constructor() |
? |
Game |
---|
-players:Array(Player) |
-bullets:Array(Bullets) |
-playerLives:Number |
-canvas:Object(canvas) |
-isGameOver:Boolean |
+constructor() |
+start() |
+loop() |
+gameOver() |
+update() |
+draw() |
+checkCollisions() |
+clearCanvas() |
- Game transitions:
- Splash Screen
- Game Screen
- Game Over Screen
- Screen transitions.
- Create canvas
- Game loop
- Add player
- Make player moving
- Add enemies
- Make enemies moving
- Player shoot
- Player bullets collisions with enemies
- Enemies shoot
- Enemies bullets collisions with player
- Backlog.
[https://code.visualstudio.com/] (Code editor)
[https://github.com/necolas/normalize.css/] (Css reset)
[https://paypal.com/] (Donations)
[https://github.com/franlol/space-lol.git] (github)
[https://github.com/franlol/space-lol.git] (deploy)
Arrows to move.
Spacebar to shoot.
Dodge and shoot.
~enjoy.