Sketchbook
Index / 2017 / Assignment 04
№ 23

Assignment 04

assignments
← Assignment 04 Assignment 04 →
800×600 · p5.js instance mode
p5 pde
10 PDE files 613 lines
// Assignment_04.pde

//work on this
//http://coryschires.com/breakout-clone-in-processing-js/

PFont title, body;
PImage chalkboard;
int state, numBricks, numRows;
float xcenter, ycenter;
color darkblue, pink, darkpink, lightpink, lightblue, pinkred, lightyellow;

button start, options, exit, main;
brick[] bricks;
paddle player;
ball ball;
game breakout;


void setup() {
  size(800, 600);

  rectMode(CENTER);
  textAlign(CENTER, CENTER);
  noStroke();

  darkblue = #;
  darkpink = #C14875;
  pink = #FF6FA4;
  pinkred = #E8578C;
  lightpink = #FF8BB6;
  lightblue = #B9C0FF;
  lightyellow = #FFE8AD;

  xcenter = width/2;
  ycenter = height/2;

  chalkboard = loadImage("chalkboard.jpg");
  title = loadFont("Eraser_Regular-84.vlw");
  body = loadFont("Eraser_Regular-32.vlw");

  numBricks = 13;
  numRows = 4;

  bricks = new brick[numBricks*numRows];

  for (int i=0; i<(numBricks*numRows); i++) {
    bricks[i] = new brick((i%13)*60+40, (i/13)*40+30);
  }

  start = new button("Start", xcenter, height/16*7, width/3, height/7, pinkred, darkpink, lightpink);
  options = new button("Options", xcenter, height/16*10, width/3, height/7, pinkred, darkpink, lightpink);
  exit = new button("Exit", xcenter, height/16*13, width/3, height/7, pinkred, darkpink, lightpink);
  main = new button("Main Menu", xcenter, height/16*13, width/3, height/7, pinkred, darkpink, lightpink);

  player = new paddle();
  ball = new ball(xcenter, ycenter);

  breakout = new game();
}

void draw() {
  switch(state) {
  case 0: 
    mainMenu(); 
    break;
  case 1: 
    optionsMenu(); 
    break;
  case 2: 
    drawGame(); 
    break;
  case 3:
    gameOver();
    break;
  default: 
    mainMenu(); 
    break;
  }
}

void mousePressed() {
  if (ball.startPosition()) {
    ball.moveStart();
    breakout.active = true;
  } else {
    ball.pause();
    if (breakout.paused) {
      breakout.paused = false;
    } else {
      breakout.paused = true;
    }
  }
}

// ball.pde
class ball {

  float d, max, rest;
  PVector p, v, ps;

  ball(float tempX, float tempY) {
    p = new PVector(tempX, tempY);
    v = new PVector(0, 0);
    ps = new PVector(0, 0);
    d = 20;
    max = 16;
  }

  void display() {
    noStroke();
    fill(lightblue);
    ellipse(p.x, p.y, d, d);
  }

  void move() {
    if ((p.y-d/2) <= 0) {
      v.y *= -1;
    }
    if ((p.x-d/2) <= 0 || (p.x+d/2) >= width) {
      v.x *= -1;
    }
    p = p.add(v);
  }
  
  void moveStart() {
    v.x = 0;
    v.y = -8;
  }

  void pause() {
    if (v.x == 0 && v.y == 0) {
      v.x = ps.x;
      v.y = ps.y;
    } else {
      ps.x = v.x;
      ps.y = v.y;
      v.x = 0;
      v.y = 0;
    }
  }

  void rest() {
    // stop ball from moving
    v.x = 0;
    v.y = 0;
    
    rest = constrain(mouseX, (player.getW()/2), width - (player.getW()/2));;
    
    // place ball atop paddle
    p.y = width/8*5;
    p.x = rest;
  }
  
  void reboundPaddle() {
    float bounce;
    bounce = dist(p.x,player.getY(), player.getX(), player.getY());
    
    if (p.x <= player.getX()) {
      v.x = (bounce*0.2) *-1;
    } else {
      v.x = bounce*0.2;
    }
    
    v.y = (max - abs(v.x))*-1;
  }
  
  void reboundBrick() {
    v.y *= -1;
  }
  
  boolean startPosition() {
    if (p.y == width/8*5 && v.x == 0 && v.y == 0) {
      return true;
    } else {
      return false;
    }
  }
  
  boolean missed() {
    if (p.y >= height) {
      return true;
    } else {
      return false;
    }
  }
  
  boolean hitPaddle() {
    if (p.x >= player.getX() - (player.getW()/2) &&
        p.x <= player.getX() + (player.getW()/2) &&
        p.y >= player.getY() - (player.getH()/2) &&
        p.y <= player.getY() + (player.getH()/2)) {
      return true;
    } else {
      return false;
    }
  }
  
  boolean hitBrick() {
    if (p.y <= 164) {
      return true;
    } else {
      return false;
    }
  }
  
  float getX() {
    return p.x;
  }
  
  float getY() {
    return p.y;
  }
}

// brick.pde
class brick {
  
  color c;
  float x,y,w,h;
  boolean alive;
  
  brick(float tempX, float tempY) {
    x = tempX;
    y = tempY;
    w = 50;
    h = 30;
    c = lightpink;
    alive = true;
  }
  
  void display() {
    rectMode(CENTER);
    noStroke();
    strokeWeight(3);
    fill(c);
    rect(x,y,w,h,10);
  }
  
  boolean getStatus() {
    return alive;
  }
  
  void die() {
    alive = false;
    c = darkblue;
  }
  
}

// button.pde
class button {

  float x, y, w, h;
  color i, r, c;
  boolean mouseOn, clicked;
  String t;

  button(String text, float tempX, float tempY, float tempW, float tempH, color tempI, color tempR, color tempC) {
    x = tempX;
    y = tempY;
    w = tempW;
    h = tempH;
    i = tempI;
    r = tempR;
    c = tempC;
    t = text;
    mouseOn = false;
    clicked = false;
  }

  void display() {
    update();
    rectMode(CENTER);
    stroke(pink);
    strokeWeight(5);

    if (mouseOn) {
      fill(r);
      if (clicked) {
        fill(c);
      }
    } else {
      fill(i);
    }

    rect(x, y, w, h, 20);
    fill(darkblue);
    textFont(body);
    textSize(36);
    textAlign(CENTER,CENTER);
    text(t, x, y);
  }

  void update() {
    if (mouseOver(x, y, w, h) == true) {
      mouseOn = true;
      if (click()) {
        clicked = true;
      } else {
        clicked = false;
      }
    } else {
      mouseOn = false;
    }
  }

  boolean mouseOver(float x, float y, float w, float h) {
    if (mouseX >= (x-w/2) && mouseX <= (x+w/2) && mouseY >= (y-h/2) && mouseY <= (y+h/2)) {
      return true;
    } else {
      return false;
    }
  }

  boolean click() {
    if (mouseOver(x, y, w, h) == true) {
      if (mousePressed) {
        return true;
      } else {
        return false;
      }
    } else {
      return false;
    }
  }
}

// drawGame.pde
void drawGame() {

  //draw background
  tint(60, 60, 80);
  image(chalkboard, 0, 0, width, height);

  //draw bricks
  breakout.build();

  //draw paddle and ball
  player.display();
  ball.display();
  
  fill(lightblue);
  
  textFont(body);
  textSize(20);
  textAlign(LEFT, CENTER);
  text("lives: " + str(breakout.lives), 20, height/64*63);

  textFont(body);
  textSize(20);
  textAlign(RIGHT, CENTER);
  text("points: " + str(breakout.points), width-20, height/64*63);

  if (breakout.active) {
    ball.move();

    if (breakout.paused) {
      textFont(body);
      textSize(32);
      textAlign(CENTER, CENTER);
      text("Paused", xcenter, ycenter);
    } else {
      textFont(body);
      textSize(20);
      textAlign(CENTER, CENTER);
      text("Click anywhere to pause", xcenter, height/64*63);
    }
  } else {
    ball.rest();
    breakout.reset();

    textFont(body);
    textSize(32);
    textAlign(CENTER, CENTER);
    fill(pink);
    text("Click anywhere to start", xcenter, ycenter);
  }

  if (ball.missed()) {
    breakout.active = false;
    breakout.lives -= 1;
  }

  if (ball.hitPaddle()) {
    ball.reboundPaddle();
  }

  if (ball.hitBrick()) {
    int hit = breakout.collision();

    if (bricks[hit].getStatus()) {
      bricks[hit].die();
      ball.reboundBrick();
      breakout.points();
    }
  }
  if (breakout.lives <= 0) {
    state = 3;
  }
}

// game.pde
class game {
  int points, lives;
  boolean active, paused;

  game() {
    points = 0;
    lives = 3;
    active = false;
    paused = false;
  }

  void build() {
    for (int i=0; i<(numBricks*numRows); i++) {
      bricks[i].display();
    }
  }

  void reset() {
    for (int i=0; i<(numBricks*numRows); i++) {
      bricks[i] = new brick((i%13)*60+40, (i/13)*40+30);
    }
  }
  
  void points() {
    points += int(random(18,23));
  }
  
  int collision() {
    float x,y;
    int hit;
    x = ball.getX();
    y = ball.getY();
    
    hit = 46;
    
    if (y >= 15 && y <= 45) { //Row 1
    
      if (x >= 15 && x <= 65 ) { hit = 0;} //Column 1
        else if (x >= 75 && x <= 125) { hit = 1; }
        else if (x >= 135 && x <= 185) { hit = 2; }
        else if (x >= 195 && x <= 245) { hit = 3; }
        else if (x >= 255 && x <= 305) { hit = 4; }
        else if (x >= 315 && x <= 365) { hit = 5; }
        else if (x >= 375 && x <= 425) { hit = 6; }
        else if (x >= 435 && x <= 485) { hit = 7; }
        else if (x >= 495 && x <= 545) { hit = 8; }
        else if (x >= 555 && x <= 605) { hit = 9; }
        else if (x >= 615 && x <= 665) { hit = 10; }
        else if (x >= 675 && x <= 725) { hit = 11; }
        else if (x >= 735 && x <= 785) { hit = 12; }
        
    } else if (y >= 55 && y <= 85) { //Row 2
      
      if (x >= 15 && x <= 65 ) { hit = 13;} //Column 1
        else if (x >= 75 && x <= 125) { hit = 14; }
        else if (x >= 135 && x <= 185) { hit = 15; }
        else if (x >= 195 && x <= 245) { hit = 16; }
        else if (x >= 255 && x <= 305) { hit = 17; }
        else if (x >= 315 && x <= 365) { hit = 18; }
        else if (x >= 375 && x <= 425) { hit = 19; }
        else if (x >= 435 && x <= 485) { hit = 20; }
        else if (x >= 495 && x <= 545) { hit = 21; }
        else if (x >= 555 && x <= 605) { hit = 22; }
        else if (x >= 615 && x <= 665) { hit = 23; }
        else if (x >= 675 && x <= 725) { hit = 24; }
        else if (x >= 735 && x <= 785) { hit = 25; }
        
    } else if (y >= 95 && y <= 125) {
      
      if (x >= 15 && x <= 65 ) { hit = 26;} //Column 1
        else if (x >= 75 && x <= 125) { hit = 27; }
        else if (x >= 135 && x <= 185) { hit = 28; }
        else if (x >= 195 && x <= 245) { hit = 29; }
        else if (x >= 255 && x <= 305) { hit = 30; }
        else if (x >= 315 && x <= 365) { hit = 31; }
        else if (x >= 375 && x <= 425) { hit = 32; }
        else if (x >= 435 && x <= 485) { hit = 33; }
        else if (x >= 495 && x <= 545) { hit = 34; }
        else if (x >= 555 && x <= 605) { hit = 35; }
        else if (x >= 615 && x <= 665) { hit = 36; }
        else if (x >= 675 && x <= 725) { hit = 37; }
        else if (x >= 735 && x <= 785) { hit = 38; }
      
    } else if (y >= 135 && y <= 165) {
      
      if (x >= 15 && x <= 65 ) { hit = 39;} //Column 1
        else if (x >= 75 && x <= 125) { hit = 40; }
        else if (x >= 135 && x <= 185) { hit = 41; }
        else if (x >= 195 && x <= 245) { hit = 42; }
        else if (x >= 255 && x <= 305) { hit = 43; }
        else if (x >= 315 && x <= 365) { hit = 44; }
        else if (x >= 375 && x <= 425) { hit = 45; }
        else if (x >= 435 && x <= 485) { hit = 46; }
        else if (x >= 495 && x <= 545) { hit = 47; }
        else if (x >= 555 && x <= 605) { hit = 48; }
        else if (x >= 615 && x <= 665) { hit = 49; }
        else if (x >= 675 && x <= 725) { hit = 50; }
        else if (x >= 735 && x <= 785) { hit = 51; }
      
    }
    
    return hit;
  }
}

// gameOver.pde
void gameOver() {
  //draw background
  tint(125, 125, 150);
  image(chalkboard, 0, 0, width, height);
  
  textFont(title);
  textSize(72);
  textAlign(CENTER, CENTER);
  fill(lightpink);
  text("game over!", xcenter, ycenter-150);
  fill(lightblue);
  text("final score: " + str(breakout.points), xcenter, ycenter-50);
  
  main.display();
  
  if (main.click()) {
    state = 0;
    mousePressed = false;
  }
}

// mainMenu.pde
void mainMenu() {
  tint(125, 125, 150);
  image(chalkboard, 0, 0, width, height);
  
  start.display();
  options.display();
  exit.display();
  
  //Title
  textFont(title);
  textSize(84);
  fill(darkpink);
  text("Breakout", width/2*1.01, height/5*1.02);
  fill(pink);
  text("Breakout", width/2, height/5);
  
  if (start.click()) {
    state = 2;
    breakout = new game();
    mousePressed = false;
  } else if (options.click()) {
    state = 1;
    mousePressed = false;
  } else if (exit.click()) {
    exit();
  }
}

// optionsMenu.pde
void optionsMenu() {
  //background
  tint(125, 125, 150);
  image(chalkboard, 0, 0, width, height);
  
  main.display();
  
  if (main.click()) {
    state = 0;
    mousePressed = false;
  }
}

// paddle.pde
class paddle {
  
  float x,y,w,h;
  color c;
  
  paddle() {
    x = xcenter;
    y = height/8*7;
    w = width/6;
    h = height/32;
    c = lightpink;
  }
  
  void display() {
    x = constrain(mouseX, w/2, width - w/2);
    rectMode(CENTER);
    noStroke();
    fill(c);
    rect(x,y,w,h,5);
  }
  
  
  
  float getX() {
    return x;
  }
  
  float getY() {
    return y;
  }
  
  float getW() {
    return w;
  }
  
  float getH() {
    return h;
  }
  
}
read-only archive source from /2017/Assignments/A04 - Old School Games/03-28-2017/Assignment_04/Assignment_04.pde

Description

This page is generated from the Processing project folder at /2017/Assignments/A04 - Old School Games/03-28-2017/Assignment_04/Assignment_04.pde.

Archive

Assignment_04.pde92 linesball.pde118 linesbrick.pde33 linesbutton.pde76 linesdrawGame.pde72 linesgame.pde104 linesgameOver.pde20 linesmainMenu.pde27 linesoptionsMenu.pde12 linespaddle.pde40 lines converted p5.jsjs

Assets

breakout.mp3audiochalkboard.jpgimageEraser_Regular-32.vlwfontEraser_Regular-84.vlwfontgameover.mp3audiomainmenu.mp3audio