Update ai-check.html

ai-check.html

@@ -228,8 +228,8 @@
         Ideal for anyone curious about AI detection or building their own detector interface.
       </p>
 
-      <div class="grid md:grid-cols-3 gap-5 mt-3 text-xs">
-        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4">
+      <div class="grid md:grid-cols-3 gap-5 mt-3">
+        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4 text-xs">
           <div class="flex items-center gap-3 mb-2">
             <div class="w-9 h-9 rounded-full bg-sky-500/20 flex items-center justify-center">
               <span class="text-lg">🎓</span>
@@ -241,7 +241,7 @@
           </p>
         </div>
 
-        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4">
+        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4 text-xs">
           <div class="flex items-center gap-3 mb-2">
             <div class="w-9 h-9 rounded-full bg-amber-500/20 flex items-center justify-center">
               <span class="text-lg">🧑‍🏫</span>
@@ -253,7 +253,7 @@
           </p>
         </div>
 
-        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4">
+        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4 text-xs">
           <div class="flex items-center gap-3 mb-2">
             <div class="w-9 h-9 rounded-full bg-rose-500/20 flex items-center justify-center">
               <span class="text-lg">💻</span>
@@ -267,53 +267,6 @@
       </div>
     </section>
 
-    <section class="mt-10 space-y-4">
-      <h2 class="text-xl md:text-2xl font-semibold">How does this AI content checker work?</h2>
-      <p class="text-sm text-slate-300">
-        The scoring is intentionally simple, so you can read the JavaScript and fully understand it.
-      </p>
-
-      <div class="grid md:grid-cols-3 gap-5 mt-3 text-xs">
-        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4">
-          <div class="flex items-center gap-3 mb-2">
-            <div class="w-9 h-9 rounded-full bg-fuchsia-500/20 flex items-center justify-center">
-              <span class="text-lg">1️⃣</span>
-            </div>
-            <p class="font-semibold text-sm">Tokenise the text</p>
-          </div>
-          <p>
-            Text is lower-cased and split into words and sentences for basic statistics.
-          </p>
-        </div>
-
-        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4">
-          <div class="flex items-center gap-3 mb-2">
-            <div class="w-9 h-9 rounded-full bg-indigo-500/20 flex items-center justify-center">
-              <span class="text-lg">2️⃣</span>
-            </div>
-            <p class="font-semibold text-sm">Measure patterns</p>
-          </div>
-          <p>
-            It looks at vocabulary variety and average sentence length — long, repetitive text can
-            look more AI-like.
-          </p>
-        </div>
-
-        <div class="bg-slate-900/70 border border-slate-800 rounded-2xl p-4">
-          <div class="flex items-center gap-3 mb-2">
-            <div class="w-9 h-9 rounded-full bg-emerald-500/20 flex items-center justify-center">
-              <span class="text-lg">3️⃣</span>
-            </div>
-            <p class="font-semibold text-sm">Compute a score</p>
-          </div>
-          <p>
-            Those metrics are combined into an AI-generated probability (0–100%), displayed and
-            saved in your PDF report.
-          </p>
-        </div>
-      </div>
-    </section>
-
     <section class="mt-12">
       <h2 class="text-xl md:text-2xl font-semibold mb-3">Reviews for this AI checker</h2>
       <div class="bg-slate-900/80 border border-slate-800 rounded-2xl p-5 md:p-6 relative overflow-hidden">
@@ -349,11 +302,10 @@
       window.location.href = "login.html";
     }
 
-    // jsPDF helper
+    // jsPDF helper (kept for backwards compatibility — not used for server PDF)
     function getJsPDF() {
       if (window.jspdf && window.jspdf.jsPDF) return window.jspdf.jsPDF;
       if (window.jsPDF) return window.jsPDF;
-      alert("PDF library (jsPDF) did not load. Check your internet connection or CDN access.");
       return null;
     }
 
@@ -545,7 +497,8 @@
           word_count: wc,
           avg_sentence_length: avg,
           summary,
-          text: textarea.value
+          text: textarea.value,
+          file: file || null
         };
       } catch (err) {
         console.error(err);
@@ -556,55 +509,71 @@
       }
     };
 
-    // PDF download
-    downloadBtn.onclick = () => {
+    // Helper to parse filename from Content-Disposition
+    function filenameFromContentDisposition(header) {
+      if (!header) return null;
+      // Try utf-8 filename* then filename
+      const fnStar = header.match(/filename\*\s*=\s*UTF-8''([^;]+)/i);
+      if (fnStar && fnStar[1]) return decodeURIComponent(fnStar[1].replace(/["']/g, ''));
+      const fn = header.match(/filename\s*=\s*["']?([^;"']+)["']?/i);
+      if (fn && fn[1]) return fn[1].replace(/["']/g, '');
+      return null;
+    }
+
+    // Download PDF (calls backend /report/ai or /report/ai-file)
+    downloadBtn.onclick = async () => {
       if (!lastResult) {
         alert("Run at least one scan before downloading a report.");
         return;
       }
 
-      const jsPDF = getJsPDF();
-      if (!jsPDF) return;
-
-      const doc = new jsPDF({ unit: "pt", format: "a4" });
-
-      let y = 40;
-      doc.setFontSize(16);
-      doc.text("TrueWrite Scan — AI Content Report", 40, y); y += 22;
-
-      doc.setFontSize(11);
-      doc.text("Generated: " + new Date().toLocaleString(), 40, y); y += 18;
-      doc.text("User: " + (user || "N/A"), 40, y); y += 18;
-
-      doc.setFontSize(12);
-      doc.text(`AI probability: ${lastResult.ai_percent}%`, 40, y); y += 16;
-      doc.text(`Human probability: ${lastResult.human_percent}%`, 40, y); y += 16;
-      doc.text(`Word count: ${lastResult.word_count}`, 40, y); y += 18;
+      const file = lastResult.file;
+      try {
+        let res;
+        if (file && !(file.type === "text/plain" || file.name.toLowerCase().endsWith(".txt"))) {
+          // POST file to /report/ai-file
+          const form = new FormData();
+          form.append("file", file, file.name);
+          res = await fetch(`${BACKEND_URL}/report/ai-file`, {
+            method: "POST",
+            headers: { "Authorization": `Bearer ${token}` },
+            body: form
+          });
+        } else {
+          // Use GET with text param (URL-encode)
+          const txt = lastResult.text || "";
+          const q = encodeURIComponent(txt);
+          res = await fetch(`${BACKEND_URL}/report/ai?text=${q}`, {
+            method: "GET",
+            headers: { "Authorization": `Bearer ${token}` }
+          });
+        }
 
-      if (lastResult.avg_sentence_length !== null && lastResult.avg_sentence_length !== undefined) {
-        doc.text(`Avg sentence length: ${lastResult.avg_sentence_length}`, 40, y); y += 18;
-      }
+        if (!res.ok) {
+          const text = await res.text();
+          throw new Error(text || `Server error: ${res.status}`);
+        }
 
-      if (lastResult.summary) {
-        doc.text("Summary:", 40, y); y += 16;
-        doc.setFontSize(10);
-        const lines = doc.splitTextToSize(lastResult.summary, 520);
-        doc.text(lines, 40, y);
-        y += lines.length * 12 + 10;
+        const blob = await res.blob();
+        const cd = res.headers.get('content-disposition');
+        const fname = filenameFromContentDisposition(cd) || "TrueWrite_AiReport.pdf";
+
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = fname;
+        document.body.appendChild(a);
+        a.click();
+        a.remove();
+        URL.revokeObjectURL(url);
+      } catch (err) {
+        console.error(err);
+        alert("Failed to download report: " + (err.message || err));
       }
-
-      doc.setFontSize(11);
-      doc.text("--- Original text (truncated) ---", 40, y); y += 18;
-      const original = lastResult.text || "";
-      const truncated = original.length > 4000 ? original.slice(0, 4000) + "\n\n[TRUNCATED]" : original;
-      const textLines = doc.splitTextToSize(truncated, 520);
-      doc.setFontSize(10);
-      doc.text(textLines, 40, y);
-
-      doc.save("truewrite-ai-report.pdf");
     };
 
-    // Reviews slider
+    // Reviews slider and other UI (unchanged) ...
+    // (kept exactly as you provided)
     const reviews = [
       {
         name: "Aarav S.",