Update static/appS.js

static/appS.js

@@ -173,7 +173,7 @@ document.addEventListener('DOMContentLoaded', () => {
         return bubble;
     }
 
-    async function handleSubmit() {
+  /*  async function handleSubmit() {
         if (!selectedFile) {
             alert("Please upload a file first");
             return;
@@ -230,8 +230,82 @@ document.addEventListener('DOMContentLoaded', () => {
         } finally {
             selectedFile = null;
         }
+    } */
+  async function handleSubmit() {
+    if (!selectedFile) {
+        alert("Please upload a file first");
+        return;
     }
 
+    const isSummarizeMode = document.querySelector('input[name="mode"]:checked').value === 'Summarize';
+
+    const endpoint = isSummarizeMode
+        ? `/Summarization/summarize/`
+        : `/Summarization/imagecaption/`;
+
+    const thinkingBubble = createMessageBubble("Thinking...", "Aidan");
+
+    // ✅ Inject loader correctly
+    const messageDiv = thinkingBubble.querySelector('.text');
+    const loader = document.createElement('div');
+    loader.className = 'loader';
+    messageDiv.appendChild(loader);
+
+    const formData = new FormData();
+    formData.append('file', selectedFile);
+    if (isSummarizeMode) formData.append('length', 'medium');
+
+    try {
+        const response = await fetch(endpoint, {
+            method: 'POST',
+            body: formData
+        });
+
+        if (!response.ok) {
+            const error = await response.json().catch(() => null);
+            throw new Error(error?.detail || error?.error || "Request failed");
+        }
+
+        const result = await response.json();
+        thinkingBubble.remove();
+
+        if (isSummarizeMode) {
+            const answerBubble = createMessageBubble(
+                result.summary || "No summary generated.",
+                "Aidan",
+                result.audioUrl,
+                result.pdfUrl
+            );
+            if (result.audioUrl) injectAudio(answerBubble, result.audioUrl);
+        } else {
+            const answerBubble = createMessageBubble(
+                result.caption || result.answer || "No caption generated.",
+                "Aidan",
+                result.audio,
+                null
+            );
+            if (result.audio) injectAudio(answerBubble, result.audio);
+        }
+
+    } catch (error) {
+        thinkingBubble.remove();
+        createMessageBubble(`⚠️ Error: ${error.message}`, "Aidan");
+    } finally {
+        selectedFile = null;
+    }
+}
+
+// ✅ Helper to inject audio player
+function injectAudio(bubble, audioUrl) {
+    const messageDiv = bubble.querySelector('.text');
+    const audioPlayer = document.createElement('audio');
+    audioPlayer.src = audioUrl;
+    audioPlayer.controls = true;
+    audioPlayer.style.marginTop = "10px";
+    messageDiv.appendChild(audioPlayer);
+}
+
+
     const style = document.createElement('style');
     style.textContent = `
         .loader {