// 5.17: Introduction to Matter.js - The Nature of Code

// by @shiffman

​

// module aliases

​

var Engine = Matter.Engine,

  //    Render = Matter.Render,

  World = Matter.World,

  MouseConstraint = Matter.MouseConstraint,

  Mouse = Matter.Mouse,

  Bodies = Matter.Bodies;

​

let pg;

let engine;

let world;

let boxes = [];

let circles = [];

let grounds = [];

let mConstraint;

let textPixels;

​

let faceapi;

let detections = [];

​

let video;

let canvas;

let sizes = [5, 10, 20, 30, 40];

let floor

let hasFloor = true;

​

function setup() {

  canvas = createCanvas(400, 400);

  video = createCapture(VIDEO);

  video.id("video");

  video.size(400, 400);

​

  const faceOptions = {

    withLandmarks: true,

    withExpressions: true,

    withDescriptors: true,

    minConfidence: 0.5,

  };

​

  //Initialize the model: モデルの初期化

  faceapi = ml5.faceApi(video, faceOptions, faceReady);

​

  pg = createGraphics(windowWidth, windowHeight);

  engine = Engine.create();

  world = engine.world;

  //  Engine.run(engine);

  // grounds.push(new Boundary(0, height / 2, 10, height));

  // grounds.push(new Boundary(width, height / 2, 10, height));

  // grounds.push(new Boundary(200, 0, width, 10));

  floor = new Boundary(200, height, width, 10)

  // grounds.push(floor);

  // World.add(world, grounds);

  World.add(world, floor);

​

  let mouse = Mouse.create(canvas.elt);

  mouse.pixelRatio = pixelDensity(); // for retina displays etc

  let options = {

    mouse: mouse,

  };

  mConstraint = MouseConstraint.create(engine, options);

  World.add(world, mConstraint);

​

  setInterval(() => {

    // circles.push(new Circle(width / 2, 80, 2));

    textPixels = getPixels();

    for (let pixel of textPixels) {

      circles.push(new Circle(pixel.x, pixel.y, 5));

    }

  }, 1000);

}

​

let count = 0;

​

function draw() {

  background(51);

​

  Engine.update(engine);

  for (let box of boxes) {

    box.show();

  }

  for (let circle of circles) {

    circle.show();

    circle.update();

  }

​

  for (let circle of circles) {

    if (circle.removable) {

      circles.splice(circles.indexOf(circle), 1);

      World.remove(world, circle.body);

    }

  }

​

  // for (let ground of grounds) {

    // ground.show();

  // }

​

  if (detections) {

    if (detections.length > 0 && hasFloor) {

      World.remove(world, floor.body);

      hasFloor = false;

    } else if (detections.length < 1 && !hasFloor) {

      floor = new Boundary(200, height, width, 10)

      World.add(world, floor);

      hasFloor = true;

    }

  }

​

}

​

// function mouseDragged() {

//   let size = random(sizes);

//   if (random() < 0.5) {

//     boxes.push(new Box(mouseX, mouseY, size, size));

//   } else {

//     circles.push(new Circle(mouseX, mouseY, size / 2));

//   }

// }

​