Spaces:
Running
Running
| <html> | |
| <head> | |
| <title>Simple Speech Demo</title> | |
| <style> | |
| body { font-family: sans-serif; padding: 20px; } | |
| button { padding: 10px 20px; margin: 10px 0; } | |
| #status { margin: 10px 0; } | |
| </style> | |
| </head> | |
| <body> | |
| <h1>Simple Speech Demo</h1> | |
| <button id="start">Start Listening</button> | |
| <div id="status">Ready</div> | |
| <div id="output"></div> | |
| <script> | |
| if (!('webkitSpeechRecognition' in window)) { | |
| alert('Speech recognition not supported'); | |
| } else { | |
| const recognition = new webkitSpeechRecognition(); | |
| const startButton = document.getElementById('start'); | |
| const status = document.getElementById('status'); | |
| const output = document.getElementById('output'); | |
| recognition.continuous = false; | |
| recognition.interimResults = false; | |
| startButton.onclick = () => { | |
| try { | |
| recognition.start(); | |
| status.textContent = 'Listening...'; | |
| startButton.disabled = true; | |
| } catch (e) { | |
| console.error(e); | |
| status.textContent = 'Error: ' + e.message; | |
| } | |
| }; | |
| recognition.onresult = (event) => { | |
| const text = event.results[0][0].transcript; | |
| output.textContent = 'You said: ' + text; | |
| }; | |
| recognition.onend = () => { | |
| status.textContent = 'Ready'; | |
| startButton.disabled = false; | |
| }; | |
| recognition.onerror = (event) => { | |
| status.textContent = 'Error: ' + event.error; | |
| startButton.disabled = false; | |
| }; | |
| } | |
| </script> | |
| </body> | |
| </html> |