voix_selectionnee

This commit is contained in:
2026-01-20 13:28:07 +01:00
parent e751847130
commit 1859ff1685

View File

@@ -63,17 +63,12 @@ body > main {
content: "😸 "; content: "😸 ";
} }
/*#question {
padding-right: 2rem;
}*/
#bouton_reconnaissance_vocale { #bouton_reconnaissance_vocale {
position: absolute; position: absolute;
right: 0; right: 0;
width: 2rem; width: 2rem;
height: 100%; height: 100%;
padding-left: 0; padding-left: 0;
padding-right: 0.5rem;
border: none; border: none;
z-index: 10; z-index: 10;
} }
@@ -122,7 +117,7 @@ body > main {
<fieldset> <fieldset>
<label for="select_voix">Voix disponibles :</label> <label for="select_voix">Voix disponibles :</label>
<select id="select_voix"> <select id="select_voix">
<option value="">Pas de synthèse vocale</option> <option value="" selected>Pas de synthèse vocale</option>
</select> </select>
</fieldset> </fieldset>
</form> </form>
@@ -146,6 +141,8 @@ const bouton_annuler = document.getElementById('bouton_annuler');
const bouton_ok = document.getElementById('bouton_ok'); const bouton_ok = document.getElementById('bouton_ok');
const footer = document.querySelector('footer'); const footer = document.querySelector('footer');
const langue = document.documentElement.lang; const langue = document.documentElement.lang;
let voix_selectionnee = null;
let utterance = null; let utterance = null;
question.onkeydown = function(e) { question.onkeydown = function(e) {
@@ -187,7 +184,7 @@ formulaire.addEventListener('submit', async (e) => {
const reponse = await requete.text(); const reponse = await requete.text();
paragraphe.setAttribute('aria-busy', 'false'); paragraphe.setAttribute('aria-busy', 'false');
if (utterance?.voice) { if (voix_selectionnee) {
utterance.text = reponse; utterance.text = reponse;
speechSynthesis.speak(utterance); speechSynthesis.speak(utterance);
} }
@@ -231,28 +228,20 @@ function charger_voix() {
} }
speechSynthesis.removeEventListener('voiceschanged', charger_voix); speechSynthesis.removeEventListener('voiceschanged', charger_voix);
utterance = new SpeechSynthesisUtterance();
utterance.lang = langue;
utterance.rate = 1;
liste_voix.forEach((voix, i) => { liste_voix.forEach((voix, i) => {
const option = document.createElement('option'); const option = document.createElement('option');
option.value = i; option.value = i;
option.textContent = `${voix.name} (${voix.lang})`; option.textContent = voix.name;
select_voix.appendChild(option); select_voix.appendChild(option);
if (voix.voiceURI === window.localStorage.getItem('voix')) { if (voix.voiceURI === voix_selectionnee) {
option.selected = true;
select_voix.value = i; select_voix.value = i;
utterance.voice = voix; utterance.voice = voix;
option.selected = true;
bouton_synthese_vocale.innerHTML = `<i class="bi bi-volume-up-fill"></i>`; bouton_synthese_vocale.innerHTML = `<i class="bi bi-volume-up-fill"></i>`;
} }
}) })
bouton_synthese_vocale.disabled = false;
bouton_synthese_vocale.onclick = function() {
boite_synthese_vocale.showModal();
};
bouton_fermer.onclick = bouton_annuler.onclick = function() { bouton_fermer.onclick = bouton_annuler.onclick = function() {
boite_synthese_vocale.close(); boite_synthese_vocale.close();
}; };
@@ -261,18 +250,30 @@ function charger_voix() {
if (select_voix.value) { if (select_voix.value) {
let voix = liste_voix[select_voix.value]; let voix = liste_voix[select_voix.value];
utterance.voice = voix; utterance.voice = voix;
window.localStorage.setItem('voix', voix.voiceURI); voix_selectionnee = voix.voiceURI;
window.localStorage.setItem('voiceURI', voix.voiceURI);
bouton_synthese_vocale.innerHTML = `<i class="bi bi-volume-up-fill"></i>`; bouton_synthese_vocale.innerHTML = `<i class="bi bi-volume-up-fill"></i>`;
} else { } else {
utterance.voice = null; voix_selectionnee = null;
window.localStorage.removeItem('voix'); window.localStorage.removeItem('voiceURI');
bouton_synthese_vocale.innerHTML = `<i class="bi bi-volume-off-fill"></i>`; bouton_synthese_vocale.innerHTML = `<i class="bi bi-volume-off-fill"></i>`;
} }
}; };
bouton_synthese_vocale.onclick = function() {
boite_synthese_vocale.showModal();
};
bouton_synthese_vocale.disabled = false;
} }
if ('speechSynthesis' in window) { if ('speechSynthesis' in window) {
bouton_synthese_vocale.style.display = 'block'; voix_selectionnee = window.localStorage.getItem('voiceURI');
utterance = new SpeechSynthesisUtterance();
utterance.lang = langue;
utterance.rate = 1;
charger_voix(); charger_voix();
bouton_synthese_vocale.style.display = 'block';
} }
// Reconnaissance vocale // Reconnaissance vocale