Update script.js

script.js

@@ -1,22 +1,17 @@
-/* ------------------------------------------------
-   Firebase Setup
---------------------------------------------------*/
+/* ======================= SHORTCUT ======================= */
+const el = (id) => document.getElementById(id);
+
+/* ======================= FIREBASE CONFIG ======================= */
 const firebaseConfig = {
   apiKey: "YOUR_API_KEY",
   authDomain: "YOUR_PROJECT.firebaseapp.com",
   projectId: "YOUR_PROJECT",
 };
-
 firebase.initializeApp(firebaseConfig);
-const auth = firebase.auth();
 
-function el(id) {
-  return document.getElementById(id);
-}
+const auth = firebase.auth();
 
-/* ------------------------------------------------
-   AUTH – Google Login
---------------------------------------------------*/
+/* ======================= LOGIN FUNCTION ======================= */
 async function handleGoogleLogin() {
   const provider = new firebase.auth.GoogleAuthProvider();
 
@@ -24,11 +19,9 @@ async function handleGoogleLogin() {
     const result = await auth.signInWithPopup(provider);
     const idToken = await result.user.getIdToken();
 
-    // Send token to backend
     await fetch("/api/login", {
       method: "POST",
       headers: { "Content-Type": "application/json" },
-      credentials: "include",
       body: JSON.stringify({ token: idToken }),
     });
 
@@ -38,17 +31,16 @@ async function handleGoogleLogin() {
   }
 }
 
+/* ======================= LOGOUT FUNCTION ======================= */
 async function handleLogout() {
-  await fetch("/api/logout", { method: "POST", credentials: "include" });
+  await fetch("/api/logout", { method: "POST" });
   await auth.signOut();
   updateAuthUI();
 }
 
-/* ------------------------------------------------
-   AUTH UI
---------------------------------------------------*/
+/* ======================= UPDATE LOGIN UI ======================= */
 async function updateAuthUI() {
-  const loginBtn = el("openGoogle");
+  const openGoogle = el("openGoogle");
   const userSection = el("userSection");
   const userPhoto = el("userPhoto");
   const userDropdown = el("userDropdown");
@@ -56,184 +48,172 @@ async function updateAuthUI() {
   const userEmail = el("userEmail");
 
   try {
-    const res = await fetch("/api/me", { credentials: "include" });
+    const res = await fetch("/api/me");
     const j = await res.json();
 
     if (j.authenticated) {
-      // Hide login button
-      loginBtn.classList.add("hidden");
+      // (A) HIDE LOGIN BUTTON
+      openGoogle.classList.add("hidden");
 
-      // Show user profile
+      // (B) SHOW PROFILE SECTION
       userSection.classList.remove("hidden");
-      userPhoto.src = j.picture || "https://i.imgur.com/5cF5pUo.png";
-
       userName.textContent = j.name || "User";
       userEmail.textContent = j.email || "";
+      userPhoto.src = j.picture || "https://i.imgur.com/4ZQZ4ZQ.png";
 
-      // Enable deep analysis
       el("openDeep").disabled = false;
-
     } else {
-      loginBtn.classList.remove("hidden");
+      // (A) SHOW LOGIN
+      openGoogle.classList.remove("hidden");
+
+      // (B) HIDE PROFILE
       userSection.classList.add("hidden");
-      el("openDeep").disabled = true;
 
-      loginBtn.onclick = handleGoogleLogin;
+      openGoogle.onclick = handleGoogleLogin;
+      el("openDeep").disabled = true;
     }
   } catch (e) {
-    console.warn("Auth check failed", e);
+    console.warn("Auth check failed:", e);
   }
 }
-
 updateAuthUI();
 
-/* ------------------------------------------------
-   Dropdown Toggle
---------------------------------------------------*/
+/* ======================= DROPDOWN TOGGLE ======================= */
 el("userSection").addEventListener("click", () => {
   el("userDropdown").classList.toggle("hidden");
 });
 
-el("logoutBtn").addEventListener("click", handleLogout);
-
-/* ------------------------------------------------
-   Auth Guard for Deep Analysis
---------------------------------------------------*/
-el("openDeep").addEventListener("click", async () => {
-  const me = await fetch("/api/me", { credentials: "include" }).then((r) =>
-    r.json()
-  );
-
-  if (!me.authenticated) {
-    alert("Please login to use Deep Analysis.");
-    return;
+document.addEventListener("click", (e) => {
+  if (!el("userSection").contains(e.target)) {
+    el("userDropdown").classList.add("hidden");
   }
+});
 
-  openModal("deep");
+/* ======================= SMOOTH SCROLL TO CARDS ======================= */
+document.querySelectorAll("#openFast, #openDeep").forEach((btn) => {
+  btn.addEventListener("click", () => {
+    document
+      .getElementById("analysisSection")
+      .scrollIntoView({ behavior: "smooth" });
+  });
 });
 
-/* ------------------------------------------------
-   Open / Close Modal
---------------------------------------------------*/
+/* ======================= OPEN MODAL ======================= */
 function openModal(mode) {
   el("inputModal").classList.remove("hidden");
   el("modalTitle").textContent =
     mode === "deep" ? "Start Deep Analysis" : "Start Fast Analysis";
-  el("formStatus").textContent = "";
   el("analyzeBtn").dataset.mode = mode;
+  el("formStatus").textContent = "";
 }
 
-function closeModal() {
-  el("inputModal").classList.add("hidden");
-  el("name").value = "";
-  el("pitch").value = "";
-  el("description").value = "";
-  el("industry").value = "";
-}
+/* Fast Analysis Card Button */
+document.querySelectorAll(".start").forEach((b) => {
+  b.addEventListener("click", () => {
+    openModal(b.dataset.mode);
+  });
+});
+
+/* Deep Button Auth Guard */
+el("openDeep").addEventListener("click", async () => {
+  const me = await fetch("/api/me").then((r) => r.json());
+
+  if (!me.authenticated) {
+    alert("Please login first.");
+    return;
+  }
+});
 
-el("openFast").addEventListener("click", () => openModal("fast"));
-el("closeModal").addEventListener("click", closeModal);
-el("cancelBtn").addEventListener("click", closeModal);
+/* Close Modal */
+el("closeModal").onclick = () => el("inputModal").classList.add("hidden");
+el("cancelBtn").onclick = () => el("inputModal").classList.add("hidden");
 
-/* ------------------------------------------------
-   Run Analysis
---------------------------------------------------*/
+/* ======================= ANALYZE ======================= */
 el("analyzeBtn").addEventListener("click", async function () {
-  const mode = this.dataset.mode || "fast";
+  const mode = this.dataset.mode;
+
   const name = el("name").value.trim();
   const pitch = el("pitch").value.trim();
   const description = el("description").value.trim();
   const industry = el("industry").value.trim();
 
   if (!name && !pitch && !description) {
-    el("formStatus").textContent =
-      "Please fill at least Name or Pitch or Description.";
+    el("formStatus").textContent = "Please fill at least one field.";
     return;
   }
 
-  el("formStatus").textContent = "Running analysis...";
+  el("formStatus").textContent = "Running AI analysis...";
 
   try {
     const resp = await fetch("/api/analyze", {
       method: "POST",
       headers: { "Content-Type": "application/json" },
-      credentials: "include",
-      body: JSON.stringify({ name, pitch, description, industry, mode }),
+      body: JSON.stringify({
+        name,
+        pitch,
+        description,
+        industry,
+        mode,
+      }),
     });
 
     const j = await resp.json();
 
     if (!resp.ok) {
-      el("formStatus").textContent = j.error || "Analysis failed";
+      el("formStatus").textContent = j.error || "Error!";
       return;
     }
 
     const id = j.id;
 
     el("formStatus").innerHTML = `
-      Analysis ready — 
-      <a href="/api/doc/${id}" target="_blank">View JSON</a> • 
-      <a href="/api/pdf/${id}" target="_blank">Download PDF</a>
+      Analysis Ready 🎉 <br>
+      <a href="/api/doc/${id}" target="_blank">View JSON</a> •
+      <a href="/api/pdf/${id}" target="_blank">Download TXT</a>
     `;
 
     fetchHistory();
   } catch (err) {
-    el("formStatus").textContent = "Network error: " + err.message;
+    el("formStatus").textContent = "Network error.";
   }
 });
 
-/* ------------------------------------------------
-   Load History
---------------------------------------------------*/
+/* ======================= HISTORY LOADER ======================= */
 async function fetchHistory() {
+  const historyList = el("historyList");
+
   try {
-    const r = await fetch("/api/history?limit=10");
-    const j = await r.json();
+    historyList.innerHTML = "Loading...";
 
-    const items = j.items || [];
-    const container = el("historyList");
+    const r = await fetch("/api/history");
+    const j = await r.json();
 
-    container.innerHTML = "";
+    historyList.innerHTML = "";
 
-    if (items.length === 0) {
-      container.innerHTML = `<div class="muted">No recent analyses</div>`;
+    if (!j.items || j.items.length === 0) {
+      historyList.innerHTML = '<div class="muted">No recent analyses</div>';
       return;
     }
 
-    items.forEach((it) => {
-      const d = document.createElement("div");
-      d.className = "history-item";
-
-      d.innerHTML = `
-        <strong>${escapeHtml(it.name || it.pitch || "Untitled")}</strong>
-        <span class="muted">(${it.industry || "—"})</span>
-        <div class="muted small">
-          Score: ${it.score || "—"} • 
-          <a href="/api/doc/${it.id}" target="_blank">json</a> • 
-          <a href="/api/pdf/${it.id}" target="_blank">pdf</a>
+    j.items.forEach((it) => {
+      const div = document.createElement("div");
+      div.className = "history-item";
+
+      div.innerHTML = `
+        <strong>${it.name || it.pitch || "Unnamed"}</strong>
+        <span class="muted">(${it.industry || "General"})</span>
+        <div class="small muted">
+          Mode: ${it.mode} • 
+          <a href="/api/doc/${it.id}" target="_blank">json</a> •
+          <a href="/api/pdf/${it.id}" target="_blank">txt</a>
         </div>
       `;
 
-      container.appendChild(d);
+      historyList.appendChild(div);
     });
   } catch (e) {
-    console.log("History load failed", e);
+    console.error(e);
   }
 }
 
 fetchHistory();
-
-/* ------------------------------------------------
-   Helpers
---------------------------------------------------*/
-function escapeHtml(s) {
-  return String(s || "").replace(/[&<>"']/g, (c) => {
-    return {
-      "&": "&amp;",
-      "<": "&lt;",
-      ">": "&gt;",
-      '"': "&quot;",
-      "'": "&#39;",
-    }[c];
-  });
-}