Project-10 Sonic Story

Andrew id: heyingw Name: Heying Wang

These are the characters in my sound story: fish, ship, bubbles, small rock, small rock pieces, and big rock.

The sounds in my story include the sound of the ocean waters, ship siren, ship alarm, explosion sound, and bubble popping sound.

This is what the story is about: The ship starts sailing on the sea and the fish is swimming happily in the waters. The ship stops and the siren goes off to warn nearby ships. Nothing dangerous detected. The siren stops and the ship sails again with a faster speed. The ship hits a rock however, and the alarm for collision is triggered. Luckily the rock isn’t too big. Our ship cracks the rock into pieces accompanied by an explosion sound. The ship doesn’t seem to be damaged and it continued its journey. Our fish is making bubbles happily with a poppoing sound. The ships accelerates. It’s now sailing at a very high speed, which can be dangerous for the ship. The ship hits a big tock and the alarm is triggered. The rock is too big to be crashed. The ship sinks to the bottom of the sea. Game over.

sketch

var bgImage;
var boat;
var pieces=[];
function preload() {
    // call loadImage() and loadSound() for all media files here
    bgImageBig=loadImage('https://i.imgur.com/hpw6fpR.jpeg');
    fishImage=loadImage('https://i.imgur.com/zOEWUQ7.png');
    boatImage=loadImage('https://i.imgur.com/MtadjYH.png');
    water=loadSound('https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/water-2.wav');
    siren=loadSound('https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/siren.wav');
    alarm=loadSound('https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/alarm.wav');
    pop=loadSound('https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/pop-1.wav')
    breaking=loadSound('https://courses.ideate.cmu.edu/15-104/f2020/wp-content/uploads/2020/11/break.wav')
    
}


function setup() {
    createCanvas(400, 400);
    frameRate(10);
    useSound();

    //boat object
    boat=new Object();
    boat.img=boatImage;
    boat.x=280;
    boat.y=15;
    boat.dx=-0.8;
    boat.imgWidth=120;
    boat.imgHeight=120;
    boat.draw=imageDraw;

    //fish object
    fish=new Object();
    fish.img=fishImage;
    fish.x=200;
    fish.y=250;
    fish.dx=-4;
    fish.imgWidth=60;
    fish.imgHeight=60;
    fish.draw=imageDraw;

}


function soundSetup() { 
    water.loop();
    water.setVolume(0.02);
    siren.setVolume(0.05);
    alarm.setVolume(0.2);
    breaking.setVolume(0.2);
    pop.setVolume(0.3);
 
}


function draw() {
    //clip background
    var bgImage=bgImageBig.get(0,100,400,300);
    background(20,60,100);
    image(bgImage,0,100,400,400);

    boat.draw();
    fish.draw();
//The ship starts sailing on the sea and the fish is swimming happily in the waters
    print(frameCount);
    if (frameCount >= 25 & frameCount < 80) { 
        boat.x+=boat.dx;

     }

    fish.x+=fish.dx;
    fish.y+=random(1,-1);
    if(fish.x<=-20){
        fish.x=400;
        fish.y=random(150,350);
    }

//The ship stops and the siren goes off to warn nearby ships
    if(frameCount >=90 & frameCount < 125){
        siren.play();
    }

//Nothing dangerous detected. The siren stops and the ship sails again with a faster speed   
    if(frameCount >125 & frameCount < 219){
        siren.stop();
        boat.dx=-1.5;
        boat.x+=boat.dx;
        
    }

//The ship hits a rock however, and the alarm for collision is triggered 
    if(frameCount>219 & frameCount<240){
        if(frameCount==220){
            alarm.play();
        }
        var ball=new Object();
        ball.x=boat.x+20;
        ball.y=boat.y+90;
        ball.draw=drawBall;
        ball.draw();

    }
//Luckily the rock isn't too big. 
//Our ship cracks the rock into pieces accompanied by an explosion sound 
    if (frameCount>240 & frameCount<250){
        alarm.stop();
        for (i=0;i<50;i++){
            pieces[i]=random(105,130);

        }
        for(i=0;i<pieces.length;i++){
            circle(pieces[i],random(120,380),2,2);
        }
        if(frameCount==241){
            breaking.play();
       

    }}
//The ship doesn't seem to be damaged and it continued its journey
    if(frameCount>235 & frameCount<=399){
        boat.dx=-1.5;
        boat.x+=boat.dx;

    }
//Our fish is making bubbles happily with a poppoing sound
    if(frameCount>280){
        if(frameCount%30==0){
            fill(255)
            circle(fish.x,fish.y,15,15);
            pop.play()
        }
    }



    if(boat.x<=-30){
        boat.x=370;
        boat.y=15;
    }

//The ships accelerates. 
//It's now sailing at a very high speed, which can be dangerous for the ship
    if(frameCount>399 & frameCount<499){
        boat.dx=-5;
        boat.x+=boat.dx;
        if(frameCount%100==0){
            siren.play();
        }}

//The ship hits a big tock and the alarm is triggered
    if(frameCount>499 & frameCount<519){
        if(frameCount==500){
            alarm.play();
        }
            var bigBall=new Object();
            bigBall.x=boat.x;
            bigBall.y=boat.y+90;
            bigBall.draw=drawbigBall;
            bigBall.draw();


    }
//The rock is too big to be crashed. The ship sinks to the bottom of the sea. Game over.
    if(frameCount>519){
        boat.x+=boat.dx;
        boat.y+=20;
        if(boat.y>=390){
            background(0);
            noLoop();
        }
    }
        
        
    
    

    
    
}

function imageDraw(){
    image(this.img,this.x,this.y,this.imgWidth,this.imgHeight);
}

function drawBall(){
    noStroke()
    fill('red');
    circle(this.x,this.y,20,20);
}

function drawbigBall(){
    noStroke()
    fill(40);
    circle(this.x,this.y,40,40);
}