let platformHeight = 350;

let platformWidth = 100;

let coyoteSpace = 10;

​

let ballY = 200;

let ballX = 300;

let speedY = 2;

let speedX = 0;

​

let lives = 5;

​

let blockWidth = 60;

let blockHeight = 15;

let rows = 4;

let columns = 9;

​

let resetCounter = rows * columns;

let points = 0;

let multiplier = 1;

let gameOver = false;

​

class Block {

  constructor(x, y, blockWidth, blockHeight) {

    this.x = x;

    this.y = y;

    this.blockWidth = blockWidth;

    this.blockHeight = blockHeight;

    this.broken = false;

  }

​

  drawBlock() {

    //draw settings

    fill(0);

    stroke(255);

​

    if (this.broken == false) {

      rectMode(CORNER);

      rect(this.x, this.y, this.blockWidth, this.blockHeight);

    }

  }

​

  collisionCheck(ballX, ballY) {

    if (this.broken == false) {

      //if its not already broken

      if (ballX > this.x && ballX < this.x + this.blockWidth + 5) {

        //and the balls in the x

        if (ballY > this.y && ballY < this.y + this.blockHeight + 5) {

          //and the balls in the y

          this.broken = true; //break it

          return true;

        }

      }

    }

    return false;

  }

}

​

//make the blocks

let blockIndex = 0; //cycles through blocks in the array blocks

let blocks = [];

for (let i = 0; i < columns; i++) {

  //makes each column

  let x = 14 + (4 + blockWidth) * i;

  for (let j = 0; j < rows; j++) {

    //makes the part of the row for each colum

    let y = 70 + (blockHeight + 10) * j;

    blocks[blockIndex] = new Block(x, y, blockWidth, blockHeight);

    blockIndex++;

  }

}

​

function reset() {

  for (let i = 0; i < blocks.length; i++) {

    //reappears all the blocks

    blocks[i].broken = false;

  }

  //resets ball

  ballY = 200;

  ballX = 300;

  speedX = 0;

  speedY = 2; //slows speed down for reset, jumps back up when it hits player

  //resets reset

  resetCounter = rows * columns;

}

​

function setup() {

  createCanvas(600, 400);

}

​

function draw() {

  background(0);

​

  if (gameOver == false) {

    //text

    textAlign(RIGHT, TOP);

    fill(255);

    noStroke();

    textSize(15);

    text("points: " + points, 595, 5);

    text("lives: " + lives, 595, 20);

​

    //draw settings

    fill(0);

    stroke(255);

​

    //draw ball

​

    //ball y

    if (ballY < 0) {

      speedY = 5;

    } else if (ballY > platformHeight - 10) {

      if (

        ballX > mouseX - (platformWidth / 2 + coyoteSpace) &&

        ballX < mouseX + (platformWidth / 2 + coyoteSpace)

      ) {

        //is the ball on the platform?

        speedY = -5;

        speedX = floor(

          map(

            ballX,

            mouseX - (platformWidth / 2 + coyoteSpace),

            mouseX + (platformWidth / 2 + coyoteSpace),

            -5,

            5

          )

        ); //makes the ball angled

        multiplier = 1; //resets multiplier

      } else {

        lives--;

        ballY = 200; //resets ball pos n speed

        ballX = 300;

        speedX = 0;

        speedY = 2;

      }

    }

​

    //wall collisions

    if (ballX < 0 || ballX > width - 1) {

      speedX = -speedX;

    }

​

    //finally we're moving the damn thing

    ballY += speedY;

    ballX += speedX;

​

    //now we draw it

    circle(ballX, ballY, 10);

​

    //draw player

    rectMode(CENTER);

    rect(mouseX, platformHeight, platformWidth, 10, 10);

​

    //check block collision

    if (ballY < 170) {

      for (i = 0; i < rows * columns; i++) {

        if (blocks[i].collisionCheck(ballX, ballY)) {

          speedY = -speedY;

          resetCounter--;

          points += floor(10 * multiplier);

          multiplier += 0.25;

        }

      }

    }

​

    //draw blocks

    for (i = 0; i < rows * columns; i++) {

      blocks[i].drawBlock();

    }

​

    //checks if all the blocks are gone, resets if they are

    if (resetCounter < 1) {

      reset();

    }

​

    //checks if lives are gone

    if (lives < 0) {

      gameOver = true;

    }

  } else {

    //text setup

    textAlign(CENTER, CENTER);

    fill(255);

    noStroke();

​

    //score text

    textSize(50);

    text(points, width / 2, height / 2);

​

    //click to continue text

    textSize(20);

    text("click to continue", width / 2, height / 2 + 40);

​

    //continues if clicked

    if (mouseIsPressed) {

      //resets everything

      reset();

      lives = 5;

      points = 0;

      gameOver = !gameOver;

    }

  }

}

​