Marioooo_Christina Bae

// object-oriented programming (OOP)

// is programming using OBJECTS

// objects are pieces of computer code 

// that contain both functions *and* data

//

// objects in javascript are accessed through

// things called "classes"

// classes have methods which are functions

// classes have properties which are variables

// classes also have a constructor function which runs

// when you make one. this is called instantiation.

​

var NUMROWS = 5;

var NUMCOLUMNS = 10;

var BWIDTH = 40;

var BHEIGHT = 15;

var BHSPACING = 5;

var BVSPACING = 5;

​

var TOTALLIVES = 5;

var NUMLIVES;

​

var LEFTWALL, RIGHTWALL, TOPWALL, BOTTOMWALL; // these are walls

​

var bricks = []; // array to hold all the bricks

var ball; // variable to contain a ball

var paddle; // variable to contain the paddle

​

var isplaying = false; // ARE WE PLAYING THE GAME?

​

var bsound

​

function preload() {

  backgroundd = loadImage("backmario.png");

  brickss = loadImage("mariobrick.png");

  mario= loadImage("mario.png");

  bsound = loadSound("mariojump .m4a");

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  LEFTWALL = width*0.2;

  RIGHTWALL = width*0.8;

  TOPWALL = height*0.1;

  BOTTOMWALL = height*0.9;

  textSize(60);

}

​

function draw() {

  background(0);

  if(!isplaying) // STARTUP SCREEN

  {

    fill(255);

    textAlign(CENTER);

    if(frameCount%60>30) text('MARIOOOOO', width/2, height/2);

  }

  if(isplaying) // MAIN GAME LOOP

  {

    background('lightblue');

    drawWallsScore(); // draw the walls and score

    paddle.move(mouseX-paddle.w/2); // move the paddle

​

    // draw the bricks and collision detect:

    for(let i = bricks.length-1;i>=0;i--) // go through the bricks backwards

    {

      bricks[i].draw(); // draw them

      if(bricks[i].collide(ball)) // see if the ball is hitting them

      {

        ball.bounce(bricks[i]);

        ball.velocity*=1.01; // make it faster

        bsound.play();

      }

      if(bricks[i].alive==false) // KILL THE BRICK

      {

        bricks.splice(i, 1); // deleted

      }

    }

​

    if(paddle.collide(ball)) {

      ball.bounce(paddle);

      ball.angle+=map(ball.x-paddle.x,0,paddle.w,-0.3, 0.3);

      // psound.play();

    }

​

    ball.draw(); // draw the ball

    paddle.draw(); // draw the paddle

  }

}

​

function keyTyped() {

  restartGame();

}

​

function restartGame() {

  NUMLIVES = TOTALLIVES; // reset the lives

​

  bricks = []; // reinitialize the bricks array

  var TOTALWIDTH = (BWIDTH+BHSPACING)*NUMCOLUMNS; // how many pixels wide is all the bricks

  var offsetx = (width-TOTALWIDTH)/2;

  var offsety = TOPWALL+BHEIGHT*5;  

  for(let i = 0;i<NUMROWS*NUMCOLUMNS;i++)

  {

    let c = i%NUMCOLUMNS;

    let r = floor(i/NUMCOLUMNS);

    bricks[i] = new Brick(c*(BWIDTH+BHSPACING) + offsetx, r*(BHEIGHT+BVSPACING) + offsety, BWIDTH, BHEIGHT);

  } 

  // make a new ball:

  ball = new Ball();

  // make a new paddle:

  paddle = new Paddle();

  isplaying = true; // we are playing

}

​

function drawWallsScore() {

  // draw the number of bricks we've deleted (the score) and lives:

  fill(255);

  text(NUMROWS*NUMCOLUMNS-bricks.length, width*0.1, height*0.2);

  text(NUMLIVES, width*0.9, height*0.2);

  // draw the walls:

  fill("darkblue");

  rect(LEFTWALL, TOPWALL, 10, BOTTOMWALL-TOPWALL);

  rect(RIGHTWALL, TOPWALL, 10, BOTTOMWALL-TOPWALL);

  rect(LEFTWALL, TOPWALL, RIGHTWALL-LEFTWALL, 10);

  rect(LEFTWALL, BOTTOMWALL, RIGHTWALL-LEFTWALL, 10);

  if(NUMLIVES<=4){

  LEFTWALL = width*0.2;

  RIGHTWALL = width*0.8;

  TOPWALL = height*0.1;

  BOTTOMWALL = height*0.9;

    scale(0.9);

  rect(LEFTWALL, TOPWALL, 8, BOTTOMWALL-TOPWALL);

  rect(RIGHTWALL, TOPWALL, 8, BOTTOMWALL-TOPWALL);

  rect(LEFTWALL, TOPWALL, RIGHTWALL-LEFTWALL, 8);

  rect(LEFTWALL, BOTTOMWALL, RIGHTWALL-LEFTWALL, 8);

    }

  if(NUMLIVES<=2){

  LEFTWALL = width*0.2;

  RIGHTWALL = width*0.8;

  TOPWALL = height*0.1;

  BOTTOMWALL = height*0.9;

     scale(0.85);

  rect(LEFTWALL, TOPWALL, 5, BOTTOMWALL-TOPWALL);

  rect(RIGHTWALL, TOPWALL, 5, BOTTOMWALL-TOPWALL);

  rect(LEFTWALL, TOPWALL, RIGHTWALL-LEFTWALL, 5);

  rect(LEFTWALL, BOTTOMWALL, RIGHTWALL-LEFTWALL, 5);

     }

}

​

​

// this is going to be a class definition for the bricks:

class Brick {

  // constructor: runs when you instantiate the class ("new" on a object)

  constructor(x=width/2,y=height/2,w=10,h=10)

  {

    // set some properties:

    this.x = x;

    this.y = y;

    this.w = w;

    this.h = h;

    this.alive = true;

  }

  // add some methods:

  draw() // draws the brick every frame

  {

​

    image(brickss,this.x,this.y,30,30);

  }

  collide(_ball) // check whether brick is touching the ball (argument)

  {

    if(_ball.x>this.x&&_ball.x<(this.x+this.w)&&_ball.y>this.y&&_ball.y<(this.y+this.h))

    {

      // COLLISION!!!!!!!!!

      this.alive = false;

      return(true);

    }

    else

    {

      return(false);

    }

  }

}

​

// this is going to be a class definition for the ball:

class Ball {

  // constructor: runs when you instantiate the class ("new" on a object)

  constructor(x=width/2,y=height*2/3,v=10,a=random(PI, TWO_PI))

  {

    // set some properties:

    this.x = x;

    this.y = y;

    this.px = x;

    this.py = y;

    this.velocity = v;

    this.angle = a;

  }

  // add some methods:

  draw()

  {

    fill(255);

    imageMode(CENTER);

    image(mario,this.x,this.y,31,34);

    this.px = this.x;

    this.py = this.y;

    this.x = this.x + this.velocity * cos(this.angle);

    this.y = this.y + this.velocity * sin(this.angle);

    // make the ball bounce off the walls:

    if(this.x>RIGHTWALL) {

      this.angle = PI - this.angle;

      bsound.play();

    }

    if(this.x<LEFTWALL) {

      this.angle = PI - this.angle;

      bsound.play();

    }

    if(this.y>BOTTOMWALL) {

      this.angle = TWO_PI - this.angle;

      bsound.play();

      NUMLIVES--;

      if(NUMLIVES<1) isplaying=false;

    }

    if(this.y<TOPWALL) {

      this.angle = TWO_PI - this.angle;

      bsound.play();

    }

  }

  bounce(_brick)

  {

    if(this.px>_brick.x) this.angle = PI - this.angle;

    if(this.px<_brick.x+_brick.w) this.angle = PI - this.angle;

    if(this.py>_brick.y) this.angle = TWO_PI - this.angle;

    if(this.py<_brick.y+_brick.h) this.angle = TWO_PI - this.angle;

  }

}

​

// this is going to be a class definition for the paddle:

class Paddle {

  // constructor: runs when you instantiate the class ("new" on a object)

  constructor(x=width/2,y=BOTTOMWALL*0.9,w=60,h=10)

  {

    // set some properties:

    this.x = x;

    this.y = y;

    this.w = w;

    this.h = h;

  }

  // add some methods:

  draw() // draws the paddle every frame

  {

    fill("darkblue");

    rect(this.x,this.y,this.w,this.h);

  }

  move(_x)

  {

    this.x = constrain(_x,LEFTWALL,RIGHTWALL-this.w);

  }

  collide(_ball) // check whether brick is touching the ball (argument)

  {

    if(_ball.x>this.x&&_ball.x<(this.x+this.w)&&_ball.y>this.y&&_ball.y<(this.y+this.h))

    {

      // COLLISION!!!!!!!!!

      return(true);

    }

    else

    {

      return(false);

    }

  }

}

​

​

​

​