let points;

let circs;

let colors;

​

function setup() {

  // winter-night chromotome

  colors = [

    color(235,235,235,100),

    color(221,103,46,100),

    color(135,199,202,100),

  ];

  particles = [];

  angleMode(RADIANS);

  createCanvas(1000, 1000);

​

  let r = 250;

  points = [];

  for (let i = 0; i < TWO_PI; i += TWO_PI/128) {

    points.push({

      theta: i,

      step: TWO_PI / 32,

      r: r,

    });

  }

  circs = [];

  circs.push({r:0, idx:0, live:false});

  circs.push({r:0, idx:1, live:false});

  circs.push({r:0, idx:2, live:false});

  // console.log(points);

}

​

function draw() {

  background(0);

  noStroke();

  fill(color(255, 255, 255, 120));

  dline(0, height / 2, width, height / 2, 2, 1, "stippled2", false);

  dline(width / 2, 0, width / 2, height, 2, 1, "stippled2", true);

​

  if ((frameCount % 100) == 0 && !circs[0].live) {

    circs[0].live = true;

  }

  if ((frameCount % 200) == 0 && !circs[1].live) {

    circs[1].live = true;

  }

  if ((frameCount % 300) == 0 && !circs[2].live) {

    circs[2].live = true;

  }

  for (let i = 0; i < circs.length; i++) {

    let _r = random(1,10);

    if (circs[i].live) {

      drawShadow(random(-2,2), random(-2,2), random(-2,2), null);

      noStroke();

      fill(colors[circs[i].idx]);

      circle(width/2,height/2,circs[i].r);

      circs[i].r += _r;//random(50,150);

      if (circs[i].r > width*2) {

        circs[i].r = 0;

        circs[i].live = false;

      }

    }

  }

  drawShadow(2, 2, 2, null);

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

    let p = particles[i];

    fill(color(255, 255, 255, map(p.life, p.olife, 0, 255, 0)));

    stroke(color(255, 255, 255, map(p.life, p.olife, 0, 255, 0)));

    line(width/2,height/2,p.x,p.y);

    noStroke();

    circle(p.x, p.y, 5);

​

    p.x += p.vx;

    p.y += p.vy;

    p.life -= random(0.5, 4.0);

​

    if (p.life <= 0 || p.x < 0 || p.x > width || p.y < 0 || p.y > height)

      particles.splice(i, 1);

  }

​

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

//     push();

//     let p = points[i];

//     drawShadow(random(-2, 2), random(-2,2), random(-2,2), null);

//     fill(color(255,255,255,map(p.theta,0,TWO_PI,255,0)));

//     stroke(color(255,255,255,map(p.theta,0,TWO_PI,255,0)));

//     strokeWeight(random(0,1));

//     translate(width / 2, height / 2);

//     let x = (p.r+random(-100,100)) * cos(p.theta);

//     let y = (p.r+random(-100,100)) * sin(p.theta);

//     line(0, 0, x, y);

//     // dline(0, 0, x, y, 5, 1, "stippled", false);

//     p.theta += p.step;

//     if (p.theta > TWO_PI) p.theta = 0;

//     pop();

//   }

​

  if (random() > 0.2) {

    let l = random(50, 600);

    particles.push({

      x: width / 2,

      y: height / 2,

      vx: random(-2.0, 2.0),

      vy: random(-2.0, 2.0),

      life: l,

      olife: l,

    });

  }

}

​

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

  if (g != null) {

    g.drawingContext.shadowOffsetX = x;

    g.drawingContext.shadowOffsetY = y;

    g.drawingContext.shadowBlur = b;

    g.drawingContext.shadowColor = color(120); //"black";

  } else {

    drawingContext.shadowOffsetX = x;

    drawingContext.shadowOffsetY = y;

    drawingContext.shadowBlur = b;

    drawingContext.shadowColor = color(120); //"black";

  }

}

​

// dithering - https://editor.p5js.org/codingtrain/sketches/-YkMaf9Ea

function imageIndex(img, x, y) {

  return 4 * (x + y * img.width);

}

​

function getColorAtindex(img, x, y) {

  let idx = imageIndex(img, x, y);

  let pix = img.pixels;

  let red = pix[idx];

  let green = pix[idx + 1];

  let blue = pix[idx + 2];

  let alpha = pix[idx + 3];

  return color(red, green, blue, alpha);

}

​

function setColorAtIndex(img, x, y, clr) {

  let idx = imageIndex(img, x, y);

​

  let pix = img.pixels;

  pix[idx] = red(clr);

  pix[idx + 1] = green(clr);

  pix[idx + 2] = blue(clr);

  pix[idx + 3] = alpha(clr);

}

​

// Finds the closest step for a given value

// The step 0 is always included, so the number of steps

// is actually steps + 1

function closestStep(max, steps, value) {

  return round((steps * value) / 255) * floor(255 / steps);

}

​

function makeDithered(img, steps) {

  img.loadPixels();

​

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

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

      let clr = getColorAtindex(img, x, y);

      let oldR = red(clr);

      let oldG = green(clr);

      let oldB = blue(clr);

      let newR = closestStep(255, steps, oldR);

      let newG = closestStep(255, steps, oldG);

      let newB = closestStep(255, steps, oldB);

​

      let newClr = color(newR, newG, newB);

      if (newR > 10 && newG > 10 && newB > 10)

        setColorAtIndex(img, x, y, newClr);

​

      let errR = oldR - newR;

      let errG = oldG - newG;

      let errB = oldB - newB;

​

      distributeError(img, x, y, errR, errG, errB);

    }

  }

​

  img.updatePixels();

}

​

function distributeError(img, x, y, errR, errG, errB) {

  addError(img, 7 / 16.0, x + 1, y, errR, errG, errB);

  addError(img, 3 / 16.0, x - 1, y + 1, errR, errG, errB);

  addError(img, 5 / 16.0, x, y + 1, errR, errG, errB);

  addError(img, 1 / 16.0, x + 1, y + 1, errR, errG, errB);

}

​

function addError(img, factor, x, y, errR, errG, errB) {

  if (x < 0 || x >= img.width || y < 0 || y >= img.height) return;

  let clr = getColorAtindex(img, x, y);

  let r = red(clr);

  let g = green(clr);

  let b = blue(clr);

  clr.setRed(r + errR * factor);

  clr.setGreen(g + errG * factor);

  clr.setBlue(b + errB * factor);

​

  setColorAtIndex(img, x, y, clr);

}

​

// https://sighack.com/post/fifteen-ways-to-draw-a-line

function dline(x1, y1, x2, y2, weight, value, _type, dir) {

  /*

   * Draw a line from (x1, y1) to (x2, y2) with a given

   * weight and darkness (value)

   */

  strokeWeight(weight);

  let _c = color(255); //colors[1]; // color(0);

  _c._array[3] = value;

  stroke(_c);

​

  // y=mx+b

  let dy = y2 - y1;

  let dx = x2 - x1;

  let m = dy / dx;

​

  if (_type == null) line(x1, y1, x2, y2);

  else if (_type == "jagged") {

    let variance = weight / 2;

    for (let i = 0; i < 20; i++) {

      strokeWeight(random(0.1, 0.8));

      line(

        x1 + random(-variance, variance),

        y1 + random(-variance, variance),

        x2 + random(-variance, variance),

        y2 + random(-variance, variance)

      );

    }

  } else if (_type == "stippled") {

    let _x = x1;

    for (let _y = y1; _y < y2; _y++) {

      // for (let _x = x1; _x < x2; _x++) {

      _c._array[3] = random(1.0);

      fill(_c);

      noStroke();

      circle(_x, _y, random(weight / 2, weight));

      _x++;

      // }

    }

  } else if (_type == "stippled2") {

    if (dir) {

      let _x = x1;

      for (let _y = y1; _y < y2; _y += random(0.5, 3.0)) {

        // for (let _x = x1; _x < x2; _x++) {

        _c._array[3] = random(1.0);

        fill(_c);

        noStroke();

        circle(_x, _y, random(weight / 2, weight));

        _x += random(-0.2, 0.2); //0.5,3.0);

        // }

      }

    } else {

      let _y = y1;

      for (let _x = x1; _x < x2; _x += random(0.5, 3.0)) {

        // for (let _x = x1; _x < x2; _x++) {

        _c._array[3] = random(1.0);

        fill(_c);

        noStroke();

        circle(_x, _y, random(weight / 2, weight));

        _y += random(-0.2, 0.2); //0.5,3.0);

        // }

      }

    }

  }

}

​