Project 10 – Sonic Story

// Sarah Luongo
// Section A
// Project

/* This code aims to tell a short story of traveling home during the holidays, and the joy upon finally arriving home.*/

var train;
var car;
var house;
var xmastree;
var family;
var trainN;
var drive;
var walk;
var bell;
var cheers;

// Load images and sounds
function preload() {
    // Images
    train = loadImage('https://i.imgur.com/8nQo4PL.png');
    car = loadImage('https://i.imgur.com/J9C4YkK.png');
    house = loadImage('https://i.imgur.com/ck3pJGM.png');
    family = loadImage('https://i.imgur.com/GKtqVl2.png');
    xmastree = loadImage('https://i.imgur.com/BTleSuv.png');

    // Sounds
    trainN = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/train.wav");
    drive = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/drive.wav");
    walk = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/walk.wav");
    bell = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/bell.wav");
    cheers = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/cheers.wav");
}


function setup() {
    createCanvas(400, 300);
    frameRate(1);
    train.resize(100, 100);
    car.resize(100, 100);
    house.resize(200, 200);
    xmastree.resize(150, 200);
    family.resize(width, 100);
    useSound();
}


// Setup for audio generation
function soundSetup() {
    trainN.setVolume(0.2);
    drive.setVolume(1);
    walk.setVolume(1);
    bell.setVolume(0.5);
    cheers.setVolume(0.5);
}


function draw() {
    background(200);
    noStroke();
    // On the train:
    if (frameCount <= 10) {
        // Sky
        fill(20, 40, 80);
        rect(0, 0, width, height/1.3);
	//Mountains
        fill(200);
        triangle(-50, height/1.3, 200, height/1.3, 75, height/3);
        triangle(200, height/1.3, width, height/1.3, 300, height/2);
        //Snow on top of mountain
        fill(240)
        triangle(60, height/2.6, 90, height/2.6, 75, height/3);  
        triangle(280, height/1.8, 320, height/1.8, 300, height/2);
        // Snow
        rect(0, height/1.3, width, height/4); 
        // Train
        image(train, 0, height/2);
	//trainN.play();

    //Driving home:
    } else if (frameCount > 10 & frameCount <= 20) {
        // Sky
        fill(20, 40, 80);
        rect(0, 0, width, height/1.3);
        // Snow 
        fill(240);
        rect(0, height/1.5, width, height/3);
        // Car
        image(car, width/2, height/2.3);
	//drive.play();

    // Home:
    } else if (frameCount > 20 & frameCount <= 25) {
        // Sky
        fill(20, 40, 80);
        rect(0, 0, width, height/1.3);
        // Snow
        fill(240);
        rect(0, height/1.5, width, height/3);
        // House
        image(house, 200, 8);
        // Tree
        fill(56, 28, 0);
        rect(0, 60, 13, 150);
        push();
        rotate(radians(150));
        rect(-20, -100, 65, 2);
        pop();
        // Car
        image(car, 50, height/2.3);
	// Sounds:
	/*if (frameCount > 10 & frameCount <= 11) {
	    door.play();
	} else if (frameCount > 11 & frameCount <= 14) {
	    walk.play();
	} else if (frameCount > 14 & frameCount <= 15) {
	    bell.play();
	}*/

    // Inside home:
    } else if (frameCount > 25 & frameCount <= 30) {
        // Wall
        fill(220, 51, 80);
        rect(0, 0, width, height/1.5);
        // Floor
        fill(200);
        rect(0, height/1.5, width, height/3); 
        // Christmas tree
        image(xmastree, 250, 10);
        // Family
        image(family, 0, height/2.3);
	//cheers.play();

    // The end:
    } else {
        background(0);
        fill(255);
        textSize(20);
        text("The End", width/2.5, height/2);
    }
    //Sounds
    switch (frameCount) {
        case 1: trainN.play(); break;
        case 9: drive.play(); break;
        case 21: walk.play(); break;
	case 25: bell.play(); break;
	case 26: cheers.play(); break;
    }
}