ryan
64 lines
1.9 KiB
JavaScript
64 lines
1.9 KiB
JavaScript
const speech = new SpeechSynthesisUtterance();
|
|
|
|
speech.lang = "en";
|
|
|
|
let voices = [];
|
|
let myAudio1 = document.getElementById('myAudio')
|
|
let myAudio2 = document.getElementById('myAudio2')
|
|
|
|
|
|
window.speechSynthesis.onvoiceschanged = () => {
|
|
voices = window.speechSynthesis.getVoices();
|
|
speech.voice = voices[3];
|
|
let voiceSelect = document.querySelector("#voices");
|
|
voices.forEach((voice, i) => (voiceSelect.options[i] = new Option(voice.name, i)));
|
|
};
|
|
|
|
document.querySelector("#rate").addEventListener("input", () => {
|
|
const rate = document.querySelector("#rate").value;
|
|
speech.rate = rate;
|
|
document.querySelector("#rate-label").innerHTML = rate;
|
|
});
|
|
|
|
document.querySelector("#volume").addEventListener("input", () => {
|
|
const volume = document.querySelector("#volume").value;
|
|
speech.volume = volume;
|
|
document.querySelector("#volume-label").innerHTML = volume;
|
|
});
|
|
|
|
document.querySelector("#pitch").addEventListener("input", () => {
|
|
const pitch = document.querySelector("#pitch").value;
|
|
speech.pitch = pitch;
|
|
document.querySelector("#pitch-label").innerHTML = pitch;
|
|
});
|
|
|
|
document.querySelector("#voices").addEventListener("change", () => {
|
|
speech.voice = voices[document.querySelector("#voices").value];
|
|
});
|
|
|
|
|
|
|
|
document.querySelector("#start").addEventListener("click", () => {
|
|
speech.text = document.querySelector("textarea").value;
|
|
const pitch = document.getElementById("pitch").value;
|
|
speech.pitch = pitch;
|
|
|
|
myAudio1.volume=0.4;
|
|
myAudio2.volume=0.4;
|
|
myAudio1.play();
|
|
if( myAudio1.addEventListener('ended',()=>{window.speechSynthesis.speak(speech);}));
|
|
speech.addEventListener('end',()=>{myAudio2.play()});
|
|
|
|
});
|
|
|
|
document.querySelector("#pause").addEventListener("click", () => {
|
|
window.speechSynthesis.pause();
|
|
});
|
|
|
|
document.querySelector("#resume").addEventListener("click", () => {
|
|
window.speechSynthesis.resume();
|
|
});
|
|
|
|
document.querySelector("#cancel").addEventListener("click", () => {
|
|
window.speechSynthesis.cancel();
|
|
}); |