// Apurv Rayate

// Project 2: Experimental Camera 

// Code 2 Faculty: Xin Xin, Aarati Akkapeddi

​

let capture; // capture

let tracker; // clm tracker

let eyesr = []; // right eyes array

let eyesl = []; // left eyes array

let mouths = []; // mouths array

let noOfREyes, noOfLEyes, noOfMouths; // part counts

let rEyeSize, lEyeSize, mouthSize; // part sizes

let noRsli, noLsli, noMosli; // part count sliders

let rsizsli, lsizsli, mousizsli; // part size sliders

let bg;

​

function preload() {

  bg = loadImage("water.jpeg"); // aquarium background

}

​

function setup() {

  createCanvas(windowWidth, windowHeight); // full size canvas

  //frameRate(1);

  // max count

  noOfREyes = 8;

  noOfLEyes = 8;

  noOfMouths = 6;

  // max size

  rEyeSize = 3;

  lEyeSize = 3;

  mouthSize = 3;

  // for retina screens

  pixelDensity(1);

  // creates video capture

  capture = createCapture(VIDEO);  

  // resize the video capture

  capture.size(width/2, height/2);  

  // hides the video capture HTML element

  capture.hide();

  // tracker

  tracker = new clm.tracker();

  tracker.init();

  tracker.start(capture.elt);

  // part count sliders

  noRsli = createSlider(1, 7, 3, 1);

  noRsli.position(20, 30);

  noRsli.style('width', '70px');

  noLsli = createSlider(1, 7, 3, 1);

  noLsli.position(180, 30);

  noLsli.style('width', '70px');

  noMosli = createSlider(1, 5, 2, 1);

  noMosli.position(340, 30);

  noMosli.style('width', '70px');

  // part size sliders

  rsizsli = createSlider(0.1, 3, 2, 0.1);

  rsizsli.position(100, 30);

  rsizsli.style('width', '70px');

  lsizsli = createSlider(0.1, 3, 2, 0.1);

  lsizsli.position(260, 30);

  lsizsli.style('width', '70px');

  mousizsli = createSlider(0.1, 2.5, 1.7, 0.1);

  mousizsli.position(420, 30);

  mousizsli.style('width', '70px');

  // right eye object array

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

    eyesr.push(new Part());

  }

  // left eye object array

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

    eyesl.push(new Part());

  }

  // mouth object array

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

    mouths.push(new Part());

  }

}

​

function draw() {

  background(220);

  image(bg, 0, 0, width, height); // bg

  // setting slider values to relevant variables

  noOfREyes = noRsli.value();

  noOfLEyes = noLsli.value();

  noOfMouths = noMosli.value();

  rEyeSize = rsizsli.value();

  lEyeSize = lsizsli.value();

  mouthSize = mousizsli.value();

​

  //image(capture, 0, 0);

  let positions = tracker.getCurrentPosition(); // tracker positions

  if(positions){

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

      eyesr[i].show(30, 29, 28, 31, capture, positions, rEyeSize);

    }

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

      eyesl[i].show(23, 24, 25, 26, capture, positions, lEyeSize);

    }

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

      mouths[i].show(44, 47, 50, 53, capture, positions, mouthSize);

    }

​

  }

  // slider menu text

  fill(255);

  textSize(12); 

  text('No of R eyes', 20, 20);

  text('Size of R eyes', 97, 20);

  text('No of L eyes', 180, 20);

  text('Size of L eyes', 257, 20);

  text('No of mouths', 340, 20);

  text('Size of mouths', 420, 20);

  text('Press S to save a screenshot!', 20, 75);

}

​

// save a screenshot

function keyTyped() {

  if (key === 's') {

    save('aqua.jpg');

  }

}

​

// common class for all objects

class Part {

  constructor(){

    this.posx = random(width - 50);

    this.posy = random(height - 50);

    this.xdir = random(10, 15);

    this.ydir = random(10, 15);

    this.si = random(0.5, 1.5); // size

    this.re = random(255); // tint r

    this.gr = random(255); // tint g

    this.bl = random(255); // tint b

  }

  show(px, py, pw, ph, cap, posarray, size){

    // calc vars

    let sx = posarray[px][0] - 10;

    let sy = posarray[py][1] - 10;

    let sw = posarray[pw][0] - sx + 10;

    let sh = posarray[ph][1] - sy + 10;

    // let dx = this.posx;

    // let dy = this.posy;

    let dw = sw * size * this.si;

    let dh = sh * size * this.si;

    // show by copying

    copy(cap, int(sx), int(sy), int(sw), int(sh), int(this.posx), int(this.posy), int(dw), int(dh));

    // custom tinting method for copied capture parts

    push();

    fill(this.re, this.gr, this.bl, 150);

    noStroke();

    blendMode(MULTIPLY);

    rect(this.posx, this.posy, dw, dh);

    pop();

    // bounds

    if (this.posx < -30 || this.posx > width - 30) {

      this.xdir = -this.xdir;

    }

    if (this.posy < -30 || this.posy > height - 30) {

      this.ydir = -this.ydir;

    }

    // step

    this.posx += this.xdir;

    this.posy += this.ydir;

  }

}