File size: 2,324 Bytes
f1441cf
9fbc238
 
0944dd7
9fbc238
 
655a07e
f1441cf
 
 
 
 
0944dd7
 
9fbc238
655a07e
0944dd7
9fbc238
 
0944dd7
9fbc238
655a07e
9fbc238
655a07e
9fbc238
 
 
 
655a07e
0944dd7
 
 
 
9fbc238
0944dd7
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9fbc238
655a07e
9fbc238
 
 
f1441cf
 
 
 
 
 
 
 
9fbc238
655a07e
 
0944dd7
9fbc238
 
655a07e
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
// Submit button click
document.getElementById("submit-btn").addEventListener("click", async () => {
    const context = document.getElementById("context").value.trim();
    const questions = document.getElementById("question").value.trim();
    const output = document.getElementById("answer-box");
    const history = document.getElementById("history-list");

    if (!context || !questions) {
        output.textContent = "⚠️ Please provide both context and question(s).";
        return;
    }

    // Clear previous answers
    output.innerHTML = "";
    output.textContent = "⏳ Generating answers...";

    const res = await fetch("/predict", {
        method: "POST",
        headers: { "Content-Type": "application/json" },
        body: JSON.stringify({ context, question: questions })
    });

    const data = await res.json();

    if (data.error) {
        output.textContent = "⚠️ " + data.error;
        return;
    }

    // Clear loading text
    output.innerHTML = "";

    // Display each Q&A nicely
    data.results.forEach((r, i) => {
        const qaDiv = document.createElement("div");
        qaDiv.className = "mb-4 p-3 bg-indigo-50 dark:bg-gray-800 rounded-lg shadow";

        const qElem = document.createElement("p");
        qElem.innerHTML = `<strong>Q${i + 1}:</strong> ${r.question}`;
        qElem.className = "font-semibold";

        const aElem = document.createElement("p");
        aElem.innerHTML = `<strong>Answer:</strong> ${r.answer}`;

        const sElem = document.createElement("p");
        sElem.innerHTML = `<strong>Confidence:</strong> ${r.score}`;

        qaDiv.appendChild(qElem);
        qaDiv.appendChild(aElem);
        qaDiv.appendChild(sElem);

        output.appendChild(qaDiv);
    });

    // Add to history
    const li = document.createElement("li");
    li.textContent = questions.replace(/\n/g, " | ");

    // Make history item clickable
    li.addEventListener("click", () => {
        document.getElementById("question").value = questions;
        // Optionally scroll to top
        document.getElementById("question").scrollIntoView({ behavior: "smooth" });
    });

    history.prepend(li);
});

// Dark mode toggle
document.getElementById("dark-toggle").addEventListener("click", () => {
    document.body.classList.toggle("dark-mode");
});