Project 10- Sonic Story

/*There is man at a camp fire telling ghost stories. The flashlight is the
trope of holding a flashlight under one's chin. A ghost then appears but cannot
move past the fire. The wind then blows out the fire and the screen goes dark.
The next part is up to the viewer's imagination.*/

function setup() {
    createCanvas(480, 480);
    createDiv("p5.dom.js library is loaded.");
    frameRate(1);
    useSound();
}

//loads all audio files before running the code
function preload(){
    ghostSound=loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/Ghost.wav");
    fireCrackling=loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/Fire.wav");
    flashlightClick=loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/Flashlight.wav");
    windWoosh=loadSound("https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/Wind.wav");
}

//sets the volume for all the sounds
function soundSetup(){
    ghostSound.setVolume(1);
    fireCrackling.setVolume(1);
    flashlightClick.setVolume(1);
    windWoosh.setVolume(1);
}

function draw() {
    background(26, 27, 71);
    fill(0, 255, 0);
    //creates the grass
    rect(0, 200, 480, height-200);


    translate(100, 100);
    push();
    //if frameCount is even it will display one fire, if odd it will display
    //the other
    //the secondary ifs make the fire stop when the wind blows past
    if(frameCount % 2 == 0){
        translate(115, 110);
        scale(.8);
        fill(255, 0, 0);
    //One version of the fire
        if(frameCount < 32){ //stops the fire when the wind blows by
            beginShape();
            curveVertex(84, 70);
            curveVertex(84, 70);
            curveVertex(95, 19);
            curveVertex(87, 5);
            curveVertex(75, 25);
            curveVertex(60, -30);
            curveVertex(40, 25);
            curveVertex(32, -10);
            curveVertex(21, 17);
        curveVertex(32, 70);
        curveVertex(84, 70);
        curveVertex(84, 70);
        endShape();
    //pop();
        }
    }
    else{
        if(frameCount < 32){ //stops fire when the wind blows by
    //Second version of the fire
            push();
            translate(115, 110);
            scale(.8);
            fill(255, 0, 0);
            beginShape();
            curveVertex(84, 70);
            curveVertex(84, 70);
            curveVertex(32, 70);
            curveVertex(21, 17);
            curveVertex(32, 0);
            curveVertex(40, 25);
            curveVertex(50, -25);
            curveVertex(75, 25);
            curveVertex(80, 5);
            curveVertex(90, -5);
            curveVertex(84, 70);
            curveVertex(84, 70);
            endShape();
        }
    }
    pop();

    //downward sloping log under the fire
    fill(165, 42, 42);
    push();
    translate(125, 150);
    rotate(radians(25));
    rect(0, 0, 80, 20);
    pop();
    //upward sloping log under the fire
    push();
    translate(125, 150);
    rotate(radians(-25));
    rect(-20, 30, 80, 20);
    pop();

    //if statement makes the face light up with the flashlight
    if(frameCount>12){
        fill(253, 217, 181);
    }
    else{
        fill(0);
    }
    //head
    circle(0, 5, 50);
    //body
    line(0, 30, 0, 100);
    //legs
    line(0, 100, -15, 150);
    line(0, 100, 15, 150);
    //arms
    line(-15, 60, 15, 60);
    line(15, 60, 0, 70);

    //flashlight
    fill(255);
    rect(-2.5, 60, 5, 20);
    quad(-2.5, 60, 2.5, 60, 7.5, 50, -7.5, 50)


    //flashlight beam that lights up face
    if(frameCount > 12){
        push();
        noStroke();
        fill(255, 255, 0, 60);
        quad(-7.5, 50, 7.5, 50, 25, 0, -25, 0);
        pop();
    }
    //moves the ghost from right to left
    push();
    if(frameCount > 17 & frameCount < 27){
        translate(frameCount*-5, 0);
        ghost();
    }
    pop();

    //wind
    //if moves the wind from right to left
    if(frameCount > 27){
        push();
        translate(200+frameCount*-10, 0);
        stroke(255);
        line(250, 50, 300, 50);
        line(275, 70, 325, 70);
        line(290, 30, 340, 30);
        pop();
    }
    //stops the animation and creates a black screen
    if(frameCount > 32){
        background(0);
        noLoop();
    }
    //when the flashlight turns on, the sound is made
    if(frameCount == 13){
        flashlightClick.play();
    }
    //fire sounds starts at 5 and ends prior to the flashlight
    else if(frameCount == 5){
        fireCrackling.play();
            if(frameCount == 10){
                fireCrackling.stop();
            }
    }
    //ghost sound starts when it is created
    else if(frameCount == 18){
        ghostSound.play();
    }
    //wind sound plays when the wind appears on screen
    else if(frameCount == 28){
        windWoosh.play();
    }
}
//function to create the ghost
function ghost(){
    push();
    beginShape();
    noStroke();
    arc(300, 50, 40, 100, PI, 0);
    triangle(300, 50, 305, 65, 310, 50);
    triangle(310, 50, 315, 65, 320, 50);
    triangle(290, 50, 295, 65, 300, 50);
    triangle(280, 50, 285, 65, 290, 50);
    fill(0);
    ellipse(295, 20, 5, 10);
    ellipse(305, 20, 5, 10);
    pop();
}