Update index.html

templates/index.html

@@ -15,29 +15,6 @@
   <div class="bg-gradient-to-b from-indigo-200 via-white to-indigo-100">
     <div class="bg-gradient-to-b from-indigo-50 via-white to-indigo-100">
 
-      <!-- Sidebar -->
-      <div id="sidebar"
-        class="fixed top-0 left-0 h-full w-64 bg-white shadow-xl border-r border-gray-200 transform -translate-x-full transition-transform duration-300 z-40">
-        <div class="p-6">
-          <h2 class="text-lg font-semibold text-gray-800 mb-4">Uploaded PDF</h2>
-          <div id="sidebarFileName" class="text-sm text-gray-600 italic mb-6">No file uploaded</div>
-
-          <button id="btnSummarize"
-            class="w-full bg-indigo-500 hover:bg-indigo-600 text-white py-2 rounded disabled:opacity-50" disabled>
-            Summarize
-          </button>
-
-          <div id="summaryBox"
-            class="mt-6 max-h-64 overflow-y-auto text-sm text-gray-700 p-3 border rounded bg-gray-50 hidden"></div>
-        </div>
-      </div>
-
-      <!-- Sidebar Toggle Button -->
-      <button id="sidebarToggle"
-        class="fixed top-4 left-4 z-50 bg-indigo-500 hover:bg-indigo-600 text-white p-2 rounded shadow">
-        ☰
-      </button>
-
       <!-- Header -->
       <header class="fixed inset-x-0 top-0 z-50 bg-white/70 backdrop-blur-md shadow-sm">
         <div class="max-w-7xl mx-auto px-6 py-3 flex items-center justify-between">
@@ -122,6 +99,19 @@
               </button>
             </div>
 
+            <!-- Summarize Section -->
+            <div class="mt-6">
+              <button id="btnSummarize"
+                class="bg-indigo-500 hover:bg-indigo-600 text-white px-4 py-2 rounded disabled:opacity-50" disabled>
+                Summarize PDF
+              </button>
+
+              <div id="summaryBox"
+                class="mt-4 max-h-64 overflow-y-auto text-sm text-gray-700 p-3 border rounded bg-gray-50 hidden">
+              </div>
+            </div>
+
+
             <!-- Chat Box -->
             <div id="chatBox"
               class="space-y-3 max-w-3xl max-h-96 overflow-y-auto px-4 py-4 border rounded-lg bg-white shadow-inner mx-auto">
@@ -443,34 +433,43 @@
       }
     };
 
+    
+
     // Summarize logic
     btnSummarize.onclick = async () => {
-      btnSummarize.disabled = true;
-      btnSummarize.textContent = "Summarizing…";
-
-      try {
-        const res = await fetch("/summarize", {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
-          body: JSON.stringify({ file_id: fileId }),
-        });
-        const data = await res.json();
+  if (!window.currentFileId) {
+    summaryBox.textContent = "⚠️ Please upload a PDF first.";
+    summaryBox.classList.remove("hidden");
+    return;
+  }
+
+  btnSummarize.disabled = true;
+  btnSummarize.textContent = "Summarizing…";
+  summaryBox.textContent = "⏳ Generating summary...";
+  summaryBox.classList.remove("hidden");
+
+  try {
+    const res = await fetch("/summarize", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ file_id: window.currentFileId }),
+    });
 
-        if (res.ok) {
-          summaryBox.textContent = data.summary || "No summary available.";
-          summaryBox.classList.remove("hidden");
-        } else {
-          summaryBox.textContent = data.error || "Summarization failed.";
-          summaryBox.classList.remove("hidden");
-        }
-      } catch (err) {
-        summaryBox.textContent = "Error summarizing file.";
-        summaryBox.classList.remove("hidden");
-      }
+    const data = await res.json();
 
-      btnSummarize.disabled = false;
-      btnSummarize.textContent = "Summarize";
-    };
+    if (res.ok) {
+      summaryBox.textContent = data.summary || "No summary available.";
+    } else {
+      summaryBox.textContent = "❌ " + (data.error || "Summarization failed.");
+    }
+  } catch (err) {
+    summaryBox.textContent = "❌ Error summarizing file.";
+  }
+
+  btnSummarize.disabled = false;
+  btnSummarize.textContent = "Summarize PDF";
+};
+    
 
   </script>