File size: 4,996 Bytes
0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 0a5e8b3 17dea08 | 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 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 | let selectedFile = null;
document.addEventListener('DOMContentLoaded', () => {
const form = document.getElementById('analysisForm');
const fileInput = document.getElementById('fileInput');
const textInput = document.getElementById('textInput');
const textClaim = document.getElementById('textClaim');
const dropZone = document.getElementById('dropZone');
const fileLabel = document.getElementById('fileLabel');
if (!form) return;
const resetFileState = () => {
selectedFile = null;
fileInput.value = '';
fileLabel.textContent = 'Drop media here or click to upload';
dropZone.classList.remove('upload-active');
};
fileInput.addEventListener('change', () => {
if (fileInput.files.length > 0) {
selectedFile = fileInput.files[0];
fileLabel.innerHTML = `Ready: <strong>${selectedFile.name}</strong>`;
dropZone.classList.add('upload-active');
textInput.value = '';
} else {
resetFileState();
}
});
textInput.addEventListener('input', () => {
if (textInput.value.trim().length > 0) {
resetFileState();
}
});
form.addEventListener('submit', async (event) => {
event.preventDefault();
const resultBox = document.getElementById('resultBox');
const loader = document.getElementById('loader');
if (!textInput.value.trim() && !selectedFile && !textClaim.value.trim()) {
resultBox.innerHTML = '<div class="alert alert-warning">Please provide a media file, a URL, or a text claim.</div>';
return;
}
resultBox.innerHTML = '';
loader.classList.remove('hidden');
const formData = new FormData();
if (selectedFile) formData.append('file', selectedFile);
if (textInput.value.trim()) formData.append('input', textInput.value.trim());
if (textClaim.value.trim()) formData.append('text_claim', textClaim.value.trim());
try {
const response = await fetch('/analyze', {
method: 'POST',
body: formData,
headers: { 'X-Requested-With': 'XMLHttpRequest' }
});
const data = await response.json();
loader.classList.add('hidden');
if (response.status === 401) {
window.location.href = '/login';
return;
}
if (!response.ok || data.error) {
resultBox.innerHTML = `<div class="alert alert-danger"><strong>Error:</strong> ${data.error || 'Analysis failed.'}</div>`;
return;
}
const sourcesHtml = (data.context_sources || []).length
? `<div class="mt-3"><div class="text-uppercase small text-secondary fw-bold">Context sources</div><ul class="source-links">${data.context_sources.map(source => `<li><a href="${source.url}" target="_blank" rel="noreferrer">${source.title}</a></li>`).join('')}</ul></div>`
: '';
const score = Number(data.confidence || 0);
const verdict = String(data.verdict || 'Unknown');
const verdictClass = verdict.toLowerCase().includes('fake') ? 'text-danger' : verdict.toLowerCase().includes('authentic') ? 'text-success' : 'text-warning';
resultBox.innerHTML = `
<div class="result-card">
<div class="d-flex justify-content-between align-items-start gap-3 flex-wrap">
<div>
<div class="eyebrow">Analysis complete</div>
<h3 class="${verdictClass} fw-bold mb-1">${verdict}</h3>
<p class="mb-0 text-secondary">${data.reasoning || ''}</p>
</div>
<div class="score-pill">${score}%</div>
</div>
<div class="progress mt-3" style="height: 8px;">
<div class="progress-bar bg-info" style="width: ${score}%"></div>
</div>
${sourcesHtml}
<div class="d-flex gap-2 mt-4 flex-wrap">
<a href="${data.report_url}" class="btn btn-light">Open saved report</a>
<button type="button" class="btn btn-outline-light" id="startAnotherBtn">Analyze another</button>
</div>
</div>
`;
const anotherBtn = document.getElementById('startAnotherBtn');
if (anotherBtn) {
anotherBtn.addEventListener('click', () => {
form.reset();
resetFileState();
resultBox.innerHTML = '';
});
}
} catch (err) {
loader.classList.add('hidden');
resultBox.innerHTML = `<div class="alert alert-danger">Server error: ${err}</div>`;
}
});
}); |