let particles;

let grid;

function setup() {

  createCanvas(800, 800);

  pixelDensity(1);

  gfx = createGraphics(width, height);

  gfx.background(255);

  background(255);

​

  let y = random(height * 0.4, height * 0.6);

  noStroke();

  for (let x = 0; x < width; x++) {

    for (let _y = y; _y < height; _y++) {

      let c = map(_y, y, height, 220, 255);

      // console.log(c);

      let off = noise(x * 0.01, _y * 0.01);

      let yoff = map(off, 0.0, 1.0, -height * 0.2, height * 0.2);

​

      gfx.fill(c);

      gfx.ellipse(x, _y + yoff, 1, 1);

    }

  }

  // image(gfx, 0, 0);

​

  particles = [];

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

    particles.push({

      x: int(random(width - 1)),

      y: int(random(height - 1)),

      vx: random(-2, 2),

      vy: random(-2, 2),

      ff: random([true, false]),

    });

  }

​

  grid = [];

  for (let y = 0; y < height; y++) {

    grid[y] = [];

    for (let x = 0; x < width; x++) {

      let n = noise(x * 0.01, y * 0.01);

      let a = map(n, 0.0, 1.0, -TWO_PI, TWO_PI);

      grid[y][x] = { n: n, a: a };

    }

  }

}

​

let tc = 0;

function keyPressed() {

  if (key == "s")   save("ffwalk.png");

​

}

function draw() {

  // background(220);

  fill(color(255, 255, 255, 1));

  noStroke();

  rect(0, 0, width, height);

  gfx.loadPixels();

  loadPixels();

  if (frameCount % 100 == 0) {

    if (tc == 0) tc = 220;

    else tc = 0;

  }

  for (let p of particles) {

    let idx = getPixelID(p.x, p.y, gfx);

​

    if (

      gfx.pixels[idx] < 250 &&

      gfx.pixels[idx + 1] < 250 &&

      gfx.pixels[idx + 2] < 150

    ) {

      pixels[idx] = 220;

      pixels[idx + 1] = 0;

      pixels[idx + 2] = 220;

    } else {

      pixels[idx] = tc;

      pixels[idx + 1] = tc;

      pixels[idx + 2] = tc;

      pixels[idx + 3] = 255;

    }

​

    let a = grid[int(p.y)][int(p.x)].a;

    if (p.ff) {

      p.x += cos(a);

      p.y += sin(a);

​

      if (p.x < 0 || p.x > width - 1 || p.y < 0 || p.y > height - 1) {

        p.x = int(random(width - 1));

        p.y = int(random(height - 1));

      }

    } else {

      p.x += p.vx;

      p.y += p.vy;

      if (p.x > width - 1) {

        p.x = width - 1;

        p.vx *= -1;

      }

      if (p.x < 0) {

        p.x = 0;

        p.vx *= -1;

      }

      if (p.y < 0) {

        p.y = 0;

        p.vy *= -1;

      }

      if (p.y > height - 1) {

        p.y = height - 1;

        p.vy *= -1;

      }

    }

  }

  updatePixels();

}

function getPixelID(x, y, g) {

  const _density = pixelDensity();

  const idx = 4 * _density * (int(y) * _density * g.width + int(x));

  return idx;

}

​