I used sounds and images to creat an interactive version of a popular scene from the anime Haikyuu

by Tasia Miller

*/

​

//variables

var oya0;

var oya1;

var oya2;

var oya3;

var kaashioya;

var booya;

var kurooya;

​

var state = 0;

​

//preload

function preload() {

  oya0 = loadImage("oya0.jpg");

  oya1 = loadImage("oya1.jpg");

  oya2 = loadImage("oya2.jpg");

  oya3 = loadImage("oya3.jpg");

  kaashioya = loadSound("oya1.mp3");

  booya = loadSound("oya2.mp3");

  kurooya = loadSound("oya3.mp3");

}

​

//sounds

function keyPressed() {

  state = state + 1;

  if (state > 3) {

    state = 0;

  }

  if (state === 1 && keyCode === 79) {

    //O

    kaashioya.play();

  }

  if (state === 2 && keyCode === 89) {

    //Y

    booya.play();

  }

  if (state === 3 && keyCode === 65) {

    //A

    kurooya.play();

  }

}

​

function setup() {

  createCanvas(800, 440);

​

  button = createButton("Save Image");

  button.position(30, 400);

  button.size(70);

  button.mousePressed(SaveImage);

}

​

//image state

function draw() {

  background(255, 60, 0, 0);

​

  if (state === 0) {

    image(oya0, 0, 0);

​

    fill("yellow");

    textSize(30);

    text("Press O then Y,then A on keyboard", 5, 30);

  } else if (state === 1) {

    image(oya1, 0, 0);

​

    fill("black");

    textSize(30);

    text("Oya", 5, 30);

  } else if (state === 2) {

    image(oya2, 0, 0);

​

    fill("rgb(131,131,79)");

    textSize(40);

    text("Oya Oya", 5, 30);

  } else if (state === 3) {

    image(oya3, 0, 0);

​

    fill("red");

    textSize(60);

    text("Oya Oya Oya", 5, 45);

  }

}

​

function SaveImage() {

  save("haikyuu.jpg");

}

​