Project 10: Sonic Story

sketch
``````//Christy Zo
//Section C

var cricketSound;
var roosterSound;
var cowSound;
var pigSound;
var sunHue;

function preload() {
cricketSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/cricketSound.wav");
roosterSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/roosterSound.wav");
cowSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/cowSound.wav");
pigSound = loadSound("https://courses.ideate.cmu.edu/15-104/f2021/wp-content/uploads/2021/11/pigSound.wav")
}

function soundSetup() {
osc = new p5.TriOsc();
}
function setup() {
createCanvas(600, 300);
useSound();
frameRate(30);
}

function barn(x) {
stroke(255);
strokeWeight(2);
fill(50);
rect(x, 100, 200, 150);
fill(255);
rect(x+10, 110, 180, 80);
fill(50);
rect(x+10, 200, 180, 40);
line(x+10, 200, x+190, 240);
line(x+10, 240, x+190, 200);
triangle(x, 100, x+200, 100, x+100, 30);
triangle(x+15, 100, x+185, 100, x+100, 40);
}

function rooster(x) {
stroke(0);
fill(255);
line(x, 150, x-30, 190);
line(x, 150, x+30, 190);
circle(x, 150, 50);
fill(220);
circle(x, 180, 20);
triangle(x, 140, x-10, 110, x+10, 110);
fill(150);
triangle(x, 150, x-10, 160, x+10, 160);
triangle(x, 170, x-10, 160, x+10, 160);
fill(255);
circle(x-10, 145, 5);
circle(x+10, 145, 5);

}

function cow(x) {
fill(255);
stroke(0);
rect(x, 125, 50, 50);
fill(200);
ellipse(x+25, 170, 52, 30); //nose
fill(255);
circle(x+12, 170, 10);
circle(x+37, 170, 10);
circle(x+15, 145, 5);
circle(x+35, 145, 5);
ellipse(x-10, 125, 25, 10); //ears
ellipse(x+55, 125, 25, 10);
line(x, 150, x-30, 190);
line(x+50, 150, x+80, 190);

}

function pig(x) {
line(x, 150, x-30, 190);
line(x, 150, x+30, 190);
circle(x, 150, 60);
circle(x-10, 145, 5);
circle(x+10, 145, 5);
fill(150);
ellipse(x, 160, 30, 15);
fill(255);
circle(x-5, 160, 5);
circle(x+5, 160, 5);
fill(100);
triangle(x-20, 120, x-25, 130, x-15, 125);
triangle(x+20, 120, x+25, 130, x+15, 125);

}

var light = 0;
var position = 255;
function draw() {

background(light);
fill(light);
rect(0, 0, 600, 300);

sunHue = map(position, 0, height, 255, 0);
fill(sunHue, 150, 0);
ellipse(200, position, 50, 50);
if (position < -50) {
position = 300;
light = 0;
frameCount = 0;

}
fill(220);
noStroke();
rect(0, 200, 600, 300);
barn(0);
barn(200);
barn(400);

rooster(100);
cow(275);
pig(500);

light = light + 1;
position = position - 1;
if (frameCount == 30) {
cricketSound.play();
}
if (frameCount == 80) {
roosterSound.play();

} else if (frameCount == 140) {
cowSound.play();
} else if (frameCount == 200) {
pigSound.play();
}

if (roosterSound.isPlaying()) {
fill(255,0,0);
circle(100, 180, 20);
triangle(100, 140, 90, 110, 110, 110);
fill(255,255,0);
triangle(100, 150, 100-10, 160, 100+10, 160);
triangle(100, 170, 100-10, 160, 100+10, 160);
} else if (cowSound.isPlaying()) {
fill(165,42,42);
ellipse(275+25, 170, 52, 30);
fill(255);
circle(275+12, 170, 10);
circle(275+37, 170, 10);
} else if (pigSound.isPlaying()) {
fill(255, 192, 203);
triangle(500-20, 120, 500-25, 130, 500-15, 125);
triangle(500+20, 120, 500+25, 130, 500+15, 125);
ellipse(500, 160, 30, 15);
fill(255);
circle(500-5, 160, 5);
circle(500+5, 160, 5);

}

}

``````

I was reminded of the story Animal Farm, and wanted to create a simple yet cute! I wanted to make everything greyscale, but emphasize the colors when each of the animals sound play!