let video;

let predictions = [];

let prevKeyPoint12 = { x: 0, y: 0 };

let velocities = []; // Array to store recent velocities

let numFramesForAverage = 5; // Number of frames over which to calculate the moving average

let prevTime = 0; // Initialize prevTime to 0

let redKeyPoints = new Array(5).fill(null); // Pre-fill with null or some default value

let redIndex = 0; // This index will track the current position to update

let magVel = 0;

​

function setup() {

  createCanvas(640, 480);

  video = createCapture(VIDEO);

  video.size(width, height);

​

  handpose = ml5.handpose(video, modelReady);

​

  handpose.on("predict", results => {

    predictions = results;

  });

​

  video.hide();

}

​

function modelReady() {

  console.log("Model ready!");

}

​

function draw() {

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

​

  if (predictions.length > 0) {

    drawKeypoints();

  }

}

function drawKeypoints() {

  let currentTime = millis();

  let blueKeyPoint = null;

  const maxRedKeyPoints = 5; // Maximum number of red keypoints to store

  const indicesOfInterest = [0, 4, 8, 12, 16, 20]; // keypoints of interest

​

  predictions.forEach(prediction => {

    prediction.landmarks.forEach((keypoint, index) => {

      if (index === 0) {

        fill(0, 0, 255); // Blue for keypoint 0

        blueKeyPoint = keypoint;

      } else if ([4, 8, 12, 16, 20].includes(index)) {

        fill(255, 0, 0); // Red for specified keypoints

        redKeyPoints[redIndex] = keypoint; // Update the current index in the circular buffer

        redIndex = (redIndex + 1) % maxRedKeyPoints; // Move to next index, wrap around if necessary

      } else {

        fill(0, 255, 0); // Green for all other keypoints

      }

​

      noStroke();

      ellipse(keypoint[0], keypoint[1], 10, 10);

      if (index === 12) {

        updateVelocityForKeyPoint12(keypoint, currentTime);

      }

    });

  });

​

  // Log distances if necessary

  if (blueKeyPoint && redKeyPoints.some(kp => kp !== null)) {

    logAverageDistance(blueKeyPoint, redKeyPoints.filter(kp => kp !== null));

  }

}

​

function updateVelocityForKeyPoint12(keypoint, currentTime) {

  let deltaTime = (currentTime - prevTime) / 1000; // Convert milliseconds to seconds

  if (deltaTime > 0) { // Avoid division by zero

    let currentVelocity = {

      x: (keypoint[0] - prevKeyPoint12.x) / deltaTime,

      y: (keypoint[1] - prevKeyPoint12.y) / deltaTime

    };

​

    velocities.push(currentVelocity);

    if (velocities.length > numFramesForAverage) {

      velocities.shift(); // Remove the oldest velocity

    }

​

    let avgVelocity = velocities.reduce((acc, val) => {

      acc.x += val.x;

      acc.y += val.y;

      return acc;

    }, {x: 0, y: 0});

​

    avgVelocity.x /= velocities.length;

    avgVelocity.y /= velocities.length;

​

    console.log(`Moving average velocity of keypoint 12: x=${avgVelocity.x.toFixed(2)}, y=${avgVelocity.y.toFixed(2)}`);

    magVel = Math.sqrt(avgVelocity.x * avgVelocity.x + avgVelocity.y * avgVelocity.y);

    console.log(`Magvel = ${magVel}`);

    prevKeyPoint12.x = keypoint[0];

    prevKeyPoint12.y = keypoint[1];

    prevTime = currentTime;

  }

}

function logAverageDistance(blueKeyPoint, redKeyPoints) {

  let totalDistance = redKeyPoints.reduce((acc, redKeyPoint) => {

    return acc + dist(blueKeyPoint[0], blueKeyPoint[1], redKeyPoint[0], redKeyPoint[1]);

  }, 0);

  let avgDistance = totalDistance / redKeyPoints.length;

  console.log(`Average distance: ${avgDistance.toFixed(2)}`);

}

​