*  - Mouse click to cycle between two digits

 *    from the MNIST dataset

 */

​

let imgs = [];

cur = 0;

​

function preload() {

  imgs.push(loadImage('mnist1.png'));

  imgs.push(loadImage('mnist2.png'));

}

​

function setup() {

  createCanvas(400, 800);

}

​

function draw() {

  background(255);

  image(imgs[cur], 0, 0, 48, 48);

  let numPixel = 0;

  noStroke();

  for (let y=0; y < imgs[cur].height; y++) {

    for (let x=0; x < imgs[cur].width; x++) {

      fill(imgs[cur].get(x, y));

      rect(width/2, numPixel, 1, 1);

      numPixel++;

    }

  }

}

​

function mousePressed() {

  cur = (cur + 1) % imgs.length;

}