SomaTarot II

somatarot

let tarot1, tarot2, tarot3;
let death, devil, fool, hangedman, hermit, moon;
let covered1 = true;
let covered2 = true;
let covered3 = true;
let vidsound = [];

function preload() {
  death = loadSound('voiceover/death.mp3');
  devil = loadSound('voiceover/devil.mp3');
  fool = loadSound('voiceover/fool.mp3');
  hangedman = loadSound('voiceover/hangedman.mp3');
  hermit = loadSound('voiceover/hermit.mp3');
  moon = loadSound('voiceover/moon.mp3');
}

function setup() {
  createCanvas(windowWidth, windowHeight);
  background(255);

  tarot1 = createImg('somatarot.png');
  tarot2 = createImg('somatarot.png');
  tarot3 = createImg('somatarot.png');

  // here we put a small array with video and sound into the big array that
  // will hold all video sound pairs
  // vidsound[0] = [createVideo('devil.mp4'), devil]
  // vidsound[0][0].loop();
  // vidsound[0][1].play();

  vidsound[0] = {
    'video': createVideo('devil.mp4'),
    'sound': devil
  };
  vidsound[0].video.loop();
  vidsound[0].video.hide();

  vidsound[1] = {
    'video': createVideo('hangedman.mp4'),
    'sound': hangedman
  };
  vidsound[1].video.loop();
  vidsound[1].video.hide();

  vidsound[2] = {
    'video': createVideo('fool.mp4'),
    'sound': fool
  };
  vidsound[2].video.loop();
  vidsound[2].video.hide();

  vidsound[3] = {
    'video': createVideo('death.mp4'),
    'sound': death
  };
  vidsound[3].video.loop();
  vidsound[3].video.hide();

  vidsound[4] = {
    'video': createVideo('hermit.mp4'),
    'sound': hermit
  };
  vidsound[4].video.loop();
  vidsound[4].video.hide();

  vidsound[5] = {
    'video': createVideo('moon.mp4'),
    'sound': moon
  };
  vidsound[5].video.loop();
  vidsound[5].video.hide();

  shuffle(vidsound, true);
}

function draw() {
  imageMode(CENTER);

  let v_width = min(width / 3, 300);
  let v_height = v_width * 1.666;
  image(vidsound[0].video, width / 6 + (0 * width / 3), v_height / 2 + 150, min(width / 3, 300), v_height);
  if (covered1) {
    tarot1.show();
  } else {
    tarot1.hide();
  }
  tarot1.size(min(width / 3, 300) + 33, v_height + 33);
  tarot1.position(width / 6 - v_width / 2 - 13, 0 + 133);

  image(vidsound[1].video, width / 6 + (1 * width / 3), v_height / 2 + 150, min(width / 3, 300), v_height);
  if (covered2) {
    tarot2.show();
  } else {
    tarot2.hide();
  }
  tarot2.size(min(width / 3, 300) + 33, v_height + 33);
  tarot2.position(3 * width / 6 - v_width / 2 - 12, 0 + 133);

  image(vidsound[2].video, width / 6 + (2 * width / 3), v_height / 2 + 150, min(width / 3, 300), v_height);
  if (covered3) {
    tarot3.show();
  } else {
    tarot3.hide();
  }
  tarot3.size(min(width / 3, 300) + 33, v_height + 33);
  tarot3.position(5 * width / 6 - v_width / 2 - 12, 0 + 133);

}

function mousePressed() {
  if (mouseX > 0 && mouseX < width / 3 && covered1 == true) {
    vidsound[0].sound.play();
    covered1 = false;
  } else if (mouseX > width / 3 && mouseX < 2 * width / 3 && covered2 == true) {
    vidsound[1].sound.play();
    covered2 = false;
  } else if (mouseX > width / 3 && mouseX < 3 * width / 3 && covered3 == true) {
    vidsound[2].sound.play();
    covered3 = false;
  }
}