// https://github.com/kylemcdonald/AppropriatingNewTechnologies/wiki/Week-2

​

var capture;

var tracker;

var w = 940,

  h = 480;

​

let x = 0;

let y = 0;

​

function preload() {

  font = loadFont("Yapari-Variable-VF.ttf");

}

​

function setup() {

  capture = createCapture(

    {

      audio: false,

      video: {

        width: w,

        height: h,

      },

    },

    function () {

      console.log("capture ready.");

    }

  );

  capture.elt.setAttribute("playsinline", "");

​

  //createCanvas(w, h);

  createCanvas(windowWidth, windowHeight);

​

  capture.size(w, h);

  capture.hide();

​

  colorMode(HSB);

​

  tracker = new clm.tracker();

  tracker.init();

  tracker.start(capture.elt);

​

  // for the text

​

  const n = "A";

  const s = 400;

​

  points = font.textToPoints(n, 0, 0, s, {

    sampleFactor: 1,

    simplifyThreshold: 0.0,

  });

​

  bounds = font.textBounds(n, 0, 0, s);

  console.log(bounds);

}

​

function draw() {

  background(0);

​

  // give the face/shape a bit more space on top

  translate(0,200);

  if(mouseIsPressed) {

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

  }

​

  var positions = tracker.getCurrentPosition();

​

  noFill();

  stroke(255);

  // face outline

  beginShape();

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

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

  }

  endShape();

  // face outline vertices

  noStroke();

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

    fill(map(i, 0, positions.length, 0, 360), 50, 100);

    ellipse(positions[i][0], positions[i][1], 4, 4);

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

  }

​

  if (positions.length > 0) {

    var mouthLeft = createVector(positions[44][0], positions[44][1]);

    var mouthRight = createVector(positions[50][10], positions[50][1]);

    var smile = mouthLeft.dist(mouthRight);

    // uncomment the line below to show an estimate of amount "smiling"

    // rect(20, 20, smile * 3, 20);

​

    // uncomment for a surprise

    // noStroke();

    // fill(0, 255, 255);

    // ellipse(positions[62][0], positions[62][1], 50, 50);

    push();

    translate(positions[62][0], positions[62][1]);

    translate(-150, 50);

    drawLetterShape();

    pop();

  }

}

​

function drawLetterShape() {

  push();

  fill(255, 0, 0);

  // noFill();

​

  let n = points.length;

  let res = 5;

  for (let i = 0; i < n; i += res) {

    x = points[i].x + sin((frameCount + i*10) * 0.01) * 10;

    y = points[i].y;

    push();

    translate(x, y);

    rotate((frameCount + i) * 0.005);

    stroke(255);

    rect(-10, 0, 100, 10);

    pop();

  }

  pop();

}

​