let squares = [];

let newCircle = [];

let amountofCircles =40;

​

function setup() {

  createCanvas(600, 200);

​

  // filling the array

  for (var i = 0; i < 30; i++) {

    squares[i] = new risingCube();

  }

  for (i = 0; i < amountofCircles; i++) {

    newCircle[i] = new risingCircles();

  }

}

​

function draw() {

  // sky

  background(196, 213, 221);

  newCircle[5].update();

  newCircle[10].update();

  newCircle[15].update();

  // calling update function for each building

  for (var i = 0; i < squares.length; i++) {

    squares[i].update();

  }

}

​

// defining an object called Building

// constructor code will only execute when "new Buiding" is called

class risingCube {

  constructor() {

    this.xPos = random(0, width);

    this.yPos = random(0, 190);

    this.bWidth = random(10, 25);

    this.bHeight = random(20, 50);

  }

​

  update() {

    fill(158, 186, 200);

    rect(this.xPos, this.yPos, this.bWidth, this.bHeight);

​

    this.yPos -= 6;

    if (this.yPos < -this.bHeight) {

      this.yPos = height;

    }

  }

}

​

class risingCircles {

  constructor() {

    this.xPosition = random(0, width);

    this.yPosition = 100;

    this.diameter = random(0, 200);

  }

​

  update() {

    fill(0, 0, 255);

    circle(this.xPosition, this.yPosition, this.diameter);

    this.yPosition--;

    if (this.yPosition < 0) {

      this.yPosition = height;

    }

  }

}

​