let candleImg;

let candleImg2;

let scissorsImg;

let scissorsImg2;

let bottleImg;

let bottleImg2;

let keyboardImg;

let keyboardImg2;

let canImg;

let canImg2;

let bookImg;

let bookImg2;

​

//sound effects

let candleSound;

let scissorsSound;

let bottleSound;

let keyboardSound;

let canSound;

let bookSound;

​

//top image transparency

let candleTransparency = 128;

let scissorsTransparency = 128;

let bottleTransparency = 128;

let keyboardTransparency = 128;

let canTransparency = 128;

let bookTransparency = 128;

​

function preload(){

  candleImg = loadImage('candleImg.png');

  candleImg2 = loadImage('candleImg2.png');

  candleSound = loadSound('candleSound.mp3');

  scissorsImg = loadImage('scissorsImg.png');

  scissorsImg2 = loadImage('scissorsImg2.png');

  scissorsSound = loadSound('scissorsSound.mp3');

  bottleImg = loadImage('bottleImg.png');

  bottleImg2 = loadImage('bottleImg2.png');

  bottleSound = loadSound('bottleSound.mp3');

  keyboardImg = loadImage('keyboardImg.png');

  keyboardImg2 = loadImage('keyboardImg2.png');

  keyboardSound = loadSound('keyboardSound.mp3');

  canImg = loadImage('canImg.png');

  canImg2 = loadImage('canImg2.png');

  canSound = loadSound('canSound.mp3');

  bookImg = loadImage('bookImg.png');

  bookImg2 = loadImage('bookImg2.png');

  bookSound = loadSound('bookSound.mp3');

}

​

function setup() {

  createCanvas(600, 600);

}

​

function draw() {

  background(220);

  //candle

  textSize(32);

  text('a',115,240)

  noTint();

  image(candleImg,50,70,150,150);

  tint(255, candleTransparency)

  image(candleImg2,50,70,150,150);

  //scissors

  textSize(32);

  text('s',290,240)

  noTint();

  image(scissorsImg,230,70,150,150);

  tint(255, scissorsTransparency)

  image(scissorsImg2,230,70,150,150);

  //bottle

  textSize(32);

  text('d',475,240)

  noTint();

  image(bottleImg,400,70,150,150);

  tint(255, bottleTransparency)

  image(bottleImg2,400,70,150,150);

  //keyboard

  textSize(32);

  text('j',130,520)

  noTint();

  image(keyboardImg,60,340,150,150);

  tint(255, keyboardTransparency)

  image(keyboardImg2,60,340,150,150);

  //soda can

  textSize(32);

  text('k',295,520)

  noTint();

  image(canImg,225,340,150,150);

  tint(255, canTransparency)

  image(canImg2,225,340,150,150);

  //book

  textSize(32);

  text('l',475,520)

  noTint();

  image(bookImg,400,360,150,150);

  tint(255, bookTransparency)

  image(bookImg2,400,360,150,150);

}

​

//sound and animation triggers

function keyPressed(){

  if (key == 'a'){

    candleSound.play();

    candleTransparency = 255;

  } else if (key == 's'){

    scissorsSound.play();

    scissorsTransparency = 255;

  } else if (key == 'd'){

    bottleSound.play();

    bottleTransparency = 255;

  } else if (key == 'j'){

    keyboardSound.play();

    keyboardTransparency = 255;

  } else if (key == 'k'){

    canSound.play();

    canTransparency = 255;

  } else if(key == 'l') {

    bookSound.play();

    bookTransparency = 255;

  }

}

​

//return image transparency to default state

function keyReleased(){

  if (key == 'a'){

    candleTransparency = 128;

  } else if (key == 's'){

    scissorsTransparency = 128;

  } else if (key == 'd'){

    bottleTransparency = 128;

  } else if (key == 'j'){

    keyboardTransparency = 128;

  } else if (key == 'k'){

    canTransparency = 128;

  } else if (key == 'l'){

    bookTransparency = 128;

  }

}