CTM-ResearchAgent / script.js
privateuserh's picture
Update script.js
3b24fc9 verified
raw
history blame
4.54 kB
document.addEventListener("DOMContentLoaded", () => {
const workerUrl = "https://ctmresearchagent.aiagents.workers.dev"; // Replace with your worker URL if different
const uploadForm = document.getElementById("uploadForm");
const fileInput = document.getElementById("fileInput");
const uploadStatus = document.getElementById("uploadStatus");
const reportsList = document.getElementById("reportsList");
const submitButton = document.getElementById("submitButton");
const researchQueryInput = document.getElementById("researchQuery");
const resultDisplay = document.getElementById("resultDisplay");
const historyContainer = document.getElementById("historyContainer");
async function handleFileUpload(event) {
event.preventDefault();
const file = fileInput.files[0];
if (!file) { uploadStatus.textContent = 'Please select a file.'; return; }
uploadStatus.textContent = `Uploading ${file.name}...`;
const formData = new FormData();
formData.append('file', file);
try {
const response = await fetch(`${workerUrl}/api/upload`, { method: 'POST', body: formData });
const data = await response.json();
if (!response.ok) throw new Error(data.error || 'Upload failed');
uploadStatus.textContent = `Successfully uploaded ${file.name}!`;
uploadForm.reset();
await loadReportsList();
} catch (error) {
uploadStatus.textContent = `Error: ${error.message}`;
}
}
async function loadReportsList() {
try {
const response = await fetch(`${workerUrl}/api/documents`);
if (!response.ok) throw new Error('Failed to fetch reports list.');
const documents = await response.json();
reportsList.innerHTML = "";
if (documents.length === 0) { reportsList.innerHTML = "<p>No reports uploaded yet.</p>"; return; }
documents.forEach(doc => {
const entryDiv = document.createElement("div");
entryDiv.className = "report-entry";
entryDiv.innerHTML = `<span>${doc.filename}</span><span class="status ${doc.status.toLowerCase()}">${doc.status}</span>`;
reportsList.appendChild(entryDiv);
});
} catch (error) {
reportsList.innerHTML = "<p>Could not load reports.</p>";
}
}
async function handleAiQuerySubmit() {
const query = researchQueryInput.value.trim();
if (!query) { alert("Please enter a research query."); return; }
submitButton.disabled = true;
submitButton.innerText = "Thinking...";
resultDisplay.innerHTML = "<p>Generating response...</p>";
try {
const response = await fetch(`${workerUrl}/api/query`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ query: query }) });
const data = await response.json();
if (!response.ok) throw new Error(data.error || "An unknown error occurred.");
resultDisplay.innerText = data.result;
await loadResearchHistory();
} catch (error) {
resultDisplay.innerText = `Error: ${error.message}`;
} finally {
submitButton.disabled = false;
submitButton.innerText = "Submit";
}
}
async function loadResearchHistory() {
try {
const response = await fetch(`${workerUrl}/api/research`);
if (!response.ok) throw new Error('Failed to load history.');
const logs = await response.json();
historyContainer.innerHTML = "";
if (logs.length === 0) { historyContainer.innerHTML = "<p>No research history found.</p>"; return; }
logs.forEach(log => {
const entryDiv = document.createElement("div");
entryDiv.className = "history-entry";
entryDiv.innerHTML = `<p><strong>Query:</strong> ${log.query}</p><p><strong>Result:</strong> ${log.result}</p><p><small><em>${new Date(log.timestamp).toLocaleString()}</em></small></p>`;
historyContainer.appendChild(entryDiv);
});
} catch (error) {
historyContainer.innerHTML = "<p>Error loading research history.</p>";
}
}
uploadForm.addEventListener("submit", handleFileUpload);
submitButton.addEventListener("click", handleAiQuerySubmit);
loadReportsList();
loadResearchHistory();
});