Edited samples taken from soundpacks.com

*/

let b0, b1, b2, b3, b4, b5, b6, b7, b8, b9;

let a0, a1, a2, a3, a4, a5, a6, a7, a8, a9;

let hp;

let value = 0;

let textBank = ["The pursuit of perfection is eternal", "Freedom through performance", "Triumph of good over evil", "Revelation of the inner self", "The mirror is wicked and deceitful"];

let textDisp = " ";

let light, medium;

​

function preload() {

  b0 = loadImage('b1.png');

  b1 = loadImage('b2.png');

  b2 = loadImage('b3.png');

  b3 = loadImage('b4.png');

  b4 = loadImage('b5.png');

  b5 = loadImage('b6.png');

  b6 = loadImage('b7.png');

  b7 = loadImage('b8.png');

  b8 = loadImage('b9.png');

  b9 = loadImage('b10.png');

  a0 = loadSound('a0.m4a');

  a1 = loadSound('a1.m4a');

  a2 = loadSound('a2.m4a');

  a3 = loadSound('a3.m4a');

  a4 = loadSound('a4.m4a');

  a5 = loadSound('a5.m4a');

  a6 = loadSound('a6.m4a');

  a7 = loadSound('a7.m4a');

  a8 = loadSound('a8.m4a');

  a9 = loadSound('a9.m4a');

  light = loadFont('Inter-Light.ttf');

  medium = loadFont('Inter-Medium.ttf');

}

​

function setup() {

  createCanvas(600, 400);

  imageMode(CENTER);

  noStroke();

  pixelDensity(2);

}

​

function draw() {

  colorMode(RGB);

  background(20, 35);

​

  if (keyIsPressed === true) {

    textDisp = textBank[int(random(textBank.length))];

    value = millis();

    if (key === '1') {

      sB(0, width / 10 * 0);

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

      sB(1, width / 10 * 1);

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

      sB(2, width / 10 * 2);

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

      sB(3, width / 10 * 3);

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

      sB(4, width / 10 * 4);

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

      sB(5, width / 10 * 5);

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

      sB(6, width / 10 * 6);

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

      sB(7, width / 10 * 7);

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

      sB(8, width / 10 * 8);

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

      sB(9, width / 10 * 9);

    }

  } else {

    if (millis() >= 1200 + value) {

      fill(255, map(sin(frameCount * 0.020), -1, 1, 20, 150));

      textAlign(CENTER);

      textSize(17);

      textFont(medium);

      text(textDisp, width / 2, height / 2);

      keys();

    }

​

  }

}

​

​

function sB(x, p1) {

  let n = 'b' + x;

  let m = 'a' + x;

  colorMode(HSB);

  fill(map(x, 0, 9, 0, 255), random(50, 250), random(50, 250));

  rect(width / 10 * x, 0, width / 10, height);

    drawingContext.shadowOffsetX = 5;

  drawingContext.shadowOffsetY = -5;

  drawingContext.shadowBlur = 40;

  drawingContext.shadowColor = '#000';

  image(eval(n), (p1 + p1 + width / 10) / 2, height / 2, eval(n).width / 2, eval(n).height / 2);

  eval(m).play();

}

​

function keys() {

  textSize(9);

  fill(255, 80);

  textFont(light);

  for (var i = 1; i < 11; i++) {

​

    if (i == 10) {

      text(0, width / 10 * i - width / 20, height - 15);

    } else {

      text(i, width / 10 * i - width / 20, height - 15);

    }

  }

}