function setup() {

  createCanvas(800, 800);

  num_cells = 20;

  box_w = int(width / num_cells);

  h_box_w = int(box_w / 2);

​

  let num_connected = num_cells * 0.3;

​

  grid = [];

  for (let r = 0; r < num_cells; r++) {

    grid[r] = [];

    for (let c = 0; c < num_cells; c++) {

      grid[r][c] = {

        x: h_box_w + c * box_w,

        y: h_box_w + r * box_w,

        c: color(220),

      };

      grid[r][c].connectedTo = null;

    }

  }

​

  for (let _ = 0; _ < int(random(1, 10)); _++) {

    _r = int(random(num_cells - 1));

    _c = int(random(num_cells - 1));

    grid[_r][_c].c = color(255, 0, 255);

    grid[_r][_c].active = true;

    grid[_r][_c].idx = int(random(-20,0));

  }

​

  for (let _ = 0; _ < num_connected; _++) {

    let _r, _c, _r2, _c2;

    do {

      _r = int(random(num_cells - 1));

      _c = int(random(num_cells - 1));

      _r2 = int(random(num_cells - 1));

      _c2 = int(random(num_cells - 1));

    } while (_r == _r2 && _c == _c2);

​

    grid[_r][_c].connectedTo = { r: _r2, c: _c2 };

  }

​

  frameRate(12);

  background(20);

}

​

function draw() {

  // if (frameCount % 20 == 0)

  // background(color(20,20,20,220));

​

  background(20);

  strokeWeight(5);

  stroke(220);

​

  drawShadow(-2, -2, 4, color(255));

​

  for (let r = 0; r < num_cells; r++) {

    for (let c = 0; c < num_cells; c++) {

      // strokeWeight(5);

      let perturb = { x: 0, y: 0 };

      if (random() > 0.99) perturb = { x: random(-3, 3), y: random(-3, 3) };

​

      let p = grid[r][c];

      stroke(p.c);

      drawShadow(-2, -2, 4, p.c);

      point(perturb.x + p.x, perturb.y + p.y);

​

      if (p.active) {

        if (p.idx >= 0) {

          let _y = perturb.y + p.y + 1;

          for (let i = 0; i < p.idx; i++) {

            point(perturb.x + p.x, _y + i)

            if (_y+i> height) {

              p.idx = int(random(-20,0));

              break;

            }

          }

        }

        p.idx+=random(1,4);

      }

​

      // if (p.connectedTo != null) {

      //   let p2 = grid[p.connectedTo.r][p.connectedTo.c];

      //   push();

      //   strokeWeight(1);

      //   line(perturb.x + p.x, perturb.y + p.y, p2.x, p2.y);

      //   pop();

      // }

      // point(perturb.x + h_box_w + c * box_w, perturb.y + h_box_w + r * box_w);

    }

  }

}

​

function keyPressed() {

  if (key == "g") saveGif("dots", 10);

}

​

function drawShadow(x, y, b, c) {

  drawingContext.shadowOffsetX = x;

  drawingContext.shadowOffsetY = y;

  drawingContext.shadowBlur = b;

  drawingContext.shadowColor = c;

}

​