Update static/appS.js

static/appS.js

@@ -173,111 +173,107 @@ document.addEventListener('DOMContentLoaded', () => {
         return bubble;
     }
 
-async function handleSubmit() {
-    if (!selectedFile) {
-        alert("Please upload a file first");
-        return;
-    }
+ 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 isSummarizeMode = document.querySelector('input[name="mode"]:checked').value === 'Summarize';
+        
+        const endpoint = isSummarizeMode 
+            ? '/summarization/summarize/'
+            : '/summarization/imagecaption/';
 
-    const thinkingText = isSummarizeMode
-        ? 'Processing document 📄... <div class="loader"></div>'
-        : "Generating caption 🖼️... <div class='loader'></div>";
+        const thinkingText = isSummarizeMode
+            ? 'Processing document 📄... <div class="loader"></div>'
+            : "Generating caption 🖼️... <div class='loader'></div>";
 
-    const thinkingBubble = createMessageBubble(thinkingText, "Aidan");
+        const thinkingBubble = createMessageBubble(thinkingText, "Aidan");
 
-    const formData = new FormData();
-    formData.append('file', selectedFile);
-    if (isSummarizeMode) formData.append('length', 'medium');
+        const formData = new FormData();
+        formData.append('file', selectedFile);
+        if (isSummarizeMode) formData.append('length', 'medium');
 
-    try {
-        const response = await fetch(endpoint, {
-            method: 'POST',
-            body: formData
-        });
+        try {
+            const response = await fetch(endpoint, {
+                method: 'POST',
+                body: formData
+            });
 
-        if (!response.ok) {
-            if (response.status === 404) {
-                throw new Error("Service endpoint not found. Please check the AI service deployment.");
+            if (!response.ok) {
+                const error = await response.json().catch(() => null);
+                throw new Error(error?.detail || error?.error || "Request failed");
             }
-            throw new Error("Request failed");
-        }
 
-        const result = await response.json();
-        thinkingBubble.remove();
-
-        if (isSummarizeMode) {
-            const bubble = createMessageBubble(
-                result.summary || "No summary generated.",
-                "Aidan",
-                result.audioUrl,
-                result.pdfUrl
-            );
-            
-            if (result.audioUrl) {
-                injectAudioPlayer(bubble, result.audioUrl);
-            }
-        } else {
-            // Always display caption regardless of audio existence
-            const bubble = createMessageBubble(
-                result.caption || result.answer, // Removed the fallback text
-                "Aidan",
-                result.audio,
-                null
-            );
-            
-            if (result.audio) {
-                injectAudioPlayer(bubble, result.audio);
+            const result = await response.json();
+            thinkingBubble.remove();
+
+            if (isSummarizeMode) {
+                const bubble = createMessageBubble(
+                    result.summary || "No summary generated.",
+                    "Aidan",
+                    result.audio,  // Using audio from response
+                    result.pdfUrl
+                );
+                
+                if (result.audio) {
+                    injectAudioPlayer(bubble, result.audio);
+                }
+            } else {
+                const bubble = createMessageBubble(
+                    result.caption || result.answer,
+                    "Aidan",
+                    result.audio,  // Using audio from response
+                    null
+                );
+                
+                if (result.audio) {
+                    injectAudioPlayer(bubble, result.audio);
+                }
             }
+        } catch (error) {
+            thinkingBubble.remove();
+            createMessageBubble(`⚠️ Error: ${error.message}`, "Aidan");
+        } finally {
+            selectedFile = null;
         }
-    } catch (error) {
-        thinkingBubble.remove();
-        createMessageBubble(`⚠️ Error: ${error.message}`, "Aidan");
-    } finally {
-        selectedFile = null;
     }
-}
-
-// Audio player helper function remains the same
-function injectAudioPlayer(bubble, audioUrl) {
-    const messageDiv = bubble.querySelector('.text');
-    const audioContainer = document.createElement('div');
-    audioContainer.style.marginTop = "10px";
-    audioContainer.style.display = "flex";
-    audioContainer.style.justifyContent = "flex-end";
-    audioContainer.style.gap = "15px";
-
-    const audio = new Audio(audioUrl);
-    const audioIcon = document.createElement("i");
-    audioIcon.className = "fa-solid fa-volume-high audio-toggle";
-    audioIcon.title = "Play Audio";
-    audioIcon.style.cursor = "pointer";
-    audioIcon.style.fontSize = "18px";
-
-    audioIcon.addEventListener("click", () => {
-        if (audio.paused) {
-            audio.play();
-            audioIcon.classList.remove("fa-volume-xmark");
-            audioIcon.classList.add("fa-volume-high");
-            audioIcon.title = "Mute Audio";
-        } else {
-            audio.pause();
-            audioIcon.classList.remove("fa-volume-high");
-            audioIcon.classList.add("fa-volume-xmark");
-            audioIcon.title = "Unmute Audio";
-        }
-    });
 
-    audioContainer.appendChild(audioIcon);
-    messageDiv.appendChild(audioContainer);
-}
+    function injectAudioPlayer(bubble, audioUrl) {
+        const messageDiv = bubble.querySelector('.text');
+        const audioContainer = document.createElement('div');
+        audioContainer.style.marginTop = "10px";
+        audioContainer.style.display = "flex";
+        audioContainer.style.justifyContent = "flex-end";
+        audioContainer.style.gap = "15px";
+
+        const audio = new Audio(audioUrl);
+        const audioIcon = document.createElement("i");
+        audioIcon.className = "fa-solid fa-volume-high audio-toggle";
+        audioIcon.title = "Play Audio";
+        audioIcon.style.cursor = "pointer";
+        audioIcon.style.fontSize = "18px";
+
+        audioIcon.addEventListener("click", () => {
+            if (audio.paused) {
+                audio.play();
+                audioIcon.classList.remove("fa-volume-xmark");
+                audioIcon.classList.add("fa-volume-high");
+                audioIcon.title = "Mute Audio";
+            } else {
+                audio.pause();
+                audioIcon.classList.remove("fa-volume-high");
+                audioIcon.classList.add("fa-volume-xmark");
+                audioIcon.title = "Unmute Audio";
+            }
+        });
 
+        audioContainer.appendChild(audioIcon);
+        messageDiv.appendChild(audioContainer);
+    }
 
+    // Add loader styles
     const style = document.createElement('style');
     style.textContent = `
         .loader {
@@ -296,8 +292,9 @@ function injectAudioPlayer(bubble, audioUrl) {
     `;
     document.head.appendChild(style);
 
+    // Back button
     var backarrow = document.querySelector(".fa-arrow-left");
     backarrow.addEventListener('click', function () {
         window.location.href = '/';
     });
-});
+});