​

let frogImg;

let heartImg;

​

let cars = [];

let lives = 3;

let gameover=false

let collisionTimer = 0;

​

let speedTimer=0

​

function preload() {

  frogImg = loadImage("frog.png");

  heartImg = loadImage("redheart.png");

  sound= loadSound("highwaysounds.mp3")

}

​

function setup() {

  createCanvas(400, 400);

  sound.loop()

  sound.setVolume(0.25)

  textAlign(CENTER)

​

  froggy = new Frog();

​

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

    cars[i] = new Car();

  }

}

​

function draw() {

  background(125);

  stroke(255);

  strokeWeight(3);

  line(0, 75, 400, 75);

  line(0, 150, 400, 150);

  line(0, 225, 400, 225);

  line(0, 300, 400, 300);

  noStroke()

  fill(255)

  textSize(20)

  text("click the mouse to play audio!",200,65)

​

  let isOverlap = false;

​

  noStroke();

  froggy.display();

  froggy.move();

​

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

    cars[i].checkOnScreen();

    cars[i].move();

    cars[i].display();

    let d = dist(froggy.frogx, froggy.frogy, cars[i].x, cars[i].y);

    if (d < 24) {

      isOverlap = true;

    }

  }

​

  if (lives === 3) {

    image(heartImg, 10, 10, 30, 30);

    image(heartImg, 50, 10, 30, 30);

    image(heartImg, 90, 10, 30, 30);

  } else if (lives === 2) {

    image(heartImg, 10, 10, 30, 30);

    image(heartImg, 50, 10, 30, 30);

  } else if (lives === 1) {

    image(heartImg, 10, 10, 30, 30);

  } else if (lives === 0) {

    fill('red');

    textStyle(BOLD)

    background(0);

    textSize(32);

    textAlign(CENTER, CENTER);

    text("GAME OVER!",200,200);

    return;

  }

​

  if (isOverlap && collisionTimer === 0) {

  lives -= 1;

  collisionTimer = 20;

   }

  if (collisionTimer > 0) {

  collisionTimer -= 1;

 }

}

​

  function mousePressed(){

    sound.play()

}

​

class Frog {

  constructor() {

    this.frogx = width / 2;

    this.frogy = height - 20;

  }

​

  move() {

    if (keyIsDown(UP_ARROW)) {

      this.frogy = this.frogy - 3;

    }

    if (keyIsDown(DOWN_ARROW)) {

      this.frogy = this.frogy + 3;

    }

    if (keyIsDown(LEFT_ARROW)) {

      this.frogx = this.frogx - 3;

    }

    if (keyIsDown(RIGHT_ARROW)) {

      this.frogx = this.frogx + 3;

    }

  }

​

  display() {

    image(frogImg, this.frogx, this.frogy, 40, 40);

  }

}

​

class Car {

  constructor() {

    this.x = random([25,375]);

    this.y = random(0, 350);

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

    this.xSpeed = random(-3, 3);

  }

​

  display() {

    fill(this.C);

    rect(this.x + 12.5, this.y - 10, 30, 15);

    rect(this.x, this.y, 55, 15);

    fill(0);

    circle(this.x + 10, this.y + 15, 14);

    circle(this.x + 45, this.y + 15, 14);

  }

​

  move() {

    this.x = this.x + this.xSpeed;

  }

​

  checkOnScreen() {

    if (this.x < -15) {

      this.x = 415;

    } else if (this.x > 415) {

      this.x=-15

    }

  }

} 

​