[groq] Research: NotebookLM — create audio overview of SOUL.md as podcast (#293) (#371)

app.js

@@ -2776,7 +2776,8 @@ document.getElementById('audio-toggle').addEventListener('click', () => {
 
 // Podcast toggle
 document.getElementById('podcast-toggle').addEventListener('click', () => {
-  try {
+  const btn = document.getElementById('podcast-toggle');
+  if (btn.textContent === '🎧') {
     fetch('SOUL.md')
       .then(response => {
         if (!response.ok) throw new Error('Failed to load SOUL.md');
@@ -2787,19 +2788,20 @@ document.getElementById('podcast-toggle').addEventListener('click', () => {
         utterance.lang = 'en-US';
         utterance.rate = 0.9;
         utterance.pitch = 0.9;
-        utterance.onend = () => {
-          document.getElementById('podcast-toggle').disabled = false;
-        };
-        document.getElementById('podcast-toggle').disabled = true;
+        btn.textContent = '⏹';
         speechSynthesis.speak(utterance);
+        utterance.onend = () => {
+          btn.textContent = '🎧';
+        };
       })
       .catch(err => {
-        console.error('Failed to load or play SOUL.md:', err);
+        console.error('Podcast error:', err);
         alert('Could not load SOUL.md for audio playback.');
+        btn.textContent = '🎧';
       });
-  } catch (err) {
-    console.error('Failed to load or play SOUL.md:', err);
-    alert('Could not load SOUL.md for audio playback.');
+  } else {
+    speechSynthesis.cancel();
+    btn.textContent = '🎧';
   }
 });
 

index.html

@@ -39,9 +39,6 @@
     <button id="podcast-toggle" class="chat-toggle-btn" aria-label="Start podcast of SOUL.md" title="Play SOUL.md as audio">
       🎧
     </button>
-    <button id="podcast-toggle" class="chat-toggle-btn" aria-label="Start podcast of SOUL.md" title="Play SOUL.md as audio podcast">
-      🎧
-    </button>
     <button id="timelapse-btn" class="chat-toggle-btn" aria-label="Start time-lapse replay" title="Time-lapse: replay today&#39;s activity in 30s [L]">
       ⏩
     </button>