const mono = ["#202020", "#333333", "#666666", "#999999", "#cccccc"];

let palette1, palette2;

​

let grid;

let particles;

let cparticles;

let noiseLvl;

let gfx;

let off;

let windowScale;

function setup() {

  createCanvas(1000, 1000);

  windowScale = width / 1000;

  off = width * 0.01;

  noiseDetail(random(2,24), random());

  gfx = createGraphics(width-2*off,height-2*off);

  noiseLvl = random(0.1,0.001);

  palette1 = mono;

  palette2 = cc239;//random([cc239, mono]);

  // if (palette1 == cc239)

  //   palette2 = mono;

  // else

  //   palette2 = cc239;

  let idx = random(palette1.length - 1) | 0;

  let bgcol = palette1[idx];

  background(color(bgcol));

  // drawingContext.fillStyle = color(palette[idx]);

  palette1.splice(idx, 1);

​

  grid = [];

  for (let r = 0; r < gfx.height; r++) {

    grid[r] = [];

    for (let c = 0; c < gfx.width; c++) {

      n = noise(c*noiseLvl, r*noiseLvl);

      grid[r][c] = {

        n: map(n,0.0,1.0,0.0,TWO_PI),

        visited: false,

      }

      // grid[r][c] = {

      //   n: Math.ceil((map(n, 0.0, 1.0, 0.0, TWO_PI) * (PI / 4)) / (PI / 4)),

      //   visited: false,

      // };

    }

  }

​

  particles = [];

  cparticles = [];

​

  let r = gfx.width / 6;

  let step = PI / 256;

  let midx = gfx.width / 2;

  let midy = gfx.height / 2;

  gfx.fill(color(random(palette2)));

  gfx.noStroke();

  gfx.circle(80, 80, 25*2);//r * 2);

  gfx.rectMode(CENTER);

  gfx.square(midx, midy, r*2);

  for (let _ = 0; _ < 25000 * windowScale; _++) {

    let life = random(width, width * 3);

    particles.push({x:int(random(gfx.width)), y: int(random(gfx.height)), life: life, olife: life, col: random(palette1)});

  }

  // square

  for (let x = midx-r; x < midx+r; x++) {

    let y1 = midy-r;

    let y2 = midy+r;

    let life = random(gfx.width, gfx.width * 3);

    cparticles.push({

      x: x,

      y: y1,

      life: life,

      olife: life,

      col: random(palette2),

    });

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

      cparticles.push({

        x: int(random(x - 5 * windowScale, x + 5 * windowScale)),

        y: int(random(y1 - 5 * windowScale, y1 + 5) * windowScale),

        life: life,

        olife: life,

        col: random(palette2),

        col2: random(palette2),

        transition: true,//random([true,false,false]),

      });

    }

    cparticles.push({

      x: x,

      y: y2,

      life: life,

      olife: life,

      col: random(palette2),

    });

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

      cparticles.push({

        x: int(random(x - 5 * windowScale, x + 5 * windowScale)),

        y: int(random(y2 - 5 * windowScale, y2 + 5 * windowScale)),

        life: life,

        olife: life,

        col: random(palette2),

        col2: random(palette2),

        transition: true,//random([true,false,false]),

      });

    }

  }

  for (let y = midy-r; y < midy+r; y++) {

    let x1 = midx-r;

    let x2 = midx+r;

    let life = random(gfx.width, gfx.width * 3);

    cparticles.push({

      x: x1,

      y: y,

      life: life,

      olife: life,

      col: random(palette2),

    });

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

      cparticles.push({

        x: int(random(x1 - 5 * windowScale, x1 + 5 * windowScale)),

        y: int(random(y - 5 * windowScale, y + 5 * windowScale)),

        life: life,

        olife: life,

        col: random(palette2),

        col2: random(palette2),

        transition: true,//random([true,false,false]),

      });

    }

    cparticles.push({

      x: x2,

      y: y,

      life: life,

      olife: life,

      col: random(palette2),

    });

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

      cparticles.push({

        x: int(random(x2 - 5 * windowScale, x2 + 5 * windowScale)),

        y: int(random(y - 5 * windowScale, y + 5 * windowScale)),

        life: life,

        olife: life,

        col: random(palette2),

        col2: random(palette2),

        transition: true,//random([true,false,false]),

      });

    }

  }

  // circle

  for (let t = 0; t < TWO_PI; t += step) {

    let x = (80 + 25 * cos(t)) | 0;

    let y = (80 + 25 * sin(t)) | 0;

​

    let life = random(gfx.width, gfx.width * 3);

    cparticles.push({

      x: x,

      y: y,

      life: life,

      olife: life,

      col: random(palette2),

    });

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

      cparticles.push({

        x: int(random(x - 5, x + 5)),

        y: int(random(y - 5, y + 5)),

        life: life,

        olife: life,

        col: random(palette2),

        col2: random(palette2),

        transition: true,//random([true,false,false]),

      });

    }

  }

  // imageMode(CENTER);

  drawingContext.shadowOffsetX = 0;

  drawingContext.shadowOffsetY = 0;

  drawingContext.shadowBlur = 20;

  drawingContext.shadowColor = 'black';

}

​

let step = 0;

function draw() {

  for (let i = particles.length - 1; i >= 0; i--) {

    let p = particles[i];

​

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

    grid[int(p.y)][int(p.x)].visited = true;

    let xstep = cos(angle);

    let ystep = sin(angle);

​

    let a = 40;

    if (step == 1) a = 255;

    let c = color(p.col);

    if (step == 1 && p.transition) 

      c = lerpColor(color(p.col), color(p.col2), map(p.life,p.olife/2,0,0.0,1.0));//,0.0));

    c.setAlpha(a);

    gfx.stroke(c);

    drawPoint(p.x, p.y, gfx);

    // gfx.point(p.x, p.y);

​

    p.x += xstep;

    p.y += ystep;

​

    // p.x = Math.ceil(p.x);// | 0;

    // p.y = Math.ceil(p.y);// | 0;

​

    p.life--;

    if (

      p.life <= 0 ||

      p.x < 0 ||

      p.x > gfx.width - 1 ||

      p.y < 0 ||

      p.y > gfx.height - 1

    )

      particles.splice(i, 1);

    else {

      if (grid[int(p.y)][int(p.x)].visited && step == 0) particles.splice(i, 1);

    }

  }

  background(220);

  image(gfx,off,off);

  if (particles.length == 0) {

    if (step == 0) {

      particles = cparticles;

      step++;

      // for (let r = 0; r < grid.length; r++) {

      //   for (let c = 0; c < grid[0].length; c++) {

      //     grid[r][c].visited = false;

      //   }

      // }

    } else {

      console.log("donzo");

      noLoop();

    }

  }

}

​

function drawPoint(x, y, g) {

  g.point(x, y);

  // for (let _ = 0; _ < random(0,5); _++) {

  //   g.point(x+random(-3,3)*windowScale, y+random(-3,3)*windowScale);

  // }

}

​