Avant tout, une petite précision (ça aura son importance pour la suite) ce que tu appelles la classe "data-frequency" n'est pas une classe. C'est un attribut !
Il te suffit donc, lorsque tu cliques sur une touche, récupérer la valeur de l'attributdata-frequency avec la méthodegetAttributesur tone.currentTargetpuis de l'afficher. Dans ton cas, tu nous a mâché le travail en utilisant JQuery, donc c'est vraiment très simple à implémenter.
Il te suffit de modifier un tout petit peu la première instruction de ta fonctioninitializeAppcomme cela :
$('.major, .minor').on('mousedown', e => {
playSound(e.currentTarget.id);
// ici le mode d'affichage (console ou sur la page etc...)
})
Je te mets ci-dessous un codepen dans lequel tu pourras tester ce que je te propose. Ici j'ai choisis d'afficher la fréquence sous les boutons.
Alors j'ai essayé avec le peu de connaissances que j'ai.
Dans mon fichier html, j'ai rajouté
<div id="debugger">Fréquence:</div>
Mais j'ai pas trop pigé le truc avec le
.info Fréquence :
span#debugger
Pour ma fonction js, j'ai modifié comme ça:
function initializeApp() {
$('.major, .minor').on('mousedown', e => playSound(e.currentTarget.id));
let frequence = e.currentTarget.getAttribute("data-frequency")
$('.fa-volume-off').on('click', () => $('#volume-slider').val($('#volume-slider').attr('min')));
$('.fa-volume-up').on('click', () => $('#volume-slider').val($('#volume-slider').attr('max')));
//prevent accidental zooming with a double-tap on touch screens
$('.volume-control, .major, .minor').on('click', e => e.preventDefault());
// Song playback doesn't work on mobile yet, hide the "Play Me A Song" button.
if (typeof window.orientation !== 'undefined') $('button').hide();
}
Ensuite, pour ce qui est du problème, tu dis que ça ne fonctionne pas chez toi. C'est normal, tu as mal appliqué ce que je t'ai donné.
Regarde la première instruction de ta fonction initializeApp. Si on lit en français, on voit :Lorsqu'on clique sur un touche major ou minor, effectue ceci ....
Sauf que la seule chose que tu fais, c'est d’exécuter playSound. Il faut que tu envoie ton event e dans un fonction, qui elle va exécuté playSound ET afficher la fréquence. Comme ceci :
$('.major, .minor').on('mousedown', e => {
playSound(e.currentTarget.id));
let frequence = e.currentTarget.getAttribute("data-frequency"); $("#debugger").html(frequence); })
Alors le mot "Fréquence" s'affiche bien, le réglage du son se fait bien, mais la valeur de la fréquence ne s'affiche pas!
Pour le js, ma fonction est
function initializeApp() {
$('.major, .minor').on('mousedown', e => playSound(e.currentTarget.id));
let frequence = e.currentTarget.getAttribute("data-frequency");
$("#debugger").html(frequence);
$('.fa-volume-off').on('click', () => $('#volume-slider').val($('#volume-slider').attr('min')));
$('.fa-volume-up').on('click', () => $('#volume-slider').val($('#volume-slider').attr('max')));
//prevent accidental zooming with a double-tap on touch screens
$('.volume-control, .major, .minor').on('click', e => e.preventDefault());
// Song playback doesn't work on mobile yet, hide the "Play Me A Song" button.
if (typeof window.orientation !== 'undefined') $('button').hide();
}
Super ça marche mieux! Effectivement j'ai regardé un peu à l'arrache sans me poser vraiment.
Je continue de regarder pour améliorer et adapter le code, et j'aimerai que lors du click sur une touche le son soit lu pendant 4 seconde par exemple. Mais je ne vois pas où paramétrer ce temps. Tu as une idée?
Face a quelqu'un pour qui l'on n'éprouve que de l'aversion et du mépris, les yeux d'un homme deviennent extrêmement froids et cruels.
Affichage d'une variable
× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
Face a quelqu'un pour qui l'on n'éprouve que de l'aversion et du mépris, les yeux d'un homme deviennent extrêmement froids et cruels.
Face a quelqu'un pour qui l'on n'éprouve que de l'aversion et du mépris, les yeux d'un homme deviennent extrêmement froids et cruels.