let mic;
let eyeHeight=10;
function setup() {
mic=new p5.AudioIn();
mic.start();
createCanvas(600,400);
}
function preload(){
apropat=loadsound("https://od.lk/s/NjVfNTg5ODk5MDVf/apropat.mp3");
apropat=loadsound("https://od.lk/s/NjVfNTg5ODk5MDNf/noapropis.mp3");
}
function draw() {
let vol=mic.getLevel
mouthHeight=map(vol0,1,0,400);
let distance=dist(mouseX,mouseY,300,200);
if(distance<100){text("NO TE ACERQUES",20,20);}
else{text("acercate",20,40)}
if(mouseIsPressed){
eyeHeight++;
if(eyeHeight>70){eyeHeight=10}
//background(220);
fill(224, 238, 10);
ellipse(300,200,250,300);// cara
fill(0,0,0);
ellipse(250,150,40,70);// ojo izquierdo
ellipse(350,150,40,eyeHeight);// ojo derecho
fill(0,0,0) ;
arc(width/2,height/2+50,100,35,PI,0);// boca
}else{
// background(220);
fill(238, 10, 210);
ellipse(300,200,250,300);// cara
fill(6, 247, 193);
ellipse(250,150,40,70);// ojo izquierdo
ellipse(350,150,40,eyeHeight);// ojo derecho
fill(238, 21, 10) ;
arc(width/2,height/2+50,100,35,0,PI);// boca
}
}
a la linia 1 i 2 explicaquin tipus de documentes: html, significa Hipertext markup language,en catala llenguatge de marques (<>) de hipertext vol dir que va mes enlla del text, imatges, videos, microfon ,camera, teclat, ratoli
la linea 4 hi a head, que vol dir encapçalament, que es la part del codi que es obligatori de posar al principi
a la linea 5 i la 6 hi ha codis meta, que significa metainformacio, que vol dir informacio sobre la informacio
la linia 5 ens dona metainformacio de caracters, significa conjunt de caracters es a dir, les lletres i els numeros que acepta el codi, per exemple: alfabet llati i grec
A la linia 6 hi ha un codi meta que fa el disseny adaptable (responsive desing) es a dir, que es pugui veure be en altres dispositius (mobil, tablet, pc, televisio, pantalla de cinema). Aixo es degut a que posa en el codi width= devicewidth que significa que la amplada de que estem fent es igual a l'amplada del aparell
A la linia 7 hi ha una etiqueta o tag en angles, que posa title. Serveix per posar titol al nom de la pestanya. Una pestanya es una pagina web que apareix en el navegador
De la linia 8 a la linia 13 hi ha una etiqueta de estil que dintre del body o cos, posa que el margin i el padding ha de ser 0 i aixo vol dir que el marge interior i exterior sigui nul es a dir que no hi hagi
De la linia 14 a la 18 tenen en comu les etuiquetes script y src. Script significa un tipus de
llenguatge diferent concretamen javascript que permet conectar amb uns arxius del mateix tipus
javascript que es troben en un altre lloc d eneocities o en un altre lloc web. src significa source, que vol dir el lloc on es troba allotjat.
a la linea 32 hi ha un exemple de com sa de posar una imatge, necesites la etiqueta ing que vol dir imatge
Despres la etiqueta hi ha unes paraules o propietats
La primera propietat que apareix es diu src que vol dir source ,es a dir el nom de la imatge