let paletteHsb = [

  [341, 92, 100],

  [245, 44, 71],

  [220, 6, 80],

  [165, 87, 100],

  [208, 33, 49],

];

let waves = [];

​

​

let blurBg = "#22223C";

​

//let backgroundColor = "#FFDBEE";

let backgroundColor = "#22223C";

​

​

function setup() {

  createCanvas(1112, 769);

    colorMode(HSB, 360, 100, 100);

  background(backgroundColor);

  const intervalY = 120;

​

  for (

    let posInY = intervalY;

    posInY < displayHeight - intervalY;

    posInY = posInY + intervalY

  ) {

    waves.push(new Wave(posInY));

  }

}

​

function draw() {

  background(backgroundColor);

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

    waves[i].display();

  }

}

​

class Wave {

  constructor(profundidad) {

    this.profundidad = profundidad / 0.5;

    this.profundidadColor = profundidad / 10;

    this.yNoise = random(3);

    this.xVertexInterval = 30;

    this.xoffDelta = 0.02;

    //drawingContext.shadowColor = color("#fff");

    //drawingContext.shadowBlur = 200;

  }

​

  display() {

    this.xNoise = 0;

    let contador = 0;

    noStroke();

    fill(328, this.profundidadColor, 140 + this.yNoise * 10);

​

    beginShape();

    //vertex(0, height);

    for (var x = 0; x <= width; x += this.xVertexInterval) {

      var y = map(noise(this.xNoise, this.yNoise), 0, 1, 0, this.profundidad);

   //   vertex(x, y);

      let cuadrado = Cuadrado.create(x, y, contador);

      cuadrado.display();

      this.xNoise += this.xoffDelta;

      ++contador;

    }

    //vertex(width, height);

    this.yNoise += 0.0024;

    endShape();

  }

}

​

class Cuadrado {

  constructor(x, y, index) {

    this.off = 0.0;

    this.x = x;

    this.y = y;

    this.color;

    this.index = index;

    this.indexInterval = 1;

  }

​

  display() {

    if (this.index % this.indexInterval == 0) {

      push();

      ellipse(

        this.x - frameCount * 0.2 + this.off,

        this.y - 120 - frameCount * 0.2 + this.off,

        5,

        //10

      );

      pop();

    }

    this.off = random(0.1, -0.1);

  }

​

  static create(x, y, index) {

    return new Cuadrado(x, y, index);

  }

}

​

​

​