//add images

//other kinds of obstacles

//some cars going other direction

//show lives and score on screen

//lives. start with 3 lives. after 3 collisions, game ends

//when dead, indicate game is over

//optional advanced 1: add a start and end screen

//optional advanced 2: add your own new features

​

let myCar;

let yourCar;

let cars = [];

let numberOfCars = 5;

let froggy;

​

function setup() {

  createCanvas(400, 400);

  rectMode(CENTER);

​

  for (let i = 0; i < numberOfCars; i++) {

    cars[i] = new Car();

  }

​

  froggy = new Frog();

  print(froggy.y);

}

​

function draw() {

  background(255);

​

  for (let i = 0; i < numberOfCars; i++) {

    cars[i].display();

      cars[i].drive();

    cars[i].checkCollision();

  }

​

  froggy.display();

  froggy.move();

}

​

//----CLASSES BELOW------

​

class Car {

  constructor() {

    this.c = color(random(255), random(255), random(255));

    this.x = random(width);

    this.y = random(0, height / 2);

  }

​

  display() {

    fill(this.c);

    rect(this.x, this.y, 50, 20);

  }

  drive() {

    this.x--;

​

    if (this.x < 0) {

      this.x = width;

    }

  }

  checkCollision() {

    //check to see if you've hit the frog

    //if you have hit the frog, print out "hit frog"

​

    if (dist(this.x, this.y, froggy.x, froggy.y) < froggy.w) {

      froggy.x = width / 2;

      froggy.y = height - 25;

    }

  }

}

​

class Frog {

  constructor() {

    this.x = width / 2;

    this.y = height - 25;

    this.c = color(0, 255, 0);

    this.w = 25;

  }

  display() {

    fill(this.c);

    ellipse(this.x, this.y, this.w, this.w);

  }

​

  move() {

    if (keyIsPressed == true) {

      if (keyCode === UP_ARROW) {

        this.y--;

      }

      if (keyCode === DOWN_ARROW) {

        this.y++;

      }

      if (keyCode === LEFT_ARROW) {

        this.x--;

      }

      if (keyCode === RIGHT_ARROW) {

        this.x++;

      }

    }

  }

}

​