Project-10: Sonic Story

//Graana Khan
// Project 10 Section B 

//My story is a woman smoking out her window with noises of her cat meowing, 
// pigeons cooing, the TV playing in the back, noise of her exhaling the smoke,
// and the traffic of the busy city she is in. I wanted a lot of ambiance. 

//image variables I made in illustrator
var backdrop;
var woman1;
var woman2;
var pigeons1;
var pigeon2;

//sound variables
var meow;
var coo;
var tele;
var traffic;
var smoke;

var counter = 0; 

function preload() {
    // calling images
    backdrop = loadImage("https://i.imgur.com/iYYNGb3.png");
    woman1 = loadImage("https://i.imgur.com/2Kt4BvK.png");
    woman2 = loadImage("https://i.imgur.com/Qj2xRJz.png");
    pigeons1 = loadImage("https://i.imgur.com/XIXBGYQ.png");
    pigeons2 = loadImage("https://i.imgur.com/XYaJDPO.png");

    //calling sound
    meow = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/110011__tuberatanka__cat-meow.wav");
    coo = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/319512__squashy555__pigeon.wav");
    tele = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/185605__dementan__japanese-news.wav");
    traffic = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/345948__knufds__city-ambiance-new-york.wav");
    smoke = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/491053__sleepskraper__smoke.wav");
}


function setup() {
    createCanvas(480, 600);
    useSound();
    frameRate(1);
}


function soundSetup() { 
	meow.setVolume(0.1);
	coo.setVolume(0.1);
	tele.setVolume(3);
	traffic.setVolume(0.25);
	smoke.setVolume(8);

}


function draw() {
    background(200);

    image(backdrop, 0, 0, 480, 600);

//playing the image and some sounds graphics on specific frame counts
    switch(counter){
    	case 0: W1(); P2(); break;
    	case 1: W1(); P1(); break;
    	case 2: W1(); P2(); break;
    	case 3: W2(); P1(); break;
    	case 4: W1(); P2(); break;
    	case 5: W1(); P1(); break;
    	case 6: W2(); P2(); break;
    	case 7: W1(); P1(); break;
    	case 8: W1(); P2(); break;
    	case 9: W2(); P1(); break;
    	case 10: W1(); P2(); break;
    	case 11: W1(); P1(); break;
    	case 12: W2(); P2(); break;
    	case 13: W1(); P1(); break;
    	case 14: W1(); P2(); break;
    	case 15: W2(); P1(); break;
    	case 16: W1(); P2(); break;
    	case 17: W1(); P1(); break;
    	case 18: W1(); P2(); break;
    	case 19: W2(); P1(); break;
    	case 20: W1(); P2(); break;
    	case 21: W1(); P1(); break;
    	case 22: W2(); P2(); break;
    	case 23: W1(); P1(); break;
    	case 24: W1(); P2(); break;
    	case 25: W2(); P1(); break;
    	case 26: W1(); P2(); break;
    	case 27: W1(); P1(); break;
    	case 28: W2(); P2(); break;
    	case 29: W1(); P1(); break;
    	case 30: W2(); P1(); break;
    }

    counter++; 

    //reset the counter after 15 frames 

    if(counter >= 30){
    	counter = 0;
	}

	if(counter <= 30){
		tele.play();
		traffic.play();
	}

}

function W1(){
	image(woman1, 0, 0, 480, 600);
}

function W2(){
	image(woman2, 0, 0, 480, 600);
	smoke.play();
	meow.play();
}

function P1(){
	image(pigeons1, 0, 0, 480, 600);
}

function P2(){
	image(pigeons2, 0, 0, 480, 600);
	coo.play();
}