reconnaissance vocale
This commit is contained in:
File diff suppressed because it is too large
Load Diff
55
index.html
55
index.html
@@ -62,9 +62,13 @@ body > main {
|
||||
content: "😸 ";
|
||||
}
|
||||
|
||||
#bouton_reconnaissance_vocale {
|
||||
padding: 0.7rem;
|
||||
}
|
||||
|
||||
@media print {
|
||||
#bouton_synthese_vocale,
|
||||
#formulaire{
|
||||
#formulaire {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -75,7 +79,7 @@ body > main {
|
||||
<header>
|
||||
<nav class="container">
|
||||
<h1>Chat<small><em>βeta</em><span style="color: #9B2318">*</span></small></h1>
|
||||
<button id="bouton_synthese_vocale" type="button" class="secondary style="display: none;">🕨</button>
|
||||
<button id="bouton_synthese_vocale" type="button" class="secondary" style="display: none;" disabled>🔈</button>
|
||||
</nav>
|
||||
</header>
|
||||
<main class="container overflow-auto" id="conversation">
|
||||
@@ -84,6 +88,7 @@ body > main {
|
||||
<footer class="container">
|
||||
<form id="formulaire" action="question.php" method="post" role="group">
|
||||
<textarea id="question" name="question" placeholder="Ma question" required></textarea>
|
||||
<button id="bouton_reconnaissance_vocale" type="button" class="outline secondary" style="display: none;">🎙️</button>
|
||||
<button id="bouton_envoyer" type="submit">?</button>
|
||||
</form>
|
||||
</footer>
|
||||
@@ -92,12 +97,12 @@ body > main {
|
||||
<header>
|
||||
<button id="bouton_fermer" aria-label="Close" rel="prev"></button>
|
||||
<p>
|
||||
<strong>🕪 Synthèse vocale</strong>
|
||||
<strong>🔊 Synthèse vocale</strong>
|
||||
</p>
|
||||
</header>
|
||||
<form>
|
||||
<fieldset>
|
||||
<label>Voix disponibles</label>
|
||||
<label>Voix disponibles :</label>
|
||||
<select id="select_voix">
|
||||
<option value="">Pas de synthèse vocale</option>
|
||||
</select>
|
||||
@@ -130,7 +135,7 @@ body > main {
|
||||
select_voix.innerHTML = aphone;
|
||||
|
||||
if (!liste_voix.length) {
|
||||
bouton_synthese_vocale.style.display = 'none';
|
||||
bouton_synthese_vocale.disabled = true;
|
||||
speechSynthesis.addEventListener('voiceschanged', charger_voix);
|
||||
return;
|
||||
}
|
||||
@@ -145,11 +150,11 @@ body > main {
|
||||
select_voix.value = i;
|
||||
voix = v;
|
||||
option.selected = true;
|
||||
bouton_synthese_vocale.innerHTML = "🕪";
|
||||
bouton_synthese_vocale.innerHTML = "🔊";
|
||||
}
|
||||
})
|
||||
|
||||
bouton_synthese_vocale.style.display = 'block';
|
||||
bouton_synthese_vocale.disabled = false;
|
||||
bouton_synthese_vocale.addEventListener('click', () => {
|
||||
boite_synthese_vocale.showModal();
|
||||
});
|
||||
@@ -164,15 +169,45 @@ body > main {
|
||||
if (select_voix.value) {
|
||||
voix = liste_voix[select_voix.value];
|
||||
window.localStorage.setItem('voix', voix.voiceURI);
|
||||
bouton_synthese_vocale.innerHTML = "🕪";
|
||||
bouton_synthese_vocale.innerHTML = "🔊";
|
||||
} else {
|
||||
voix = null;
|
||||
window.localStorage.removeItem('voix');
|
||||
bouton_synthese_vocale.innerHTML = "🕨";
|
||||
bouton_synthese_vocale.innerHTML = "🔈";
|
||||
}
|
||||
});
|
||||
}
|
||||
if ('speechSynthesis' in window) charger_voix();
|
||||
if ('speechSynthesis' in window) {
|
||||
bouton_synthese_vocale.style.display = 'block';
|
||||
charger_voix();
|
||||
}
|
||||
|
||||
var SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
|
||||
if (SpeechRecognition) {
|
||||
bouton_reconnaissance_vocale.addEventListener('click', () => {
|
||||
const reconnaissance= new SpeechRecognition();
|
||||
reconnaissance.lang = langue;
|
||||
bouton_reconnaissance_vocale_inner_HTML = bouton_reconnaissance_vocale.innerHTML
|
||||
bouton_reconnaissance_vocale.innerHTML = ""
|
||||
bouton_reconnaissance_vocale.setAttribute("aria-busy", true)
|
||||
reconnaissance.addEventListener('result', (event) => {
|
||||
const transcript = event.results[0][0].transcript;
|
||||
question.value = transcript;
|
||||
formulaire.requestSubmit()
|
||||
});
|
||||
reconnaissance.addEventListener('speechend', () => {
|
||||
reconnaissance.stop();
|
||||
bouton_reconnaissance_vocale.setAttribute("aria-busy", false)
|
||||
bouton_reconnaissance_vocale.innerHTML = bouton_reconnaissance_vocale_inner_HTML
|
||||
});
|
||||
reconnaissance.addEventListener('error', (event) => {
|
||||
bouton_reconnaissance_vocale.setAttribute("aria-busy", false)
|
||||
bouton_reconnaissance_vocale.innerHTML = bouton_reconnaissance_vocale_inner_HTML
|
||||
});
|
||||
reconnaissance.start();
|
||||
});
|
||||
bouton_reconnaissance_vocale.style.display = 'block';
|
||||
}
|
||||
|
||||
question.addEventListener('keydown', e => {
|
||||
if (e.key === 'Enter' && !e.ctrlKey && !e.shiftKey) {
|
||||
|
||||
Reference in New Issue
Block a user