i have tried to make a text to speech on my web page with the Web Speech API. The problem is when the code is being run in Safari and Firefox (tested only in chrome,edge,firefox and safari yet) it is not being read in the language needed i think because the voice list changes in Safari and the list is again different in Firefox so I could not fix it, I need it to be in Turkish language. (no textID in the html is not an error, it's included in the database record)
<button id="cancelBtn" class="btn btn-outline-danger btn-xs rounded" style="padding: 4px 7px; margin-top: 15px;">Okumayi durdur</button>
<button id="speakBtn" type="button" class="btn btn-outline-primary btn-xs rounded pull-right" style="padding: 4px 7px; margin-top: 15px;">Haberi Oku <i class="fa fa-bullhorn"></i></button>
<?php
$pt=$row['postdetails'];
echo (substr($pt,0));?>
<script>
window.speechSynthesis.onvoiceschanged;
function textToSpeech() {
//alert("Test"); //for test only.
const speech = new SpeechSynthesisUtterance();
let voices = speechSynthesis.getVoices();
let convert = document.getElementById("textID").innerHTML;
speech.text = convert;
speech.volume = 1;
speech.rate = 1;
speech.pitch = 1;
speech.voice = voices[3];
console.log(voices[3]);
speechSynthesis.speak(speech);
}
//function pause() {
// window.speechSynthesis.pause();
//}
function stop() {
window.speechSynthesis.cancel();
}
speakBtn.addEventListener('click', textToSpeech);
//pauseBtn.addEventListener('click', pause);
cancelBtn.addEventListener('click', stop);
</script>