​

let header;

let footerL;

let footerR;

​

let artNum = 1;

​

let drawState = 0;

// 0 is drawing 

// 1 is paused

// 2 is reset

​

//let images

​

function preload() {

  header = loadImage('assets/header.png');

  footerL = loadImage('assets/footerL.png');

  footerR = loadImage('assets/footerR.png');

​

  artworks[0] = loadImage('assets/art_0.jpg');

  artworks[1] = loadImage('assets/art_1.jpg');

  artworks[2] = loadImage('assets/art_2.jpg');

  artworks[3] = loadImage('assets/art_3.jpg');

  artworks[4] = loadImage('assets/art_4.jpg');

  artworks[5] = loadImage('assets/art_5.jpg');

  artworks[6] = loadImage('assets/art_6.png');

  artworks[7] = loadImage('assets/art_7.jpg');

  artworks[8] = loadImage('assets/art_8.jpg');

  artworks[9] = loadImage('assets/art_9.jpg');

  artworks[10] = loadImage('assets/art_10.jpg');

  artworks[11] = loadImage('assets/art_11.jpg');

​

  //for (var i = 0; i< 3; i++) {

  // artworks[i] = loadImage('"assets/art_" + i + ".jpg"');

​

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  //frameRate(15);

  background(255, 255, 255);

  header.resize(width, 0);

  footerL.resize(width/35, 0);

  footerR.resize(width/35, 0);

​

}

​

function draw() {

  image(header, 0, 0);

  image(footerL, 0, windowHeight - footerL.height); 

  image(footerR, windowWidth - footerR.width, windowHeight - footerR.height); 

​

​

  artNum = round(random(11));

  // if (drawState == 0) {

  // }

  if (drawState == 2) {

    background(255, 255, 255);

    image(header, 0, 0);

    image(footerL, 0, windowHeight - footerL.height);

    image(footerR, windowWidth - footerR.width, windowHeight - footerR.height); 

​

  }

​

  cursor(CROSS);

}

​

function mouseMoved() {

  if ((drawState == 0)) {

    //if (frameCount % 15 == 0) {  

    background(255, 255, 255, 4);

    if (frameCount % 7 == 0) {

      image(artworks[artNum], mouseX, mouseY);

    }

  }

  if (drawState == 2) {

    drawState = 0;

}

}

​

function mousePressed() {

  drawState = drawState + 1;

  if (drawState > 2) {

    drawState = 0;

  }

}

​

​

function windowResized() {

  resizeCanvas(windowWidth, windowHeight);

  header.resize(width, 0);

  footerL.resize(width/35, 0);

  footerR.resize(width/35, 0);

}

​