let currentBlob;

let topWid = 50000;

let currentWid;

let d;

let cBlob;

let cBack;

let cTrans;

​

let blobR = 145;

let blobG = 209;

let blobB = 86;

let transR = 255;

let transG = 46;

let transB = 196;

​

function setup() {

  noSmooth();

  pixelDensity(0.3);

  d = pixelDensity();

  createCanvas(550, 550);

  background(0);

  updatePixels();

}

​

function draw() {

  blobCount();

  blobMeasure();

  noStroke();

  fill(0);

  circle(mouseX,mouseY,50);

  topBlob = 2000 + second()*150

  loadPixels();

  if (currentBlob <= topBlob)

    expand(1-currentBlob/topBlob);

  else

    contract(1-topBlob/currentBlob);

  //expand(1-currentWid/topWid);

​

  updatePixels();

  textAlign(CENTER,CENTER);

  textSize(100);

  fill(blobR,blobG,blobB);

  textFont("Verdana");

  let hours = hour()%12;

  if (hours == 0) hours = 12;

  if(hours >= 10) text(int(hours/10) +""+ hours%10 + ":" + int(minute()/10) +""+ minute()%10, width/2,height/2);

  else text(" " + hours%10 + ":" + int(minute()/10) +""+ minute()%10, width/2,height/2);

}

​

//counting how many pixels are in the blob

function blobCount()

{

  currentBlob = 0;

  for (let i = 0; i < pixels.length; i+=4)

  {

    if (pixels[i]     == blobR &&

        pixels[i + 1] == blobG &&

        pixels[i + 2] == blobB)

      currentBlob++;

  }

}

​

function blobMeasure()

{

  let first = pixels.length;

  let last = 0;

  for (let i = 0; i < pixels.length; i+=4)

  {

    if (pixels[i]     == blobR &&

        pixels[i + 1] == blobG &&

        pixels[i + 2] == blobB) {

      if (i < first) first = i;

      if (i > last) last = i;

    }

  }

  currentWid = last - first;   

}

​

//expanding the blob

function expand(speed) {

  for (let i = 0; i < width * d; i++)

    for (let j = 0; j < height * d; j++) {

      let off = (j * width * d + i) * 4; //with help from p5.js reference

      //set red transitionary pixels black

      if (pixels[off]   == transR &&

        pixels[off + 1] == transG &&

        pixels[off + 2] == transB) 

      {

        pixels[off]     = blobR;

        pixels[off + 1] = blobG;

        pixels[off + 2] = blobB;

      }

      //add new pixels to the blob by making them red

      if (check(i, j) && random(0,0.5)<speed) { 

        pixels[off]     = transR;

        pixels[off + 1] = transG;

        pixels[off + 2] = transB;

      }

    }

  /*

  for (let i = 0; i < width * d; i++)

    for (let j = 0; j < height * d; j++) {

      let off = (j * width * d + i) * 4;

      if (pixels[off] == 255 &&

        pixels[off + 1] == 0 &&

        pixels[off + 2] == 0) pixels[off] = 0;

    }*/

​

}

​

function contract(speed) {

  for (let i = 0; i < width * d; i++)

    for (let j = 0; j < height * d; j++) {

      let off = (j * width * d + i) * 4; //with help from p5.js reference

      //set red transitionary pixels black

      if (pixels[off]   == transR &&

        pixels[off + 1] == transG &&

        pixels[off + 2] == transB) 

      {

        pixels[off]     = 0;

        pixels[off + 1] = 0;

        pixels[off + 2] = 0;

      }

      //take new pixels from the blob by making them red

      if (check2(i, j) && random(0,1)<speed) { 

        pixels[off]     = transR;

        pixels[off + 1] = transG;

        pixels[off + 2] = transB;

      }

    }

}

​

//checking a certain pixel to decide whether it should be added to the blob

function check(i, j) {

  let off = (j * width * d + i) * 4; //with help from p5.js reference, pixels  

  //if neighboring pixels are black

  /*

  let probability = (

    checkNeighbor(i, j, 0, 1)*2 +

    checkNeighbor(i, j, 0, -1)*2 +

    checkNeighbor(i, j, 1, 0)*2 +

    checkNeighbor(i, j, 1, 1) +

    checkNeighbor(i, j, 1, -1) +

    checkNeighbor(i, j, -1, 0)*2 +

    checkNeighbor(i, j, -1, 1) +

    checkNeighbor(i, j, -1, -1)) /12

    */

  let mult = 2

  let probability = (

    checkNeighbor(i, j, 0, 1)*mult +

    checkNeighbor(i, j, 0, -1)*mult +

    checkNeighbor(i, j, 1, 0)*mult +

    checkNeighbor(i, j, -1, 0)*mult +

    checkNeighbor(i, j, -1, 1)*mult +

    checkNeighbor(i, j, 1, 1)*mult +

    checkNeighbor(i, j, 1, -1)*mult +

    checkNeighbor(i, j, -1, -1)*mult +

    checkNeighbor(i, j, 0, 2) +

    checkNeighbor(i, j, 0, -2) +

    checkNeighbor(i, j, 2, 0) +

    checkNeighbor(i, j, -2, 0) +

    checkNeighbor(i, j, -2, 2) +

    checkNeighbor(i, j, 2, 2) +

    checkNeighbor(i, j, 2, -2) +

    checkNeighbor(i, j, -2, -2)) /((mult+1)*8)

​

  return ((pixels[off] < blobR &&

    pixels[off + 1]    < blobG &&

    pixels[off + 2]    < blobB) && //if pixel is darker than blob color

    (pixels[off]      < transR ||

    pixels[off + 1]   < transG ||

    pixels[off + 2]   < transB) && //if pixel is darker than transition color

    (random(0.2,1)*(noise(i,j)*0.8+0.2) < probability)) //probablility based on number of neighboring blob pixels

}

​

function check2(i,j) {

  let off = (j * width * d + i) * 4;

  let probability = (

    checkNeighbor2(i, j, 0, 1) +

    checkNeighbor2(i, j, 0, -1) +

    checkNeighbor2(i, j, 1, 0) +

    checkNeighbor2(i, j, -1, 0) +

    checkNeighbor2(i, j, -1, 1) +

    checkNeighbor2(i, j, 1, 1) +

    checkNeighbor2(i, j, 1, -1) +

    checkNeighbor2(i, j, -1, -1))/8 ;

  return (pixels[off]   > 0 &&

        pixels[off + 1] > 0 &&

        pixels[off + 2] > 0 &&

    (random(0.2,1)*(noise(i,j)*0.8+0.2) < probability)) //probablility based on number of neighboring blob pixels

}

​

//checking neighboring pixel

function checkNeighbor(i, j, a, b) {

  //test if i+a,j+b is off the edge;

  if (i+a >= width || i+a <= 0 || j+b >= height || j+b <= 0) return false;

  let off = ((j + b) * width * d + (i + a)) * 4;

  return (pixels[off] == blobR &&

    pixels[off + 1]   == blobG &&

    pixels[off + 2]   == blobB)

}

​

function checkNeighbor2(i, j, a, b) {

  //test if i+a,j+b is off the edge;

  if (i+a >= width || i+a <= 0 || j+b >= height || j+b <= 0) return false;

  let off = ((j + b) * width * d + (i + a)) * 4;

  return (pixels[off] == 0 &&

    pixels[off + 1]   == 0 &&

    pixels[off + 2]   == 0)

}