let c;

let tracker;

let positions;

let catNose;

let button;

let filter90s;

​

function preload() {

  yearbook = loadImage(" photo.png")

  catNose = loadImage(" photofilter.png");

}

​

function setup() {

  c = createCanvas(600, 800);

  button = createButton('SAVE')

  button.size(80,40)

  button.position(50, 750)

  button.mousePressed(takePic)

  button.style('background-color', "#EF4076");

  button.style('border-radius', '5px');

​

​

​

  capture = createCapture(VIDEO);

  capture.size(width, height);

  capture.hide();

​

  tracker = new clm.tracker();

  tracker.init(); 

  tracker.start(capture.elt);

  filter90s = createGraphics(width, height);

  filter90s.pixelDensity(1);

}

​

function draw() {

//   filter90s.loadPixels();

//   let adjustments = [];

//   capture.loadPixels();

//   for (let y = 0; y < height; y++) {

//     for (let x = 0; x < width; x++) {

//       let index = (x + y * width) * 4;

//       let r = capture.pixels[index] + 10; // Red

//       let g = capture.pixels[index + 1] - 5; // Green

//       let b = capture.pixels[index + 2] + 5; // Blue

//       adjustments.push([constrain(r, 0, 255),

//                         constrain(g, 0, 255),

//                         constrain(b, 0, 255)]);

//     }

//   }

​

//   // Apply adjustments to filter90s.pixels

//   for (let y = 0; y < height; y++) {

//     for (let x = 0; x < width; x++) {

//       let index = (x + y * width) * 4;

//       filter90s.pixels[index] = adjustments[index]; // R

//       filter90s.pixels[index + 1] = adjustments[index+1]; // G

//       filter90s.pixels[index + 2] = adjustments[index+2]; // B

//       filter90s.pixels[index + 3] = 100; // A

//     }

//   }

​

//   filter90s.updatePixels();

  image(capture, 0, 0, width, height);

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

  image(yearbook, 0, 0, width, height);

  positions = tracker.getCurrentPosition(); 

  // draw face outline

  noFill();

  noStroke();

​

  beginShape();

  for (let i = 0; i < positions.length; i++) {

    vertex(positions[i][0], positions[i][1]);

  }

  endShape();

​

  noStroke();

  for (let i = 0; i < positions.length; i++) {

​

    if (i === 62) {

      let catNoseWidth = 400;

      let catNoseHeight = 600;

      let xOffset = 253;

      let yOffset = -270;

      image(catNose, positions[i][0] - xOffset, positions[i][1] + yOffset, catNoseWidth, catNoseHeight);    } else {

      text(i, positions[i][0], positions[i][1]);

    }

  }

}

​

​

function takePic() {

  console.log("savepic");

}

​

function takePic() {

  saveCanvas(c, 'myPic', 'jpg')

}