Update index.html

index.html

@@ -187,6 +187,7 @@
         let dataArray;
         let bars;
         let animationId;
+        let isListening = false;
 
         function createVisualizer() {
             const barCount = 64;
@@ -265,6 +266,16 @@
             source.start();
         }
 
+
+        async function toggleListening() {
+            if (isListening) {
+                await stopListening();
+            } else {
+                await startListening();
+            }
+        }
+      
+
         async function startListening() {
             try {
                 audioContext = new (window.AudioContext || window.webkitAudioContext)();
@@ -290,7 +301,7 @@
 
                 await myvad.start();
                 startButton.textContent = 'End Call';
-                startButton.onclick = stopListening;
+                isListening = true;
                 addLog('System: Listening...');
             } catch (error) {
                 console.error('Error starting VAD:', error);
@@ -298,18 +309,18 @@
             }
         }
 
-        function stopListening() {
+        async function stopListening() {
             if (myvad) {
-                myvad.pause();
+                await myvad.pause();
                 startButton.textContent = 'Begin Call';
-                startButton.onclick = startListening;
+                isListening = false;
                 addLog('System: Stopped listening.');
                 cancelAnimationFrame(animationId);
                 addLog('websocket closed');
             }
         }
 
-        startButton.addEventListener('click', startListening);
+        startButton.addEventListener('click', toggleListening);
         clearLogsButton.addEventListener('click', () => {
             logsDiv.innerHTML = '';
         });