Update app.py

app.py

@@ -12,12 +12,13 @@ speech_recognition_html = """
       var recognition = new webkitSpeechRecognition();
       recognition.continuous = false;  // Stops after speech input
       recognition.interimResults = true;
-      
+      recognition.lang = "en-US";  // Set the language for recognition
+
       recognition.onresult = function(event) {
         var transcript = event.results[event.resultIndex][0].transcript;
         document.getElementById('output').textContent = transcript;
         // Send transcript back to Streamlit using postMessage
-        window.parent.postMessage(JSON.stringify({func: 'update_output', transcript: transcript}), '*');
+        window.parent.postMessage({func: 'update_output', transcript: transcript}, '*');
       };
 
       recognition.onerror = function(event) {
@@ -26,7 +27,12 @@ speech_recognition_html = """
       };
 
       function startRecognition() {
-        recognition.start();
+        try {
+          recognition.start();
+        } catch (error) {
+          console.error("Error starting recognition:", error);
+          document.getElementById('output').textContent = "Error starting recognition";
+        }
       }
     </script>
   </body>
@@ -45,8 +51,6 @@ output = st.empty()
 
 # The Streamlit component listens for the postMessage event and updates the output
 st.write("Recognized Text:")
-
-# In Streamlit, we capture the transcript message sent via postMessage
 transcript = st.text_area("Transcript:", "", height=150)
 
-# You can handle the `postMessage` event by using the `streamlit.components.v1` methods for client-server interaction.
+# JavaScript is sending postMessage with 'update_output' func, you need to listen for this in the frontend