Joseph Zhang – Project 10 – Sonic Sketch

sketch

// Joseph
// Section E
// Project 10 - Sonic 

var px, py;
var diam = 30;
var distance = 20;
var count = 0;

//load sounds
function preload() {
    up = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/up.wav');
    right = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/right.wav');
    left = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/left.wav');
    down = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/down.wav');
    warningSound = loadSound('https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/warning.wav');
}

function setup() {
    // you can change the next 2 lines:
    createCanvas(400, 400);
    px = width/2;
    py = height/2;
    dx = 0;
    dy = 0;
    useSound();
}

// for some reason wont work if not included
function soundSetup() {
}

function draw() {
    background(200, 220, 250);

    //red background - DANGER
    if(px < 50 || px > 350 || py < 50 || py > 350){
        background('red');
        fill('black');
        text("COME BACK!", width / 2 - 40, height / 2);
    }
    //blue background - SAFE
    else {
        background(200, 220, 250);
        fill('black');
        text("DON'T CROSS THE LINE ;)", width / 2, 30);
    }

    //creating movable circle, square boundary, and directions

    if(count === 0){
        text('UP / DOWN / LEFT / RIGHT ARROWS TO MOVE', 67, height - 20);
    }

    rectMode(CENTER);
    noFill();
    rect(width/2, height/2, 300, 300);


    //change color if inside/outside of boundary box
    if(px > 350 || px < 50 || py > 350 || py < 50){
        fill('blue');
    } else {
        fill('yellow');
    }

    //draw ellipse
    ellipse(px, py, diam, diam);

    //when the ball moves off the screen
    if(px < 0){
        px = height - diam/2;
    } if(px > width){
        px = 0;
    }
}

function keyPressed() {
    //press left key
    if (keyCode === LEFT_ARROW) {
        px -= distance;
        if(px < 50 || px > 350 || py < 50 || py > 350){
            warningSound.play();
        }
        else{
            left.play();
            warningSound.stop();
        }
        count++;
    }
    //press right key
    else if (keyCode === RIGHT_ARROW) {
        px += distance;
        if(px < 50 || px > 350 || py < 50 || py > 350){
            warningSound.play();
        }
        else{
            right.play();
            warningSound.stop();
        }
        count++;
    }
    //press up key
    else if (keyCode === UP_ARROW) {
        py -= distance;
        if(px < 50 || px > 350 || py < 50 || py > 350){
            warningSound.play();
        }
        else{
            up.play();
            warningSound.stop();
        }
        count++;
    }
    //press down key
    else if (keyCode === DOWN_ARROW) {
        py += distance;
        if(px < 50 || px > 350 || py < 50 || py > 350){
            warningSound.play();
        }
        else{
            down.play();
            warningSound.stop();
        }
        count++;
    }
}

In this project, I used the metaphor of the ball as me as a young adult. There are boundaries that we’re given and often times we’re tempted to cross them. We’re often warned, but we’re not stopped. Ultimately, it’s up to us.