You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
68 lines
1.9 KiB
JavaScript
68 lines
1.9 KiB
JavaScript
var synth = window.speechSynthesis;
|
|
|
|
var inputForm = document.querySelector('form');
|
|
var inputTxt = document.querySelector('.txt');
|
|
var voiceSelect = document.querySelector('select');
|
|
|
|
var pitch = document.querySelector('#pitch');
|
|
var pitchValue = document.querySelector('.pitch-value');
|
|
var rate = document.querySelector('#rate');
|
|
var rateValue = document.querySelector('.rate-value');
|
|
|
|
var voices = [];
|
|
|
|
function populateVoiceList() {
|
|
voices = synth.getVoices();
|
|
var selectedIndex = voiceSelect.selectedIndex < 0 ? 0 : voiceSelect.selectedIndex;
|
|
voiceSelect.innerHTML = '';
|
|
for(i = 0; i < voices.length ; i++) {
|
|
var option = document.createElement('option');
|
|
option.textContent = voices[i].name + ' (' + voices[i].lang + ')';
|
|
|
|
if(voices[i].default) {
|
|
option.textContent += ' -- DEFAULT';
|
|
}
|
|
|
|
option.setAttribute('data-lang', voices[i].lang);
|
|
option.setAttribute('data-name', voices[i].name);
|
|
voiceSelect.appendChild(option);
|
|
}
|
|
voiceSelect.selectedIndex = selectedIndex;
|
|
}
|
|
|
|
populateVoiceList();
|
|
if (speechSynthesis.onvoiceschanged !== undefined) {
|
|
speechSynthesis.onvoiceschanged = populateVoiceList;
|
|
}
|
|
|
|
inputForm.onsubmit = function(event) {
|
|
event.preventDefault();
|
|
|
|
var utterThis = new SpeechSynthesisUtterance(inputTxt.value);
|
|
var selectedOption = voiceSelect.selectedOptions[0].getAttribute('data-name');
|
|
for(i = 0; i < voices.length ; i++) {
|
|
if(voices[i].name === selectedOption) {
|
|
utterThis.voice = voices[i];
|
|
}
|
|
}
|
|
utterThis.pitch = pitch.value;
|
|
utterThis.rate = rate.value;
|
|
synth.speak(utterThis);
|
|
|
|
utterThis.onpause = function(event) {
|
|
var char = event.utterance.text.charAt(event.charIndex);
|
|
console.log('Speech paused at character ' + event.charIndex + ' of "' +
|
|
event.utterance.text + '", which is "' + char + '".');
|
|
}
|
|
|
|
inputTxt.blur();
|
|
}
|
|
|
|
pitch.onchange = function() {
|
|
pitchValue.textContent = pitch.value;
|
|
}
|
|
|
|
rate.onchange = function() {
|
|
rateValue.textContent = rate.value;
|
|
}
|