let c2;

let c3;

let counter = 0;

function setup() {

  createCanvas(400, 800);

  c1  = new Circle(width/2, height + 200, 900, 1100);

  c2  = new Circle(width/2, height , 900, 1100);

  c3  = new Circle(width/2, height - 200, 900, 1100);

}

​

function draw() {

  background(220);

  strokeWeight(0)

​

  fill(0,155,155)

  if(counter > 200){

    c3.update();

  }

  c3.draw();

  fill(155,234,155)

  if(counter > 100){

    c2.update();

  }

  c2.draw();

  fill(155,0,155)

  c1.update();

  c1.draw();

  counter++;

}

​

class Circle {

  constructor(x, y, size, maxSize){

    this.x = x;

    this.y = y;

    this.initialSize = size;

    this.maxSize = maxSize;

    this.size = size;

    this.angle = 0.0;

    this.inc = TWO_PI / 850.0;

  }

  update(){

    this.size = this.size + 1 * sin(this.angle);

    this.angle = this.angle + this.inc;

  }

  draw(){

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

  }

}