let button;

let snapshots = [];

let total =25;

let counter = 0;

let r = 0;

let g=0;

let b =0;

let h,m;

let mon,date,yr;

​

function preload(){

  Font = loadFont("LibreCaslonText-Bold.ttf");

}

function setup() {

  createCanvas(800, 600);

  background(50);

  cap = createCapture(VIDEO);

  cap.size(400, 300);

  cap.hide();

  button = createButton("Snap");

  button.mousePressed(takesnap);

  pixelDensity(1);

}

​

function takesnap() {

  saveCanvas(canvas, 'DigitalPhotobooth', 'jpg');

}

​

​

let go = false;

function ready() {

  go = true;

}

​

function draw() {

  // background(220);

  // tint(155,0,155);

  // image(cap,0,0,width,height);

  ready();

  if(go){

    snapshots[counter] = cap.get();

    counter++;

    if(counter == total){

      counter=0;

    }

  }

  let w = 200;

  let h = 160;

  let x = 0;

  let y = 0;

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

    r = random(0,255);

    g = random(0,255);

    b= random(0,255);

    tint(20+i*20,20+i*10,20+i*20);

    let index = (i + frameCount)% snapshots.length;

    image(snapshots[index], x, y, w, h);

    x = x + w;

    if (x > width) {

      x = 0;

      y = y + h;

    }

  }

   datePhoto();

}

function datePhoto() {

  h = hour();

  m = minute();

  mon = month();

   date = day();

   yr = year();

​

  push();

  textFont(Font);

  fill(0);

  textSize(16);

  text('Created: ' + mon + "/" + date + "/" + yr + " at " + h + ":" + m , 500, 500);

  pop();

}