Apprendre le javascript (suite) : les fonctions
Reprendre le livre JavaScript Éloquent et lire maintenant le chapitre suivant (mais ne pas y passer plus d’une séance, tant pis si vous n’avez pas tout lu) :
Application n°2 : Transformer votre clavier en piano
Cette fois on travaillera avec le fichier application-2_piano.js. Vérifier qu’il est bien appelé par le fichier HTML application-2_piano.html. Au passage vous remarquerez qu’en plus de la bibliothèque p5.js on utilise p5.sound.js (qui est la partie de p5.js qui permet de gérer les sons). La documentation de la bibliothèque p5.sound.js se trouve ici.
Ouvrir le fichier application-2_piano.js avec un éditeur. Vous observerez qu’il contient déjà :
- une fonction setup() qui est appelée par p5.js au démarrage du programme.
- une fonction draw() appelée une fois par seconde [grâce à la ligne frameRate(1); dans setup()] et qui est utilisée pour battre la mesure.
- une fonction jouerFrequence() qui, comme son nom l’indique, permet de jouer un son d’une fréquence donnée.
- une fonction keyTyped() qui est appelée par p5.js chaque fois qu’une touche du clavier est enfoncée. Pour le moment cette fonction ne fait rien.
- une fonction keyReleased() qui coupe le son lorsque une touche du clavier est relâchée.
Ouvrir le fichier application-2_piano.html dans un navigateur. Normalement vous devez avoir le son de la mesure (un bruit de tambour, une fois par seconde). Vérifier que le son fonctionne (utiliser des écouteurs pour ne pas déranger vos voisins).
Le but de cette partie est de transformer le clavier de l’ordinateur en piano, capable de jouer des notes sur plusieurs octaves.
Pour cela, on donne les fréquences des notes pour l’octave n°3 :
Note | do3 | ré3 | mi3 | fa3 | sol3 | la3 | si3 |
Fréquences (Hz) | 261.63 | 293.66 | 329.63 | 349.23 | 392.00 | 440.00 | 493.88 |
Sachant que pour une autre octave les notes s’en déduisent par :
fréquence de l’octave n = fréquence de l’octave 3 multipliée par (2 à la puissance [n-3])
Travail à effectuer :
n° | Tâche | Indications |
---|---|---|
1 | Compléter le commentaire en en-tête du programme en indiquant votre nom et la date. |
|
2 | Jouer un do3 chaque fois qu’une touche est pressée. |
|
3 | Créer la fonction frequence() qui prend comme argument la note à jouer sous forme de chaîne de caractère (do, ré, mi…) et renvoie la fréquence correspondante (pour l’octave n°3). |
|
4 | Modifier la fonction frequence() de manière qu’elle prenne comme argument le numéro d’octave, en plus de la note à jouer et renvoie toujours la fréquence de la note demandée. |
|
5 | Faire que les touches « a » à « u » du clavier jouent les notes de l’octave n°2 (« a » joue do2, « z » joue ré2, « e » joue mi2, etc.), les touches « q » à « j » les notes de l’octave n°3 et les touches « w » à « , » les notes de l’octave n°4. |
|
6 | Stocker la couleur du fond dans une variable et l’utiliser pour changer la couleur du fond. |
|