let froggies;

let successSnd

let driveSnd

let car0;

let car1;

​

let cars = []

​

function preload() {

  SuccessSnd = loadSound("success.mp3")

  driveSnd = loadSound("drive by.mp3")

}

function setup() {

  createCanvas(400, 400);

  froggy = new Frog()

  froggies = new Frogs()

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

    cars[i] = new Car()

    car0 = new Car()

    car1 = new Car()

    car2 = new Car()

    car3 = new Car()

    car4 = new Cars()

    car5 = new Cars()

    car6 = new Cars()

    car7 = new Cars()

  }

  noStroke()

}

​

function draw() {

  background(220);

  fill(44,153,242)

  rect(0,0,400,400)

   fill(50,131,12)

  rect(0,25,400,400)

  fill(150)

  rect(0,50,400,150)

  rect(0,200,400,150)

  fill(255,217,30)

  rect(0,200,400,10)

  fill(255)

  rect(0,120,400,5)

  rect(0,275,400,5)

  fill(248,116,27)

  circle(10,350,15)

  circle(35,350,15)

  circle(65,350,15)

  circle(115,350,15)

  circle(155,350,15)

  circle(192,350,15)

  circle(265,350,15)

  circle(300,350,15)

  circle(345,350,15)

  circle(385,350,15)

  froggy.display()

  froggy.move()

  froggy.goal()

  froggies.display()

  froggies.move()

  froggies.goal()

  car0.display()

  car0.move()

  car0.stay()

  car0.checkCollision()

  car1.display()

  car1.move()

  car1.stay()

  car1.checkCollision()

  car2.display()

  car2.move()

  car2.stay()

  car2.checkCollision()

  car3.display()

  car3.move()

  car3.stay()

  car3.checkCollision()

  car4.display()

  car4.move()

  car4.stay()

  car4.checkCollision()

  car5.display()

  car5.move()

  car5.stay()

  car5.checkCollision()

  car6.display()

  car6.move()

  car6.stay()

  car6.checkCollision()

  car7.display()

  car7.move()

  car7.stay()

  car7.checkCollision()

}

​

class Frog {

  constructor(){

    this.x = width - 100;

    this.y = height-15;

  }

  display(){

    fill(0,100,0)

    circle(this.x,this.y,30)

  }

  move(){

    if(keyIsDown(UP_ARROW)){

      this.y-= 3

    }

    if(keyIsDown(DOWN_ARROW)){

      this.y+= 3

    }

    if(keyIsDown(LEFT_ARROW)){

      this.x-= 3

    }

    if(keyIsDown(RIGHT_ARROW)){

      this.x+= 3

    }

  }

  goal(){

    if (this.y < 0){

      this.y = height

    }

    }

  }

class Frogs{

  constructor(){

    this.x = width - 300;

    this.y = height-15;

  }

  display(){

    fill(0,255,0)

    circle(this.x,this.y,30)

  }

  move(){

     if(keyIsDown (87)){

      this.y-= 3

    }

    if(keyIsDown (83)){

      this.y+= 3

    }

    if(keyIsDown (65)){

      this.x-= 3

    }

    if(keyIsDown (68)){

      this.x+= 3

    }

  }

  goal(){

    if (this.y < 0 ){

      SuccessSnd.play()

      this.y = height

    }

}

}

class Car{

  constructor(){

    this.x = width + 50

    this.y = random(0,height-60)

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

    this.xSpeed = random(-4,-1) 

  }

  display(){

    fill(this.c)

    rect(this.x,this.y,30,20)

    rect(this.x-30, this.y,30,20)

    circle(this.x,this.y,40)

    fill(0)

    circle(this.x + 18, this.y + 20, 10)

    circle(this.x - 18, this.y + 20, 10)

  }

  move(){

    this.x = this.x + this.xSpeed

  }

  stay(){

    if (this.x < 0){

      this.x = width;

      this.xSpeed = this.xSpeed * 1

    }

    }

  checkCollision(){

    let totalDistanceBetween = dist(this.x,this.y,froggy.x,froggy.y)

    if (totalDistanceBetween < 40){

      froggy.y=height-30

    }

  }

}

class Cars{

      constructor(){

    this.x = width - 430

    this.y = random(0,height-60)

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

    this.xSpeed = random(+4,+1) 

    }

      display(){

        fill(this.c)

    rect(this.x,this.y,30,20)

    rect(this.x-30, this.y,30,20)

    circle(this.x,this.y,40)

    fill(0)

    circle(this.x + 18, this.y + 20, 10)

    circle(this.x - 18, this.y + 20, 10)

      }

      move(){

    this.x = this.x + this.xSpeed

      }

      stay(){

    if (this.x > 400){

      this.x = 0;

      this.xSpeed = this.xSpeed * 1

    }

      }

  checkCollision(){

    let totalDistanceBetween = dist(this.x,this.y,froggy.x,froggy.y)

    if (totalDistanceBetween < 40){

      froggy.y=height-30

    }

  }

}

​