let scl = 10;

let cols, rows;

let zoff = 0;

let fr;

let particles = [];

let flowfield;

​

function setup() {

  createCanvas(600, 400);

  cols = floor(width / scl);

  rows = floor(height / scl);

  fr = createP('');

​

  flowfield = new Array(cols * rows);

​

  for (var i = 0; i < 300; i++) {

    particles[i] = new Particle();

  }

  background(227, 115, 131);

}

​

class Particle {

  constructor() {

    this.pos = createVector(random(width), random(height));

    this.vel = createVector(0, 0);

    this.acc = createVector(0, 0);

    this.maxspeed = 4;

    this.prevPos = this.pos.copy();

  }

​

  update() {

    this.vel.add(this.acc);

    this.vel.limit(this.maxspeed);

    this.pos.add(this.vel);

    this.acc.mult(0);

  }

​

  follow(vectors) {

    var x = floor(this.pos.x / scl);

    var y = floor(this.pos.y / scl);

    var index = x + y * cols;

    var force = vectors[index];

    this.applyForce(force);

  }

​

  applyForce(force) {

    this.acc.add(force);

  }

​

  show() {

    stroke(255, 10);

    strokeWeight(1);

    line(this.pos.x, this.pos.y, this.prevPos.x, this.prevPos.y);

    this.updatePrev();

  }

​

  updatePrev() {

    this.prevPos.x = this.pos.x;

    this.prevPos.y = this.pos.y;

  }

​

  edges() {

    if (this.pos.x > width) {

      this.pos.x = 0;

      this.updatePrev();

    }

    if (this.pos.x < 0) {

      this.pos.x = width;

      this.updatePrev();

    }

    if (this.pos.y > height) {

      this.pos.y = 0;

      this.updatePrev();

    }

    if (this.pos.y < 0) {

      this.pos.y = height;

      this.updatePrev();

    }

  }

}

​

function draw() {

  var yoff = 0;

  for (var y = 0; y < rows; y++) {

    var xoff = 0;

    for (var x = 0; x < cols; x++) {

      var index = x + y * cols;

      var angle = noise(xoff, yoff, zoff) * TWO_PI * 4;

      var v = p5.Vector.fromAngle(angle);

      v.setMag(1);

      flowfield[index] = v;

      xoff += inc;

      stroke(0, 50);

    }

    yoff += inc;

​

    zoff += 0.0003;

  }

​

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

    particles[i].follow(flowfield);

    particles[i].update();

    particles[i].edges();

    particles[i].show();

  }

}