Hyejo Seo-Project 10 – Sonic Sketch

sketch

/*
Hyejo Seo
Section A
hyejos@andrew.cmu.edu
Project 10 - Sonic Sketch 
*/
var backgroundPic;
var rainSound;
var thunderSound;
var kettleSound;
var matchesSound;

function preload() {
    // loading my background image
    var backgroundURL = "https://i.imgur.com/pIas40A.jpg";
    backgroundPic = loadImage(backgroundURL);
    // loading the sound files 
    rainSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/10/rain.wav");
    rainSound.setVolume(1);
    thunderSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/10/thunder.wav");
    thunderSound.setVolume(1);
    kettleSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/10/kettle.wav");
    kettleSound.setVolume(1);
    matchesSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/10/matches.wav");
    matchesSound.setVolume(1);

}
function setup() {
    createCanvas(500, 400);
    backgroundPic.resize(500, 400); // resizing my background picture to fit the canvas
    // useSound();

}

function draw() {
    image(backgroundPic, 0, 0); 
    noFill();
    stroke(255, 248, 240);
    strokeWeight(2);
    // Thunder cloud area
    rect(3, 4, 223, 130);
    // Rain cloud area
    rect(285, 18, 215, 110);
    // Candles area
    rect(5, 240, 220, 155);
    // Tea area
    rect(310, 295, 137, 95);
}

function mousePressed() {
    // thunder sound conditional statement 
    if(mouseX > 3 & mouseX < 226 && mouseY < height / 2){
        if(thunderSound.isLooping()){
            thunderSound.pause();
        } else {
            thunderSound.loop();

        }
    }
    // rain sound conditional statement 
    if(mouseX > 285 & mouseX < 500 && mouseY < height / 2){
            if(rainSound.isLooping()){
                rainSound.pause();
        } else {
            rainSound.loop();
        }
    }


    // candle sound conditional statement 
    if(mouseX > 5 & mouseX < 225 && mouseY > height / 2){
        if(matchesSound.isLooping()){
            matchesSound.pause();
        } else {
        matchesSound.loop();
        }
    }

    // kettle sound conditional statement 
    if(mouseX > 310 & mouseX < 447 && mouseY > height / 2){
        if(kettleSound.isLooping()){
            kettleSound.pause();
        } else {
        kettleSound.loop();
        }
    }
}

When I was brainstorming about what to do for this project, it happened to be pouring outside with thunder and lightening (yesterday). Hence, I decided to create this cozy night starter pack on rainy days. Since I created my background image on Illustrator, I had to define each icon by using rect() function. This was just for myself to write the conditional functions. Overall, I am happy with my work.