let last_time = 0;

let theta = 0.0;

​

let pointsA_x = [];

let pointsA_y = [];

​

let pointsB_x = [];

let pointsB_y = [];

​

let pointsC_x = [];

let pointsC_y = [];

​

function setup() {

  createCanvas(600, 600);

  //initiating the first wave - second handle

  amplitudeA = height / 3;

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

    pointsA_x.push(i * width / 4);

    pointsA_y.push(0);

  }

​

  //initiating the second wave - 1.5 second handle

  amplitudeB = height / 6;

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

    pointsB_x.push(i * width / 10);

    pointsB_y.push(0);

  }

  //initiating the third wave - 2.5 second handle

  amplitudeC = height / 18;

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

    pointsC_x.push(i * width / 16);

    pointsC_y.push(0);

  }

}

​

function draw() {

  background(10, 30);

  translate(0, height / 2);

  let time_now = millis();

  if(time_now % 1000 <= 50 && time_now % 1500 <= 50 && time_now % 2500 <= 50) {

    background(255);

  }

  stroke(255);

  strokeWeight(2);

  fill(0, 0);

  //drawing the first wave

  beginShape();

  curveVertex(pointsA_x[0], pointsA_y[0]);

  for(let i = 0; i < pointsA_x.length; i ++){

    curveVertex(pointsA_x[i], pointsA_y[i]);

    if(i % 2 == 0) {

      pointsA_y[i] = amplitudeA*sin(map(time_now % 1000, 0, 1000, 0, 2*PI));

    }else {

      pointsA_y[i] = -1*amplitudeA*sin(map(time_now % 1000, 0, 1000, 0, 2*PI));

    }

  }

  curveVertex(pointsA_x[pointsA_x.length - 1], pointsA_y[pointsA_y.length - 1]);

  endShape();

  //drawing the second wave

  beginShape();

  curveVertex(pointsB_x[0], pointsB_y[0]);

  for(let i = 0; i < pointsB_x.length; i ++){

    curveVertex(pointsB_x[i], pointsB_y[i]);

    if(i % 2 == 0) {

      pointsB_y[i] = amplitudeB*sin(map(time_now % 1500, 0, 1500, 0, 2*PI));

    }else {

      pointsB_y[i] = -1*amplitudeB*sin(map(time_now % 1500, 0, 1500, 0, 2*PI));

    }

  }

  curveVertex(pointsB_x[pointsB_x.length - 1], pointsB_y[pointsB_y.length - 1]);

  endShape(); 

  //drawing the third wave

  beginShape();

  curveVertex(pointsC_x[0], pointsC_y[0]);

  for(let i = 0; i < pointsC_x.length; i ++){

    curveVertex(pointsC_x[i], pointsC_y[i]);

    if(i % 2 == 0) {

      pointsC_y[i] = amplitudeC*sin(map(time_now % 2500, 0, 2500, 0, 2*PI));

    }else {

      pointsC_y[i] = -1*amplitudeC*sin(map(time_now % 2500, 0, 2500, 0, 2*PI));

    }

  }

  curveVertex(pointsC_x[pointsC_x.length - 1], pointsC_y[pointsC_y.length - 1]);

  endShape(); 

  last_time = time_now;

}