/*Katrina Hu
15104-C
kfh@andrew.cmu.edu
Project10_SonicSketch*/
var eyeSize1 = 10;
var mouthWidth1 = 30;
var eyeSize2 = 10;
var mouthWidth2 = 30;
var eyeSize3 = 10;
var mouthWidth3 = 30;
var eyeSize4 = 10;
var mouthWidth4 = 30;
var evilLaugh;
var womanLaugh;
var maniacalLaugh;
var childLaugh;
function preload() {
evilLaugh = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/evillaugh.wav");
evilLaugh.setVolume(0.5);
womanLaugh = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/womanlaugh.wav");
womanLaugh.setVolume(0.5);
maniacalLaugh = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/maniacallaugh.wav");
maniacalLaugh.setVolume(0.5);
childLaugh = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/childlaugh.wav");
childLaugh.setVolume(0.5);
}
function setup() {
createCanvas(480, 120);
}
function soundSetup() {
}
function draw() {
noStroke();
//blue background
fill(204, 224, 255);
rect(0, 0, 120, 120);
fill(74, 143, 255);
ellipse(60, 60, 100, 100);
fill(0);
ellipse(40, 40, eyeSize1);
ellipse(80, 40, eyeSize1);
fill(255, 255, 255);
ellipse(40, 38, eyeSize1 / 3);
ellipse(80, 38, eyeSize1 / 3);
fill(189, 100, 87);
arc(60, 60, mouthWidth1, 30, 0, PI, CHORD);
//yellow background
fill(255, 252, 204);
rect(120, 0, 120, 120);
fill(255, 246, 82);
ellipse(180, 60, 100, 100);
fill(0);
ellipse(160, 40, eyeSize2);
ellipse(200, 40, eyeSize2);
fill(255, 255, 255);
ellipse(160, 38, eyeSize2 / 3);
ellipse(200, 38, eyeSize2 / 3);
fill(189, 100, 87);
arc(180, 60, mouthWidth2, 30, 0, PI, CHORD);
//pink background
fill(255, 204, 204);
rect(240, 0, 120, 120);
fill(255, 90, 82);
ellipse(300, 60, 100, 100);
fill(0);
ellipse(280, 40, eyeSize3);
ellipse(320, 40, eyeSize3);
fill(255, 255, 255);
ellipse(280, 38, eyeSize3 / 3);
ellipse(320, 38, eyeSize3 / 3);
fill(189, 100, 87);
arc(300, 60, mouthWidth3, 30, 0, PI, CHORD);
//green background
fill(222, 255, 214);
rect(360, 0, 120, 120);
fill(138, 255, 138);
ellipse(420, 60, 100, 100);
fill(0);
ellipse(400, 40, eyeSize4);
ellipse(440, 40, eyeSize4);
fill(255, 255, 255);
ellipse(400, 38, eyeSize4 / 3);
ellipse(440, 38, eyeSize4 / 3);
fill(189, 100, 87);
arc(420, 60, mouthWidth4, 30, 0, PI, CHORD);
}
function mousePressed() {
//play sound if pressed in blue box
if(mouseX <= 120) {
eyeSize1 = random(8, 15);
mouthWidth1 = random(40, 55);
evilLaugh.play();
}
//play sound if pressed in yellow box
if(mouseX > 120 & mouseX <= 240) {
eyeSize2 = random(8, 15);
mouthWidth2 = random(40, 55);
womanLaugh.play();
}
//play sound if pressed in pink box
if(mouseX > 240 & mouseX <= 360) {
eyeSize3 = random(8, 15);
mouthWidth3 = random(40, 55);
maniacalLaugh.play();
}
//play sound if pressed in green box
if(mouseX > 360 & mouseX <= 480) {
eyeSize4 = random(8, 15);
mouthWidth4 = random(40, 55);
childLaugh.play();
}
}
The sounds play when you click on the various 4 faces. Each face has a different laugh, and the facial features change as you click on them as well.