let frog1;

​

function setup() {

  createCanvas(400, 400);

  rectMode(CENTER);

  // this is an instance of the object that runs the constructor of the class Car

  car1 = new Car(100, 100, color(255, 0, 0));

  car2 = new Car(200, 200, color(0, 255, 0));

  car3 = new Car(300, 300, color(0, 0, 255));

  frog1 = new Frog(width/2,height-5);

  print(car1.carX);

}

​

function draw() {

  background(220);

  car1.move();

  car1.show();

  car1.checkCollision();

  car2.move();

  car2.show();

  car2.checkCollision();

  car3.move();

  car3.show();

  car3.checkCollision();

  frog1.show();

  if (keyIsPressed==true){

    if (keyCode ==  UP_ARROW) {

      frog1.frogY-=3; 

   }

  }

  if (keyIsPressed==true){

    if (keyCode ==  DOWN_ARROW) {

      frog1.frogY+=3; 

   }

  }

}

​

// class is the cookie cutter to make individual object

class Car{

 // setup of the class, where variables are declared

  constructor(x, y, c){

    this.carX = x;

    this.carY = y;

    this.carC = c;

  }

 // this is a method, which is a function that lives under object

  move(){

    this.carX += 1;

    if (this.carX > width){

    this.carX = 0;

    }

  }

​

  show(){

    fill(this.carC);

    rect(this.carX, this.carY, 50, 25);

  }

  checkCollision(){

   if ((this.carX>frog1.frogX-25) && (this.carX<frog1.frogX+25)&&(this.carY>frog1.frogY-15)&&(this.carY<frog1.frogY+15)){

     frog1.frogY = height-10;

   }

  }

}

​

class Frog{

​

  constructor(x, y){

    this.frogX = x;

    this.frogY = y;

  }

  show(){

    fill(0,255,0);

    ellipse(this.frogX,this.frogY,30,30);

  }

}

​