/* @pjs preload="original3.png"; */

PImage me;
float Wratio;
int magnitude = 1;
float mult = 323;

void setup()
{
  size(window.innerHeight, window.innerWidth * 0.7);
  background(255);
  noStroke();
  frameRate(12);
  me = loadImage("original3.png");
  me.loadPixels();
  wRatio = width/me.height;
}

void draw(){  
  float ratio = (3.83 - frameCount/10)*300;
  if (frameCount > 38) {
    ratio = noise(frameCount/10)*mult * magnitude * (sin(frameCount/20)-1);
    if (abs(ratio) <  0.1) {
      magnitude = -magnitude;
      mult = random(2000);
    }
  }
  fill(255, 30);
  rect(0,0, width, height);
  for(int x = 0; x < me.height; x++) {
    for(int y = 0; y < me.width; y++) {
      int loc = me.width * x + y;
      color c = me.pixels[loc];
      float value = red(me.pixels[loc]);
      if (value < 255 && value > 3) {
	fill(c, 60);
	float nx = noise(x/3, y/3, frameCount/1000) - 0.5;
	float ny = noise(y/3, x/3, frameCount/1000) - 0.5;
	float ns = noise(y/3+2, x/3-2.3, frameCount/100+2.5) - 0.5;
	float px = x*wRatio + nx * ratio;
	float py = y*wRatio + ny * ratio;
	float size = width/60*(255-value)/255;
	float sy = size + 30 * ns * (sin(frameCount/20)-1);
	//sy = size;
	ellipse(py,px, sy, sy);
      }
    }
  }
}