//gretchen kupferschmid
//gkupfers@andrew.cmu.edu
//project 10
//section e
var banana;
var lick;
var mouth;
var eyes;
function preload() {
// call loadImage() and loadSound() for all media files here
banana = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/banana.wav");
lick = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/lick.wav");
mouth = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/mouth.wav");
eyes = loadSound("https://courses.ideate.cmu.edu/15-104/f2019/wp-content/uploads/2019/11/eyes.wav");
}
function setup() {
createCanvas(480, 480);
useSound();
//======== call the following to use sound =========
}
function soundSetup() { // setup for audio generation
banana.setVolume(0.5);
lick.setVolume(0.5);
mouth.setVolume(0.5);
eyes.setVolume(0.5);
}
function draw() {
background(241,198,217);
//mouth lips
noStroke();
fill(255,0,0);
beginShape();
curveVertex(68,359);
curveVertex(101,319);
curveVertex(133,304);
curveVertex(150,312);
curveVertex(175,302);
curveVertex(196,329);
curveVertex(188,360);
curveVertex(197,416);
curveVertex(156,431);
curveVertex(111,404);
curveVertex(68,359);
curveVertex(101,319);
endShape();
//mouth black
fill(0);
beginShape();
curveVertex(87,357);
curveVertex(100,350);
curveVertex(112,337);
curveVertex(130,328);
curveVertex(146,327);
curveVertex(170,320);
curveVertex(181,330);
curveVertex(178,363);
curveVertex(142,363);
curveVertex(87,357);
curveVertex(100,350);
endShape();
//mouth toungue
fill(240,110,270);
noStroke();
beginShape();
curveVertex(84,357);
curveVertex(127,358);
curveVertex(176,365);
curveVertex(177,408);
curveVertex(133,398);
curveVertex(84,357);
curveVertex(127,358);
endShape();
//mouth teeth
fill(255);
beginShape();
curveVertex(107,341);
curveVertex(129,328);
curveVertex(148,327);
curveVertex(171,320);
curveVertex(180,327);
curveVertex(175,340);
curveVertex(158,343);
curveVertex(150,340);
curveVertex(146,342);
curveVertex(127,341);
curveVertex(120,345);
curveVertex(114,340);
curveVertex(107,341);
endShape();
//banana
fill(235,222,176);
beginShape();
curveVertex(325,39);
curveVertex(325,45);
curveVertex(326,10);
curveVertex(336,9);
curveVertex(347,39);
curveVertex(363,77);
curveVertex(352,90);
curveVertex(332,89);
curveVertex(325,39);
endShape();
//banana peel
fill(240,201,66);
beginShape();
curveVertex(304,166);
curveVertex(311,149);
curveVertex(310,102);
curveVertex(318,80);
curveVertex(331,86);
curveVertex(343,92);
curveVertex(349,86);
curveVertex(364,80);
curveVertex(364,64);
curveVertex(407,89);
curveVertex(423,115);
curveVertex(412,117);
curveVertex(395,108);
curveVertex(379,104);
curveVertex(373,96);
curveVertex(383,132);
curveVertex(412,189);
curveVertex(398,194);
curveVertex(372,181);
curveVertex(340,134);
curveVertex(331,104);
curveVertex(329,113);
curveVertex(331,134);
curveVertex(326,161);
curveVertex(306,167);
curveVertex(304,166);
curveVertex(311,149);
endShape();
//banana dots
fill(96,57,19);
ellipse(359,155,6,6);
ellipse(366,160,4,5);
ellipse(363,165,3,5.5);
//ice cream cone
fill(166,124,82);
triangle(337,437,290,310,384,310);
//ice cream cone shadow
fill(124,88,53);
ellipse(337,320,80, 20);
//ice cream
fill(240,110,170);
beginShape();
curveVertex(275,296);
curveVertex(283,279);
curveVertex(299.270);
curveVertex(304,259);
curveVertex(317,255);
curveVertex(321,240);
curveVertex(330,236);
curveVertex(336,220);
curveVertex(349,210);
curveVertex(347,226);
curveVertex(357,234);
curveVertex(362,245);
curveVertex(364,247);
curveVertex(378,256);
curveVertex(362,268);
curveVertex(394,292);
curveVertex(397,311);
curveVertex(352,319);
curveVertex(351,314);
curveVertex(293,316);
curveVertex(277,304);
curveVertex(275,296);
curveVertex(283,279);
endShape();
//eye line
noFill();
stroke(0);
strokeWeight(4);
beginShape();
curveVertex(59,129);
curveVertex(97,102);
curveVertex(150,99);
curveVertex(184,124);
curveVertex(182,128);
curveVertex(152,145);
curveVertex(100,147);
curveVertex(60,132);
curveVertex(59,129);
curveVertex(97,102);
curveVertex(150,99);
endShape();
//eye interior
noStroke();
fill(0,174,239);
ellipse(126,124,50,50);
fill(0);
ellipse(133,119,14,14);
//eyelashes
strokeWeight(4);
stroke(0);
line(65,123,52,108);
line(75,114,64,95);
line(94,104,87,86);
line(108,98,105,82);
line(129,95,130,77);
line(150,99,155,81);
line(163,107,178,88);
line(178,118,192,102);
}
function mousePressed(){
if(mouseX > 305 & mouseX < 423 && mouseY > 7.2 && mouseY < 195){
banana.play();
}
if (mouseX > 275 & mouseX < 398 && mouseY > 211 && mouseY < 436){
lick.play();
}
if (mouseX > 70 & mouseX < 196 && mouseY > 302 && mouseY < 432){
mouth.play();
}
if (mouseX > 52 & mouseX < 192 && mouseY > 76 && mouseY < 150){
eyes.play();
}
}
I wanted to play with icons and the sounds that could possibly go with these when clicked on. I could see myself implementing this into my website later on so that sounds can accompany my illustrations.