let pic1;

let pic2;

var swap=true;

function preload() {

  img = loadImage('me.png');

  //pic1= createImage(img.width, img.height)

}

​

function setup() {

  img.resize(300,400);

  createCanvas(300, 400);

  background(220);

 // image(img, 0,0);

  img.loadPixels();

  pic1 = createImage(300*2, 400*2);

​

​

  //console.log(img.pixels[4843]);

  //filter(GRAY);

  image(img, 0,0);

  filter(GRAY);

  filter(INVERT);

  filter(BLUR, 3);

  filter(INVERT);

   filter(THRESHOLD, 0.4);

  loadPixels();

  pic1.loadPixels();

   for(var i=0; i<pixels.length; i+=1)

   {

  pic1.pixels[i]=pixels[i]; 

    }

updatePixels();

 pic1.updatePixels();

  background(250);

 // pic1.updatePixels()

  //pic1.loadPixels();

  pic1.resize(300,400);

  //image(pic1, 0,0);

  pic1.loadPixels();

  pic2=createImage(pic1.width, pic1.height);

  pic2.loadPixels();

  count=0;

  for(var i=0; i<pic1.height; i++)

  {

  for(var j=0; j<pic1.width; j++)

          {

        if(pic1.pixels[count]<=200)

        {

        if(checkNeighbors(i,j))

           {

        pic2.pixels[count]=0;

        pic2.pixels[count+1]=0;

        pic2.pixels[count+2]=0;

        pic2.pixels[count+3]=255;

          }

      else

      {

       pic2.pixels[count]=250;

        pic2.pixels[count+1]=250;

        pic2.pixels[count+2]=250;

        pic2.pixels[count+3]=255;    

      }

        }

        count+=4;

          }

         }

  console.log("COMPLETE");

  pic2.updatePixels();

  //image(pic1,0,0);

  image(pic2, 0,0);

}

​

function mousePressed()

{

if(swap)

{

swap=!swap;

image(pic1,0,0);

}

else

{

swap=!swap;

image(pic2,0,0);

}

}

​

function draw() {

//   image(pic1,0,0);

// ind=(mouseY* pic1.width + mouseX)*4;

//   r=pic1.pixels[ind];

//   g=pic1.pixels[ind+1];

//   b=pic1.pixels[ind+2];

//   avg=(r+g+b)/3

//   console.log(avg);

​

​

}

​

// Returns true if at least 1 neighbor is white

function checkNeighbors(y,x)

{

var wht=false;

var ind1, ind2, ind3, ind4;        // Indeces of pixls

var r1, r2, r3, r4;                // Reds

var g1, g2, g3, g4;               // greens

var b1, b2, b3, b4;               // Blues

​

​

​

​

pic1.loadPixels();

if(x>1 && x<pic1.width-1 && y>0 && y<pic1.height-1)

{

ind1=(y* pic1.width + (x-1))*4;

r1=pic1.pixels[ind1];

g1=pic1.pixels[ind1+1];  

b1=pic1.pixels[ind1+2];

avg1= (r1+g1+b1)/3;

​

ind2=(y* pic1.width + (x+1))*4;

r2=pic1.pixels[ind2];

g2=pic1.pixels[ind2+1];  

b2=pic1.pixels[ind2+2];

avg2= (r2+g2+b2)/3;

ind3= ((y-1)  * pic1.width + x)*4;

r3=pic1.pixels[ind3];

g3=pic1.pixels[ind3+1];  

b3=pic1.pixels[ind3+2];

avg3= (r3+g3+b3)/3;

ind4=((y+1)* pic1.width + x)*4;

r4=pic1.pixels[ind4];

g4=pic1.pixels[ind4+1];  

b4=pic1.pixels[ind4+2]; 

avg4 = (r4+g4+b4)/3;

​

thresh=200;

//if(floor(brightness(color(r1,g1,b1)))>=thresh)

    if(avg1>=thresh)

      {

      wht=true;

      }

else 

{

//if(floor(brightness(color(r2,g2,b2)))>=thresh)

  if(avg2>=thresh)

      {

      wht=true;

      }

else 

{

//if(floor(brightness(color(r3,g3,b3)))>=thresh)

  if(avg3>=thresh)

      {

      wht=true;  

      }

else 

{

//if(floor(brightness(color(r4,g4,b4)))>=thresh)

  if(avg4>=thresh)

      {

      wht=true;  

      }

else {

 // console.log("BLACK");  

}

    }

  }

 }

}

//pic1.updatePixels();

return wht; 

}

​