Salve, come da oggetto chiedo un parere su questo codice
const audioPlayer1 = document.getElementById("audioPlayer1");
const audioPlayer2 = document.getElementById("audioPlayer2");
let interval;
function fade(audio, fadeType) {
if (fadeType === 'out') {
let volume = audio.volume;
interval = setInterval(() => {
volume -= 0.01;
audio.volume = volume;
if (volume <= 0.01) {
clearInterval(interval);
audio.pause();
}
}, 100);
} else if (fadeType === 'in') {
let volume = 0;
interval = setInterval(() => {
volume += 0.01;
audio.volume = volume;
if (volume >= 1) {
clearInterval(interval);
}
}, 100);
}
}
Le mie domande sono: alla verifica del volume (volume = 0.01 e volume = 1) è sufficiente il clearInterval ad arrestare il ciclo? Perché sembra che il volume continui a variare.
Avendo più sotto questo
if (audioPlayer1.paused) { //Controllo per stabilire quale Player è in esecuzione e dunque stabilire quale eseguirà il file audio
if (audioPlayer1 && audioPlayer2.paused) { //se entrambi i player sono in pausa allora esegue il file audio nel player1 e lo fa partire
audioPlayer1.src = this.dataset.src
audioPlayer1.volume = 1;
audioPlayer1.play();
} else {
clearInterval(interval);
fade(audioPlayer2,'out');
audioPlayer1.src = this.dataset.src;
audioPlayer1.play();
fade(audioPlayer1,'in');
}
} else if (audioPlayer2.paused) {
if (audioPlayer2 && audioPlayer1.paused) {
audioPlayer2.src = this.dataset.src
audioPlayer2.volume = 1;
audioPlayer2.play();
} else {
clearInterval(interval);
//audioPlayer2.volume = 0;
audioPlayer2.src = this.dataset.src;
fade(audioPlayer2,'in');
fade(audioPlayer1,'out');
audioPlayer2.play();
}
}
la variabile interval conviene che sia globale o conviene metterla all'interno dalla funzione.
E un'ultima domanda: per far funzionare lo script anche su smartphone e tablet cosa dovrei fare? Consigliatemi per piacere cosa studiare.
Grazie e saluti