// Finds eyes from webcam and draws a representation of them on

// the canvas, with random colors for the irises. Click on the

// canvas to save an image; press a key to clear the canvas.

​

// Starting point: https://editor.p5js.org/kylemcdonald/sketches/BJOcyD9hm

const palettes = [

  ['#f9d1d1', '#ffa4b6', '#f765a3', '#a155b9', '#165baa', '#0b1354'],

  ['#C70039', '#900C3E', '#571845', '#FFC300', '#FF5733'],

  ['#003049', '#d62828', '#f77f00', '#fcbf49', '#eae2b7'],

  ['#022E40', '#277A8C', '#37A6A6', '#F26666', '#F2F2F2'],

];

​

//using math.floor definetly saved a lot of unnecessary codes but really a big experimentation to see what works and doesn't work

let usePaletteIndex = Math.floor(Math.random() * palettes.length);

let usePalette = palettes[usePaletteIndex];

​

let x = 5;

let y = 30;

​

let capture = null;

let tracker = null;

let positions = null;

let w = 0, h = 0;

let szMin = 10;

let szMax = 30;

let canvasWidth = 1080;

let canvasHeight = 1080;

​

function setup() {

  w = windowWidth;

  h = windowHeight;

  capture = createCapture(VIDEO);

  createCanvas(w, h);

  capture.size(w, h);

  capture.hide();

​

  frameRate(5);

  colorMode(HSB);

  background(0);

​

  tracker = new clm.tracker();

  tracker.init();

  tracker.start(capture.elt);

}

​

function draw() {

 //show the camera feed on the canvas- delete it or comment it out to clear the feed.

​

​

  // Flip the canvas so that we get a mirror image

   translate(w, 0);

    scale(-1.0, 1.0);

 //image(capture) is what shows the live preview on the screen

  //  image(capture, 0, 0, w, h);

 positions = tracker.getCurrentPosition();

​

  if (positions.length > 0) {

​

    noStroke();

    fill(random(usePalette));

    rect(positions[60][0], positions[60][1], 30, 30);

    }   

}

​

// function getPoint(index) {

//   return createVector(positions[index][0], positions[index][1]);

// }

​

// function drawEye(eye, irisColor) {

//   noFill();

//   stroke(255, 0.4);

//   drawEyeOutline(eye);

//   const irisRadius = min(eye.center.dist(eye.top), eye.center.dist(eye.bottom));

//   const irisSize = irisRadius * 2;

//   noStroke();

//   fill(irisColor);

//   ellipse(eye.center.x, eye.center.y, irisSize, irisSize);

//   const pupilSize = irisSize / 3;

//   fill(0, 0.6);

//   ellipse(eye.center.x, eye.center.y, pupilSize, pupilSize);

// }

​

// function drawEyeOutline(eye) {

//  beginShape();

//   const firstPoint = eye.outline[0];

//   eye.outline.forEach((p, i) => {

//     curveVertex(p.x, p.y);

//     if (i === 0) {

//       // Duplicate the initial point (see curveVertex documentation)

//       curveVertex(firstPoint.x, firstPoint.y);

//     }

//     if (i === eye.outline.length - 1) {

//       // Close the curve and duplicate the closing point

//       curveVertex(firstPoint.x, firstPoint.y);

//       curveVertex(firstPoint.x, firstPoint.y);

//     }

//   });

//   endShape();

// }

​

function mouseClicked() {

  // Clear background

  background(0);

}

​

function windowResized() {

  w = windowWidth;

  h = windowHeight;

  resizeCanvas(w, h);

  background(0);

}