let spool;

let currentId;

let widthScalar;

let capture;

function setup() {

  createCanvas(windowWidth, windowHeight);

  capture = createCapture(VIDEO);

  capture.size(windowWidth*0.25, windowHeight*0.25);

  smooth();

  widthScalar = 1 + 600 / width;

  m = new matrix(60, 60);

  spool = new Spool(1, 0, 60 * widthScalar, {});

  noStroke();

  spool.setTarget({

    pos: createVector(width * 0.5, height * 0.5),

    id: -1

  });

  currentId = 1;

  frameRate(24);

}

​

function draw() {

  // background(230, 50);

  image(capture, 0, 0, width, height);

  tint(255,255,255,30);

  // simpleNoiseDemo();

  rainDemo();

}

​

function simpleNoiseDemo() {

​

  m.map((x, y) => {

    return {

      x,

      y,

      value: noise(x * 0.02, y * 0.02, frameCount * 0.1) * 255,

      px: 10

    };

  }, m.drawSquare);

}

​

function rainDemo() {

  spool.addItem(frameCount, new Unit(currentId++, 1, createVector(random(width+100) - 50, random(height * 2) - 500), ceil(random(8)) * widthScalar + 8));

  spool.map((obj) => {

    if (obj) {

      let moveX = (noise(obj.pos.x, obj.pos.y, obj.size + frameCount * 0.001) - (random(0.5)+0.25)) * obj.size * 0.4;

      let moveY = (random(1.5) ) * obj.size * 0.5;

      obj.move(createVector(moveX, moveY));

      if (frameCount % 240 == 0)

        obj.sizeDecay();

      spool.map((obj2) => {

        if (obj.checkCollide(obj2) && obj.id != obj2.id) {

          if (obj.size > obj2.size) {

            obj.absorb(obj2);

            spool.deleteItem(obj2.id);

          } else {

            obj2.absorb(obj);

            spool.deleteItem(obj.id);

          }

        }

      });

      fill(obj.fill, obj.fill, 255);

      blendMode(LIGHTEST)

      circle(obj.pos.x, obj.pos.y, obj.size);

      blendMode(BLEND)

    }

  });

}