Skip to content

Latest commit

 

History

History
188 lines (186 loc) · 9.78 KB

README.md

File metadata and controls

188 lines (186 loc) · 9.78 KB

Description

This project is a clone of the Arkanoid game. Arkanoid (アルカノイド Arukanoido) is an arcade game released by Taito in 1986. The player controls the "Vaus", a space vessel that acts as the game's "paddle" which prevents a ball from falling from the playing field, attempting to bounce it against a number of bricks. The ball striking a brick causes the brick to disappear. When all the bricks are gone, the player goes to the next level, where another pattern of bricks appears (Wikipedia, 2019).

Wikipedia. (2019, October 29). Arkanoid. Retrieved October 31, 2019, from https://en.wikipedia.org/wiki/Arkanoid.

MVP (DOM - CANVAS)

  • A container where the ball will bounce with the top, left and right borders and will fall if reaches the bottom border.

  • A ball that will bounce in the directions below when it hits a brick or a border of the container.

    compass pointing in all 8 directions
  • A set of bricks that will disappear when the ball hits them.

  • A scores list based on the time the player has been playing.

  • A life counter. The game will finish when the player runs out of life.

  • A space vessel able to move in the X-axis and will be controlled with the keyboard.

Backlog

  • Score system based on the number of bricks destroyed.

  • Sounds

  • Different kind of bricks.

  • Special balls.

  • Control by mouse/touch support.

  • Add different levels.

Data structure

  • Main.js

  • buildSplashScreen() { }
  • buildGameScreen() { }
  • buildScoreScreen() { }
  • Game.js
    • Game() { 
      • this.canvas
      • this.lifes
      • this.points }
    • Game.prototype.startLoop() { }
    • Game.prototype.checkWallCollisions () { }
    • Game.prototype.clearCanvas = function () { }
    • Game.prototype.updateCanvas = function () { }
    • Game.prototype.drawCanvas = function () { }
    • Game.prototype.setGameOver = function () { }
    • Game.prototype.showScores() = function () { }
  • ball.js
    • Ball() {
      • this.x
      • this.y
      • this.size
      • this.direction
      • this.speed
      • this.color }
    • ball.prototype.draw ()
    • ball.prototype.start ()
    • ball.prototype.setDirection ()
    • ball.prototype.bounce ()
    • ball.prototype.fall ()
  • Platform.js
    • Platform() {
      • this.x
      • this.y
      • this.size
      • this.sectionSize
      • this.color
      • this.initPos }
    • Platform.prototype.draw ()
    • Platform.prototype.move ()
    • Platform.prototype.returnToInitPos ()
  • brick.js
    • brick {
      • this.x
      • this.y
      • this.size
      • this.color }
    • Platform.prototype.draw ()
    • Platform.prototype.dissapear ()

States y States Transitions

Definition of the different states and their transition (transition functions).

  • SplashScreen ()
    • buildSplash ()
    • addEventListener (startGame)
  • starGame ()
    • create new Game ()
    • game.start ()
    • gameOver ()
    • buildGameOver ()
    • addEventListener (startBall)
  • scoresScreen ()
    • readScores ()
    • showScores ()

Task

  • Main – buildDom

  • Main – buildSplashScreen

  • Main – addEventListener

  • Main – buildGameScreen

  • Main – buildGameOverScreen

  • Game – buildCanvas

  • Game – clearCanvas

  • Game – updateCanvas

  • Game – drawCanvas

  • Game – setGameOver

  • Game – addEventListener

  • Platform – create

  • Platform – move

  • Platform – returnToInitialPosition

  • Ball – create

  • Ball – move

  • Ball – bounce

  • Ball – fall

  • Brick – create

  • Brick - dissapear

  • Game – addLifeCounter

  • Game – addPointsCounter



Links

Trello

Git

URls for the project repo and deploy Link Repo Link Deploy

Slides

URls for the project presentation (slides) Link Slides.com