# Creating the brick breaker Game

**URL:** <https://discourse.processing.org/t/creating-the-brick-breaker-game/8251>\
**Category:** Coding Questions\
**Created:** [February 9, 2019, 5:18pm UTC](https://discourse.processing.org/t/creating-the-brick-breaker-game/8251 "2019-02-09T17:18:46Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![jadenfigger](https://avatars.discourse-cdn.com/v4/letter/j/73ab20/32.png) [@jadenfigger](https://discourse.processing.org/u/jadenfigger)\
**Post date:** [February 9, 2019, 5:18pm UTC](https://discourse.processing.org/t/creating-the-brick-breaker-game/8251/1 "2019-02-09T17:18:46Z")

</div>

I am trying to create brick breaker but when my ball moves it is really glitchy. The ball position keeps jumping to where it previously was. If anyone knows how to fix this issue could you please let me know.  
Here is my code.

```auto
let ballX = 200;
let ballY = 200;
let ballR = 15;
let ballSpeedX = 5;
let ballSpeedY = 5;
let terminalSpeed = 15;

let paddleThickness = 10;
let paddleLength = 100;

let brickW = 100;
let brickH = 50;
let brickGap = 1;
let brickRow = 1;
let brickCol = 8;
let brickGrid = new Array(brickCol);

function setup() {
  createCanvas(800, 600);

  brickReset();
}

function brickReset() {
  for (let i = 0; i < brickCol; i++) {
    brickGrid[i] = true;
  }
}

function draw() {
  background(0, 40, 90);
  move();
  ballPaddleCollision();
  brickDraw();

  fill(255, 105, 0);
  ellipse(ballX, ballY, ballR * 2); // ball

  fill(220);
  rect(mouseX, height - 60, paddleLength, paddleThickness);
  console.log(ballSpeedX);
}

function brickDraw() {
  for (let i = 0; i < brickGrid.length; i++) {
    fill(255, 105, 0);
    rect(brickW * i, 0, brickW - brickGap, brickH - brickGap);
  }
}

function ballReset() {
  ballX = width / 2;
  ballY = height / 2;
}

function move() {
  ballX += ballSpeedX;
  ballY += ballSpeedY;
  ballSpeedX *= 0.999;

  if (ballSpeedX >= 0) {
    if (ballSpeedX > 15) {
      ballSpeedX = terminalSpeed;
    }
  }
  if(ballSpeedX <= 0) {
   	if(ballSpeedX < -15) {
     ballSpeedX = -terminalSpeed 
    }
  }

  if (ballX > width - ballR) {
    ballSpeedX *= -1;
  }
  if (ballX < 0 + ballR) {
    ballSpeedX *= -1;
  }
  if (ballY > height - ballR) {
    //ballSpeedY *= -1;
    ballReset();
  }
  if (ballY < 0 + ballR) {
    ballSpeedY *= -1;
  }
}

function ballPaddleCollision() {
  let paddleTop = height - 60;
  let paddleBottom = paddleTop + paddleThickness;
  let paddleLeft = mouseX;
  let paddleRight = paddleLeft + paddleLength;

  if (ballY > paddleTop - ballR &&
    ballY < paddleBottom + ballR &&
    ballX > paddleLeft - ballR &&
    ballX < paddleRight + ballR) {

    ballSpeedY *= -1;

    let paddleCenter = mouseX + paddleLength / 2;
    let ballDistFromPaddleCenX = ballX - paddleCenter;
    ballSpeedX += ballDistFromPaddleCenX * 0.7;
  }
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [February 15, 2019, 6:06pm UTC](https://discourse.processing.org/t/creating-the-brick-breaker-game/8251/2 "2019-02-15T18:06:31Z")

</div>

> [@jadenfigger](#):
>
> ballSpeedX \*= 0.999;

Try removing this

Does it work now