Update mic_component.js

mic_component.js

@@ -1,41 +1,34 @@
-const recordAudio = () => {
-    return new Promise(async resolve => {
-        const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-        const mediaRecorder = new MediaRecorder(stream);
-        const audioChunks = [];
-
-        mediaRecorder.addEventListener("dataavailable", event => {
-            audioChunks.push(event.data);
-        });
-
-        const start = () => mediaRecorder.start();
-
-        const stop = () => {
-            return new Promise(resolve => {
-                mediaRecorder.addEventListener("stop", () => {
-                    const audioBlob = new Blob(audioChunks);
-                    const audioUrl = URL.createObjectURL(audioBlob);
-                    const audio = new Audio(audioUrl);
-                    const play = () => audio.play();
-                    resolve({ audioBlob, audioUrl, play });
-                });
-
-                mediaRecorder.stop();
-            });
+const recordButton = document.getElementById("recordButton");
+  const stopButton = document.getElementById("stopButton");
+  const audioChunks = [];
+
+  let mediaRecorder;
+  
+  navigator.mediaDevices.getUserMedia({ audio: true })
+    .then(function(stream) {
+      mediaRecorder = new MediaRecorder(stream);
+
+      recordButton.onclick = function() {
+        mediaRecorder.start();
+        console.log("Recording started...");
+      };
+
+      stopButton.onclick = function() {
+        mediaRecorder.stop();
+        console.log("Recording stopped...");
+      };
+
+      mediaRecorder.ondataavailable = function(e) {
+        audioChunks.push(e.data);
+      };
+
+      mediaRecorder.onstop = function(e) {
+        const audioBlob = new Blob(audioChunks, { type: "audio/wav" });
+        const reader = new FileReader();
+        reader.readAsDataURL(audioBlob);
+        reader.onloadend = function() {
+          const base64data = reader.result.split(',')[1];
+          Streamlit.setComponentValue(base64data);
         };
-
-        resolve({ start, stop });
-    });
-};
-
-const sleep = time => new Promise(resolve => setTimeout(resolve, time));
-
-const handleAction = async () => {
-    const recorder = await recordAudio();
-    recorder.start();
-    await sleep(3000);
-    const audio = await recorder.stop();
-    audio.play();
-};
-
-document.querySelector("button").addEventListener("click", handleAction);
+      };
+    });