let j = 0;

​

​

function setup() {

  createCanvas(900, 2700);

  center = createVector(width / 2, height / 2);

  cols = ["#d11100","#dd3700","#e85c00","#f48100","#ffa600","#e58800","#b04c00","#952d00"];

  curves = [];

  count = 8;

  ch = height / count;

  r1 = random(100, 200);

  r2 = random(100, 200);

  r3 = random(100, 200);

  r4 = random(100, 200);

  r5 = random(100, 200);

  r6 = random(100, 200);

  r7 = random(100, 200);

  r8 = random(100, 200);

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

    curves[i] = new Curve(width / 2, 1, curves.length);

  }

  noFill();

  strokeWeight(1);

  background("#fdfff8");

}

​

function draw() {

  for(j = 0; j < curves.length; j++){

    curves[j].update();

  }

}

​

class Curve {

  constructor(x, y, index){

    this.index = index;

    this.a1 = createVector(width / 2, -1);

    this.a2 = createVector(width / 2, y * index * ch + ch);

    this.con = createVector(width / 2, -1);

    this.c1 = createVector(0, 0);

    this.c2 = createVector(0, 0);

    this.rate = 0;

    this.c = floor(this.index)

    this.col = color(cols[this.c % cols.length]);

  }

  update(){

    stroke(this.col);

    this.con.y = this.con.y + 1;

    this.a1 = createVector(width / 2 + map(noise(this.a1.y * 0.0001 + frameCount * 0.00005 + this.index * 0.2) + noise(this.a1.y * 0.005 , this.index * 0.1) * 0.2 + noise(this.a1.y * 0.05, this.index * 0.1) * (sin(this.a1.y * 0.021 + this.index) + 1) * 0.5 * 0.05, 0, 1.3, -1, 1) * width * 0.15 + sin(this.a1.y * 0.01) * 200, this.con.y - ch / 2);

    // this.a2 = createVector(width / 2 + map(noise(this.a2.y * 0.0001 + frameCount * 0.00005) + noise(this.a2.y * 0.005) * 0.2, 0, 1.2, -1, 1) * width * 0.25, this.con.y + ch / 2);

    // this.c1 = createVector((tan(this.con.y * 0.0001 + this.index * 0.25)) * width * 0.2 + width / 2, this.con.y + ch / 4);

    // this.c2 = createVector((tan(this.con.y * 0.0001 + this.index * 0.25 + 0.1)) * width * 0.2 + width / 2, this.con.y - ch / 4);

    // bezier(this.a1.x, this.a1.y, this.c1.x, this.c1.y, this.c2.x, this.c2.y, this.a2.x, this.a2.y);

    // bezier(this.a3.x, this.a3.y, this.c1.x, this.c1.y, this.c2.x, this.c2.y, this.a4.x, this.a4.y);

    line(this.a1.x + this.index * 100 - width / 2, this.a1.y - this.index, width, this.a1.y - this.index);

    // if(this.con.y - ch / 2 > height){

    //   this.con.y = 0 - ch / 2;

    // }

  }

}