var button;

var snapshots = [];

let snapObjects = [];

// let currentSnap =[];

​

let bugs = [];

let img;

​

let imgDiameterMin = 50;

let imgDiameterMax = 150;

​

let currentXPos = 0;

let currentYPos = 0;

let prevDiameter = 0;

​

let currentID = -1;

let currentFirstLineID = currentID;

​

function setup() {

  createCanvas(320, 240);

  video = createCapture(VIDEO);

  video.size(320, 240);

  button = createButton('snap');

  button.mousePressed(takesnap);

}

​

function takesnap() {

  currentID++;

  let newJitterImg = new Jitter(img, currentXPos, currentYPos );

  if( currentXPos === 0 ){

    currentFirstLineID = currentID;

  }

  currentXPos = currentXPos + newJitterImg.diameter;

  if( currentXPos > width ){

    currentXPos = 0;

    currentYPos = currentYPos + bugs[currentFirstLineID].diameter;

    if( currentYPos > height ){

      currentYPos = 0;

    }

  }

  bugs.push(newJitterImg);

  // console.log('current first line ID: ',currentFirstLineID)

}

​

function draw() {

​

  img = video.get();

  background(255);

​

  // image(img,0,0);

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

    // bugs[i].move();

    bugs[i].display();

  }

}

​

// Jitter class

class Jitter {

​

  constructor(img,posX, posY) {

    this.x = posX; //random(width);

    this.y = posY;

    this.diameter = random(imgDiameterMin, imgDiameterMax);

    this.speed = 1;

    this.img = img;

  }

​

  display() {

    image(this.img, this.x, this.y, this.diameter, this.diameter);

  }

}