// Dust to Human -- by John Clavin
// August 28, 2016

var human;
var controlCounter;

function preload() {
  human = loadImage("human2.jpg");
}

var dust;

function setup() {
  createCanvas(532, 640);
  frameRate(30);
  controlCounter = 0;
  rectMode(CENTER);
  dust = new Dust();
  human.loadPixels();
  for (var i = 0; i < 2800; i++) {
    var rndX = int(random(532));
    var rndY = int(random(640));
    var pixelNumber = (rndY * width + rndX) * 4;
    var redAmount = human.pixels[pixelNumber];
    var greenAmount = human.pixels[pixelNumber+1];
    var blueAmount = human.pixels[pixelNumber+2];
    var trueColor = color(redAmount, greenAmount, blueAmount);
    dust.addParticle(createVector(rndX, rndY), trueColor);
  }
}

function draw() {
  background(245);
  dust.run();
}

function Dust() {
  this.particles = [];
  
  this.addParticle = function(pos, a) {
    var p = new Particle(pos, a);
    this.particles.push(p);
  }
  
  this.run = function() {
    controlCounter++;
    for (var i = 0; i < this.particles.length; i++) {
      this.particles[i].update();
      this.particles[i].control(controlCounter);
      this.particles[i].render(); 
    }
  }
}

function Particle(pos, cA) {
  this.photoPosition = pos;
  this.randomPosition = createVector(random(532), random(640));
  this.randomForce = p5.Vector.random2D();
  this.centerPoint = createVector(width/2, height/2);
  this.colorAmount = cA;
  this.renderFlag = true;
  this.rectWidth = random(6, 30);
  this.rectHeight = random(6, 30);
  this.sizeCounter = 0;
  
  this.update = function() {
    if(random(100) < 3) {
      this.randomForce = p5.Vector.random2D();
      this.randomForce.mult(random(-1.5, 1.5));
    }
    this.centerForce = p5.Vector.sub(this.centerPoint, this.randomPosition);
    this.centerForce.normalize();
    this.centerForce.mult(3.5);
    this.photoForce = p5.Vector.sub(this.photoPosition, this.randomPosition);
    var distance = this.photoForce.mag();
    this.photoForce.normalize();
    if(distance < 5) {
      this.photoForce.mult(0.01);
    } else {
      this.photoForce.mult(3.0);
    }
  }
  
  this.control = function(cc) {
    var cCounter = cc;
    
    if(cCounter < 300) {
      this.randomPosition.add(this.randomForce);
    }
    if(cCounter > 100 && cCounter < 300) {
      this.randomPosition.add(this.centerForce);
    }
    if(cCounter > 300) {
      this.randomPosition.add(this.photoForce);
    }
    if(cCounter > 300) {
      this.renderFlag = false;
    }
  }

  this.render = function() {
    if(this.renderFlag) {
      noStroke();
      fill(this.colorAmount);
      ellipse(this.randomPosition.x, this.randomPosition.y, 3, 3);
    } else {
      if(this.sizeCounter < 100) {
        this.sizeCounter++;
      }
      stroke(0);
      strokeWeight(1);
      fill(this.colorAmount);
      var variableX = this.rectWidth * this.sizeCounter * 0.01;
      var variableY = this.rectHeight * this.sizeCounter * 0.01;
      rect(this.randomPosition.x, this.randomPosition.y, variableX, variableY);
    }
  }
}