let video;

let predictions = [];

let ballX;

let ballY;

let ballSize = 30;

let score = 0;

​

function setup() {

  createCanvas(640, 480);

  video = createCapture(VIDEO);

  video.size(width, height);

​

  facemesh = ml5.facemesh(video, modelReady);

​

  // This sets up an event that fills the global variable "predictions"

  // with an array every time new predictions are made

  facemesh.on("predict", (results) => {

    predictions = results;

  });

​

  // Hide the video element, and just show the canvas

  video.hide();

  // initial ball position

  ballX = width/2;

  ballY = height - ballSize/2;

}

​

function modelReady() {

  console.log("Model ready!");

}

​

function draw() {

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

​

  // We can call both functions to draw all keypoints

  //drawKeypoints();

  detectBlink();

  circle(ballX, ballY, ballSize);

  if (ballY <= height - ballSize/2 - 90) {

    score = score + 1;

  }

  textSize = 45;

  text ("Score = " + score , 50, 100);

}

​

// A function to draw ellipses over the detected keypoints

function detectBlink() {

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

    // eye array

    const prediction = predictions[i];

    let rightEyeUpper = prediction.annotations.rightEyeUpper1;

    let rightEyeLower = prediction.annotations.rightEyeLower1;

    let leftEyeUpper = prediction.annotations.leftEyeUpper1;

    let leftEyeLower = prediction.annotations.leftEyeLower1;

​

    // Calculate average distance between upper and lower eyelids for both eyes

​

    let rightEyeGap = eyeGap(rightEyeUpper, rightEyeLower);

    let leftEyeGap = eyeGap(leftEyeUpper, leftEyeLower);

​

    // get box size

    let topX = prediction.boundingBox.topLeft[i][0];

    let topY = prediction.boundingBox.topLeft[i][1];

    let bottomX = prediction.boundingBox.bottomRight[i][0];

    let bottomY = prediction.boundingBox.bottomRight[i][1];

​

    let boxSize = bottomY - topY;

​

    let blinkThreshold = 120

    console.log("Blink Threshold = " + blinkThreshold);

​

// let n = map(7, 0, 10, 0, 100)

let rUp = prediction.mesh[386][0];

let rDown = prediction.mesh[374][0];

let rGap = rDown - rUp;

console.log("386 =" + prediction.mesh[386][0]);

console.log("374 =" + prediction.mesh[374][0]);

console.log("Gap =" + rGap);

rGap = map(rGap, 0.0, 1.5, 0, 100);

console.log("Gap Mapped=" + rGap);

let lUp = prediction.mesh[159][0];

let lDown = prediction.mesh[146][0];

let lGap = lDown - lUp;

console.log("159 =" + prediction.mesh[159][0]);

console.log("145 =" + prediction.mesh[145][0]);

console.log("Gap =" + lGap);

lGap = map(lGap, 0.0, 1.5, 0, 100);

console.log("Gap Mapped=" + lGap);

     // dectect blink conditional

        if (abs(rGap) > blinkThreshold && abs(lGap) > blinkThreshold) {

      // Threshold for blink detection; adjust based on your observations

      console.log("Blink detected");

          bounceBall();

    } else {

      console.log("No Blink");

      ballY = lerp(ballY, height-ballSize/2, 0.05);

    }

  }

}

​

function eyeGap(upper, lower) {

  let distance = dist(upper[3][0], upper[3][1], lower[3][0], lower[3][1]);

​

  console.log(distance);

  return distance;

}

​

function drawKeypoints() {

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

    const keypoints = predictions[i].scaledMesh;

​

    // Draw facial keypoints.

    for (let j = 0; j < keypoints.length; j += 1) {

      const [x, y] = keypoints[j];

​

      fill(0, 255, 0);

      ellipse(x, y, 5, 5);

    }

  }

}

​

function bounceBall(){

​

  ballY = lerp(ballY, height-ballSize/2 - 100, 0.05);

}

​

​

​