Update static/appS.js

static/appS.js

@@ -73,27 +73,31 @@ document.addEventListener('DOMContentLoaded', () => {
         }
     });
 
-    async function handleSummarize() {
-        const file = fileUpload.files[0];
-        if (!file) {
-            displayError('Please upload a document first');
-            return;
-        }
-        const length = document.querySelector('input[name="optionS"]:checked')?.value || "medium";
+async function handleSummarize() {
+    const file = fileUpload.files[0];
+    if (!file) {
+        displayError('Please upload a document first');
+        return;
+    }
 
-        try {
-            convo.innerHTML = '';
-            displayFileInfo(file.name, 'document');
-            displayThinkingMessage();
+    console.log("Selected file:", file.name, "Type:", file.type);
+    const length = document.querySelector('input[name="optionS"]:checked')?.value || "medium";
 
-            const result = await summarizeDocument(file, length);
+    try {
+        convo.innerHTML = '';
+        displayFileInfo(file.name, 'document');
+        displayThinkingMessage();
 
-            displaySummaryResult(file.name, result.summary, result.audioUrl, result.pdfUrl);
-        } catch (error) {
-            displayError(error.message || 'Failed to summarize document');
-        }
-    }
+        console.log("Starting summarization...");
+        const result = await summarizeDocument(file, length);
+        console.log("Summarization result:", result);
 
+        displaySummaryResult(file.name, result.summary, result.audioUrl, result.pdfUrl);
+    } catch (error) {
+        console.error("Summarization failed:", error);
+        displayError(error.message || 'Failed to summarize document');
+    }
+}
     async function handleCaption() {
         const file = imageUpload.files[0];
         if (!file) {
@@ -113,24 +117,34 @@ document.addEventListener('DOMContentLoaded', () => {
         }
     }
 
-    async function summarizeDocument(file, length) {
-        const formData = new FormData();
-        formData.append('file', file);
-        formData.append('length', length);
+async function summarizeDocument(file, length) {
+    const formData = new FormData();
+    formData.append('file', file);
+    formData.append('length', length);
 
+    try {
         const response = await fetch('/summarize/', {
             method: 'POST',
             body: formData
         });
 
+        const result = await response.json();
+        
         if (!response.ok) {
-            const error = await response.json();
-            throw new Error(error.detail || 'Summarization failed');
+            throw new Error(result.detail || result.message || "Summarization failed");
         }
 
-        return await response.json();
+        // Map backend fields to frontend expectations
+        return {
+            summary: result.summary,
+            audioUrl: result.audio_url || result.audioUrl,
+            pdfUrl: result.pdf_url || result.pdfUrl
+        };
+    } catch (error) {
+        console.error("Summarization error:", error);
+        throw error;
     }
-
+}
     async function captionImage(file) {
         const formData = new FormData();
         formData.append('file', file);
@@ -175,24 +189,33 @@ document.addEventListener('DOMContentLoaded', () => {
         convo.scrollTop = convo.scrollHeight;
     }
 
-    function displaySummaryResult(filename, summary, audioUrl, pdfUrl) {
-        convo.removeChild(convo.lastChild);
-
-        const bubble = document.createElement('div');
-        bubble.className = 'bubble left';
-        bubble.innerHTML = `
-            <div class="label">Aidan</div>
-            <div class="text">
-                <strong>Summary:</strong><br><br>
-                ${summary.replace(/\n/g, '<br>')}
-                ${audioUrl ? `<br><br><audio controls src="${audioUrl}" style="width: 100%;"></audio>` : ''}
-                ${pdfUrl ? `<br><a href="${pdfUrl}" download class="download-link">📥 Download PDF Summary</a>` : ''}
-            </div>
-        `;
-        convo.appendChild(bubble);
-        convo.scrollTop = convo.scrollHeight;
+   function displaySummaryResult(filename, summary, audioUrl, pdfUrl) {
+    // Remove thinking message if it exists
+    const lastBubble = convo.lastChild;
+    if (lastBubble && lastBubble.querySelector('.loader')) {
+        convo.removeChild(lastBubble);
     }
 
+    const bubble = document.createElement('div');
+    bubble.className = 'bubble left';
+    
+    // Safely handle missing summary
+    const summaryContent = summary ? summary.replace(/\n/g, '<br>') : "No summary generated";
+    
+    bubble.innerHTML = `
+        <div class="label">Aidan</div>
+        <div class="text">
+            <strong>Summary:</strong><br><br>
+            ${summaryContent}
+            ${audioUrl ? `<br><br><audio controls src="${audioUrl}" style="width: 100%;"></audio>` : ''}
+            ${pdfUrl ? `<br><a href="${pdfUrl}" download="${filename.replace(/\.[^/.]+$/, '')}_summary.pdf" class="download-link">📥 Download PDF Summary</a>` : ''}
+        </div>
+    `;
+    
+    convo.appendChild(bubble);
+    convo.scrollTop = convo.scrollHeight;
+}
+
     function displayCaptionResult(filename, caption) {
         convo.removeChild(convo.lastChild);