​

function setup() {

  createCanvas(2560, 1440);

  dens = 15;

  well = createVector(random(width), random(height));

  dots = [];

  cols = ["#001219","#005f73","#0a9396","#94d2bd","#e9d8a6","#ee9b00","#ca6702","#bb3e03","#ae2012","#9b2226"];

  time = 0;

  for(x = 0; x < width / dens; x++){

    for(y = 0; y < height / dens; y++){

      dots[dots.length] = new Dot(x * dens + random(-dens, dens), y * dens + random(-dens, dens), dots.length);

    }

  }

  background("#f8edeb");

  strokeWeight(0.1);

}

​

function draw() {

  time = time + 0.001

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

    dots[i].update();

  }

}

​

class Dot {

  constructor(x, y, index){

    this.state = 0;

    this.index = index;

    this.pos1 = createVector(x, y);

    this.pos2 = createVector(x, y);

    this.vel = createVector(0, 1);

    this.aim = p5.Vector.sub(this.pos1, well);

    this.c = this.index % cols.length

  }

  update(){

    this.pos2 = createVector(this.pos1.x, this.pos1.y);

    this.aim = p5.Vector.sub(this.pos1, well);

    this.vel.setHeading((this.aim.heading() + HALF_PI + (map(noise(this.pos1.x / 250, this.pos1.y / 250,  this.c), 0, 1, -1, 1) * (map(this.aim.mag(), -10, 600, 0, 2)))));

    this.vel.setMag(map(this.aim.mag(), 0, width + width * 0.5, 1, 10));

    this.pos1.add(this.vel);

    stroke(cols[this.c]);

    line(this.pos1.x, this.pos1.y, this.pos2.x, this.pos2.y);

    if(this.pos1.x < -100 || this.pos1.x > width + 100 || this.pos1.y < - 100 || this.pos1.y > height + 100){

      this.state = floor(random(4));

      if(this.state == 0){

        this.pos1.x = 0;

        this.pos1.y = random(height);

      } else if(this.state == 1){

        this.pos1.x = random(height);

        this.pos1.y = 0;

      } else if(this.state == 2){

        this.pos1.x = width;

        this.pos1.y = random(height);

      } else if(this.state == 3){

        this.pos1.x = random(width);

        this.pos1.y = height;

      }

    }

    // line(this.pos1.x, this.pos1.y, this.aim.x, this.aim.y)

  }

}