Project-10 Sonic Story

// Rishi Karthikeyan 
//rkarthik@andrew.cmu.edu
//Section B 

//HW 10 Sonic Story  

let elf; 
    var elfX = 350; var elfY = 225;
let santa; 
    var santaX = 115; var santaY = 225;
let santaWorkshop;
let santaAndReindeer; 
    var santaAndReindeerX = 160; var santaAndReindeerY = 250;
let santaOnChimney;
let kid; 
    var kidX = 100; var kidY = 275;
let tree;

let elfVoice;
let sleighBells;
let santaVoice;
let kidVoice;

var count = 0;
var centerX = 250;
var centerY = 200;
var dx = 30;
var dy = 5;

function preload() {
    //load images
    elf = loadImage('https://i.imgur.com/pu8ed6l.png');
    santa = loadImage('https://i.imgur.com/5rgNTe1.png');
    santaWorkshop =loadImage('https://i.imgur.com/bmjFtUd.png');
    santaAndReindeer = loadImage('https://i.imgur.com/t86lPuw.png');
    santaOnChimney = loadImage('https://i.imgur.com/NoL1xBz.png');
    kid = loadImage('https://i.imgur.com/F06Ekzc.png');
    tree = loadImage('https://i.imgur.com/qOOQlZt.png'); 

    //load sounds
    elfVoice = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/ElfVoice.wav");
    sleighBells = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/SleighBells.wav");
    santaVoice = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/SantaVoice.wav");
    kidVoice = loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/KidVoice.wav");
}


function setup() {
    createCanvas(500, 400);
    //createDiv("p5.dom.js library is loaded.");
    useSound();
    imageMode(CENTER);
    frameRate(1);
}

function soundSetup() { 
    elfVoice.setVolume(0.5);
    sleighBells.setVolume(0.5);
    santaVoice.setVolume(0.5);
    kidVoice.setVolume(0.5);
}

function draw() {
    background(200);  

    count++;

    switch (count) {
        case 1: elfVoice.play(); break;
        case 6: sleighBells.play(); break;
        case 11: santaVoice.play(); break;
        case 16: kidVoice.play(); break;
    }
    
    if (count >= 0 & count < 5) { 
        workshop();
        dy = 10;
        elfY -= dy;
        if ( elfY <= 215) {
            elfY +=20;
        }
    }
    if (count >= 5 & count < 10) { 
        reindeer(); 
        dy = 20;
        santaAndReindeerX += dx;
        santaAndReindeerY -= dy; 
    }
    if (count >= 10 & count < 15) { 
        chimney(); 
        centerY += dy;
    }
    if (count >= 15 & count < 20) {
        home(); 
        kidY -= 5;
        if ( kidY <= 270) {
            kidY +=10;
        }
    }
    if (count >=20) {
        end(); 
    } 
    
}

function workshop() {
    nightSky();
    //snow 
    fill(255);
    rect(0, 215, width, 200);
    image(santaWorkshop, centerX+80, centerY-30, 300, 100);
    image(elf, elfX, elfY, 130, 130);
    image(santa, santaX, santaY, 206, 200);
}

function reindeer() {
    nightSky();
    //moon
    noStroke();
    fill(208);
    circle(centerX, centerY-30, 200);

    //mountains 
    fill(20, 28, 38);
    beginShape();
    vertex(0, height);
    vertex(0, 270);
    vertex(105, 225);
    vertex(205, 300);
    vertex(290, 250);
    vertex(350, 280);
    vertex(450, 205);
    vertex(width, 225);
    vertex(width, height);
    endShape(CLOSE);

    image(santaAndReindeer, santaAndReindeerX, santaAndReindeerY, 270, 225);
}

function chimney() {
    nightSky();
    //roof
    image(santaOnChimney, centerX, centerY, 230, 230);
    noStroke();
    fill(195, 70, 55);
    rect(0, 315, width, 85); 
}

function home() {
    nightSky();
    
    //wall
    noStroke();
    fill(224, 193, 173);
    rect(0, 0, width, 50);
    rect(0, 0, 50, height);
    rect(250, 0, 250, height);
    rect(0, 150, width, 200);

    //floor
    fill(225, 221, 207);
    rect(0, 300, width, 100);

    //window 
    strokeWeight(5);
    stroke(255);
    noFill();
    rect(50, 50, 100, 100);
    rect(150, 50, 100, 100);
    strokeWeight(2);
    line(50, 100, 250, 100);
    line(100, 50, 100, 150);
    line(200, 50, 200, 150);

    image(kid, kidX, kidY, 150, 125);
    image(tree, 340, 220, 300, 300);
}

function end() {
    nightSky();
    noStroke();
    fill(255);
    textSize(50);
    text('The End', 185, 250);
}

function nightSky() {
    //night sky
    background(6, 20, 34);
    //stars 
    stroke(255);
    for (var i = 0; i < 1000; i++) {
        point(random(0,width), random(-0, height));
    }
}