let frog1;

let scene = 1;

​

function setup() {

  createCanvas(600, 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));

​

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

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

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

​

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

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

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

​

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

}

​

function draw() {

  background(220);

​

​

  if (scene == 1) {

    Scene1();

  } else if (scene == 2) {

    Scene2();

  } else if (scene == 3) {

    Scene3();

  } else if (scene == 4) {

    scene = 1;

  }

​

frog1.show();

​

if (keyIsPressed == true) {

  if (keyCode == UP_ARROW) {

    frog1.frogY -= 3;

  }

}

if (keyIsPressed == true) {

  if (keyCode == DOWN_ARROW) {

    frog1.frogY += 3;

  }

}

​

if (frog1.frogY < 0) {

  frog1.frogY = height;

  scene++;

}

print(scene);

}

​

​

function Scene1() {

  car1.move();

  car1.show();

  car1.checkCollision();

​

  car2.move();

  car2.show();

  car2.checkCollision();

​

  car3.move();

  car3.show();

  car3.checkCollision();

}

​

function Scene2() {

  car4.move();

  car4.show();

  car4.checkCollision();

​

  car5.move();

  car5.show();

  car5.checkCollision();

​

  car6.move();

  car6.show();

  car6.checkCollision();

}

​

function Scene3() {

  car7.move();

  car7.show();

  car7.checkCollision();

​

  car8.move();

  car8.show();

  car8.checkCollision();

​

  car9.move();

  car9.show();

  car9.checkCollision();

}

// 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);

  }

}