chris/main_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixed up speak

Browse Source
This commit is contained in:
chris 2022-03-03 22:06:25 -05:00
parent fbb35d0b11
commit 8ad178b02f
4 changed files with 27 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.vscode/settings.json vendored Normal file
View File

@ -0,0 +1,3 @@
{
"liveServer.settings.port": 5501
}

2
speak/index.html
View File

@ -7,7 +7,7 @@
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
<link rel="stylesheet" type="text/css" href="/menu/menu.css"> <link rel="stylesheet" type="text/css" href="/menu/menu.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<title>Document</title> <title>Speak</title>
<style> <style>
</style> </style>

29
speak/script.js
View File

@ -5,6 +5,22 @@ const textInput = document.getElementById('text')
const speedInput = document.getElementById('speed') const speedInput = document.getElementById('speed')
let currentCharacter let currentCharacter
const utterance = new SpeechSynthesisUtterance()
utterance.addEventListener('end', () => {
textInput.disabled = false
})
utterance.addEventListener('boundary', e => {
currentCharacter = e.charIndex
})
playButton.addEventListener('click', () => { playButton.addEventListener('click', () => {
playText(textInput.value) playText(textInput.value)
}) })
@ -15,14 +31,6 @@ speedInput.addEventListener('input', () => {
playText(utterance.text.substring(currentCharacter)) playText(utterance.text.substring(currentCharacter))
}) })
const utterance = new SpeechSynthesisUtterance()
utterance.addEventListener('end', () => {
textInput.disabled = false
})
utterance.addEventListener('boundary', e => {
currentCharacter = e.charIndex
})
function playText(text) { function playText(text) {
if (speechSynthesis.paused && speechSynthesis.speaking) { if (speechSynthesis.paused && speechSynthesis.speaking) {
@ -40,6 +48,7 @@ function pauseText() {
} }
function stopText() { function stopText() {
speechSynthesis.resume() speechSynthesis.resume();
speechSynthesis.cancel() speechSynthesis.cancel();
document.getElementById("text").value = ""
} }

5
speak/style.css
View File

@ -11,7 +11,7 @@ display: flex;
justify-self: center; justify-self: center;
margin: auto; margin: auto;
width: 75%; width: 75%;
margin-top: 40%; margin-top: 30vh;
padding: 7px; padding: 7px;
border-radius: 15px; border-radius: 15px;
font-size: 2rem; font-size: 2rem;
@ -27,6 +27,9 @@ label{
width: 1rem; width: 1rem;
} }
#pause-button{
display: none;
}
.buttons_div{ .buttons_div{
display: flex; display: flex;
flex-direction: row; flex-direction: row;