let neighbors = [];

let toDraw = [];

let img;

let scl = 1;

let space = 5;

let sizeMax = 5;

let dotsFill;

let current;

let next;

let endLine;

let nL = 1; // neighbors lvl

let border = 10;

let eachFrame = 1; // how many line to draw in each frame

let clrP = [];

let clrRNG = 25;

​

function preload() {

  img = loadImage("ds.jpg");

}

​

function setup() {

  createCanvas(img.width * scl + 2 * border, img.height * scl + 2 * border);

  img.resize(width - 2 * border, height - 2 * border);

  //img.filter(POSTERIZE,3);

​

  background(0);

  for (let i = border; i <= width - 2 * border; i += space) {

    for (let j = border; j <= height - 2 * border; j += space) {

      x = i + int(0.5 * space);

      y = j + int(0.5 * space);

      clr = img.get(x, y);

      gclr = r2g(clr);

      dotsFill = int(map(gclr, 0, 255, 0, sizeMax));

      //dotsFill = sizeMax- dotsFill;

      meshFill(i, j, dotsFill, clr);

    }

  }

​

  function r2g(c) {

    return int(c[0] * 0.23 + c[1] * 0.7 + c[2] * 0.07);

    // .2126 * red + .7152 * green + .0722 * blue

  }

​

  function meshFill(x, y, dotsFill, clr) {

    for (let i = 1; i <= dotsFill; i++) {

      dotScreen.push(new dots(x, y, space, clr));

    }

  }

}

​

function draw() {

  //stroke(0, 50);

  let fc = frameCount;

​

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

    toDraw = dotScreen.filter((x) => x.connected == false);

​

    if (toDraw.length == 0) {

      console.log("Completed");

      noLoop();

    } else {

      if (fc == 1 || endLine == true) {

        current = toDraw[int(random(toDraw.length))];

        current.connected = true;

        endLine = false;

      } else {

        neighbors = toDraw.filter(

          (x) =>

            0 <= abs(x.ix - current.ix) &&

            abs(x.ix - current.ix) <= nL &&

            x !== current &&

            0 <= abs(x.iy - current.iy) &&

            abs(x.iy - current.iy) <= nL &&

            x !== current

        );

        if (neighbors.length == 0) {

          endLine = true;

        } else {

          stroke(255, 50);

          strokeWeight(1);

          next = neighbors[int(random(neighbors.length))];

          line(current.x, current.y, next.x, next.y);

​

          next.connected = true;

          current = next;

        }

      }

    }

  }

}

​

class dots {

  constructor(x, y, space, clr) {

    //let xoffset = space / 2; //random(space);

    //let yoffset = space / 2; //random(space);

    this.x = x + border - 0.5 * space;

    this.y = y + border - 0.5 * space;

    this.ix = int(x / space);

    this.iy = int(y / space);

    this.connected = false;

    this.clr = clr;

  }

}

​