final project proposal by Tasia Miller

​

  My project will be inspired by the anime Haikyuu

*/

​

var slideNumber = 0;

var totalSlides = 4;

​

var description = "I'm going to focus my project on the usage of inserting pictures with sounds.";

​

var interaction = "The user will hit keys on the keyboard to trigger different parts of the audio with visuals.";

​

var visuals = "The visuals will consist of images that coincide with the sound";

​

var oya;

​

var nextButtonX = 700;

var nextButtonY = 550;

var prevButtonX = 100;

var prevButtonY = 550;

var buttonWidth = 60;

var buttonHeight = 30;

​

function preload() {

  oya = loadImage("oya3.jpg");

}

​

function setup() {

  createCanvas(800, 600);

}

​

function draw() {

  background(170, 200,120);

  fill(0);

  if (slideNumber === 0) {

    // project pitch intro

    textSize(60);

    textAlign(CENTER, CENTER);

    fill('purple')

    text("My Final Project", width / 2, height / 2);

    textSize(20);

    text("by Tasia Miller", width / 2, height / 2 + 100);

  } else if (slideNumber === 1) {

    // description

    textAlign(LEFT);

    textSize(40);

    text("Description", 50, 100);

    textSize(30);

    text(description, 50, 200, 600);

  } else if (slideNumber === 2) {

    // description

    textAlign(LEFT);

    textSize(40);

    text("Interaction", 50, 100);

    textSize(30);

    text(interaction, 50, 200, 600);

  } else if (slideNumber === 3) {

    // description

    textAlign(LEFT);

    textSize(40);

    text("Visuals", 50, 100);

    textSize(30);

    text(visuals, 50, 200, 600);

    image(oya, 100, 270, 400,300);

  }

  // draw buttons

  button("Next", nextButtonX, nextButtonY);

  button("Prev", prevButtonX, prevButtonY);

}

​

function button(buttonText, x, y) {

  stroke(0);

  strokeWeight(2);

​

  if (mouseX > x && mouseX < x + buttonWidth &&

      mouseY > y && mouseY < y + buttonHeight) {

    fill('orange');

  } else {

    fill('lightblue');

  }

  rect(x, y, buttonWidth, buttonHeight, 5);

​

  noStroke();

  fill(0);

  textAlign(LEFT, TOP);

  textSize(20);

  text(buttonText, x + 10, y + 5);

}

​

function mousePressed() {

  // check if mouse is inside button

  // next

  if (mouseX > nextButtonX && 

      mouseX < nextButtonX + buttonWidth &&

      mouseY > nextButtonY && 

      mouseY < nextButtonY + buttonHeight &&

     slideNumber < totalSlides - 1) {

    slideNumber++;

  }

  // prev

  if (mouseX > prevButtonX && 

      mouseX < prevButtonX + buttonWidth &&

      mouseY > prevButtonY && 

      mouseY < prevButtonY + buttonHeight &&

     slideNumber > 0) {

    slideNumber--;

  }

}

​

​

​