let capture;

let newfont;

let angle = 0;

let x = 0;

let cScale = 5;

let f = [];

let s = 60;

​

function preload() {

  newfont = loadFont('GoldmanR.ttf');

  backgroundImage = loadImage('mirror.jpg');

}

​

function setup() {

  createCanvas(500, 569);

  pixelDensity(1);

  capture = createCapture(VIDEO);

  capture.size(218, 264);

  capture.position(145, 95);

  capture.hide();

  fill(0);

  textFont(newfont);

  textSize(36);

  textAlign(CENTER, CENTER);  

  angleMode(DEGREES);

}

​

function draw() {

  // blendMode(BLEND);

  background(backgroundImage);

​

//mirror

  image(capture, 145, 95, 218, 264);

  image(capture, 145, 95, 218-10, 264-10);

  filter(POSTERIZE, 5);

  image(capture, 145, 95, 218-30, 264-30);

  image(capture, 145, 95, 218-50, 264-50);

  noStroke();

  capture.loadPixels();

  // loadPixels();

//full canvas video

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

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

      let index = (capture.width - x + 1 + (y * capture.width))*4;

      let r = capture.pixels[index+0];

      let g = capture.pixels[index+1];

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

      let bright = (r+g+b)/3;

      let z = map(bright, 0, 255, 0, cScale);

      noStroke();

      fill(255);

      ellipse(x*cScale, y*cScale, z, z);

    }

  }

//left top corner video

    f.push(capture.get());

    if (f.length > s) {

    f.shift();

    } if (f.length == s) {

        for (let i = 0; i < s; i++) {

            h = int(218 / s) + 1;

            y = map(i, 0, s, 0, 264);

            p = f[i].get(x, y, 218, h);

            image(p, x, y);

    }

    }

  for (let x = 0; x < capture.width; x+=5){

    for (let y = 0; y < capture.height; y+=5){

      let offset = ((y*capture.width)+x)*4;

    fill(capture.pixels[offset+1]);

    ellipse(x, y, 5, map(capture.pixels[offset+1], 0, 255, 0, 10));

    }

  }

  translate(mouseX, mouseY);

  rotate(angle);

  fill(0);

  text('Who Am I?', 0, 0);

  angle = angle + 3;

}

​