Spaces:
Sleeping
Sleeping
File size: 3,295 Bytes
1a976d8 | 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 | document.addEventListener('DOMContentLoaded', () => {
const codeInput = document.getElementById('codeInput');
const analyzeBtn = document.getElementById('analyzeBtn');
const btnText = analyzeBtn.querySelector('.btn-text');
const loader = analyzeBtn.querySelector('.loader');
// Result elements
const resNotation = document.getElementById('resNotation');
const resTitle = document.getElementById('resTitle');
const resDesc = document.getElementById('resDesc');
// Example chips
document.querySelectorAll('.chip').forEach(chip => {
chip.addEventListener('click', () => {
// Replace \n from dataset with actual newlines
codeInput.value = chip.dataset.example.replace(/\\n/g, '\n');
triggerAnalysis();
});
});
analyzeBtn.addEventListener('click', triggerAnalysis);
// Also support Cmd/Ctrl + Enter to trigger
codeInput.addEventListener('keydown', (e) => {
if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') {
triggerAnalysis();
}
});
async function triggerAnalysis() {
const code = codeInput.value.trim();
if (!code) {
resNotation.innerHTML = "O(?)";
resTitle.innerHTML = "Error";
resDesc.innerHTML = "⚠️ Please paste some code before analyzing!";
return;
}
// UI Loading state
analyzeBtn.disabled = true;
btnText.innerHTML = "Analyzing structure...";
loader.classList.remove('hidden');
resNotation.style.opacity = '0.5';
resTitle.style.opacity = '0.5';
resDesc.style.opacity = '0.5';
try {
const response = await fetch('/api/predict', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ code: code })
});
if (!response.ok) {
throw new Error(`Server error: ${response.status}`);
}
const data = await response.json();
// Render Results
resNotation.innerHTML = data.notation;
resTitle.innerHTML = data.title;
resDesc.innerHTML = data.description;
} catch (error) {
console.error('Analysis failed:', error);
resNotation.innerHTML = "O(?)";
resTitle.innerHTML = "Analysis Failed";
resDesc.innerHTML = "An error occurred while connecting to the AI model. Ensure the backend is running.";
} finally {
// Restore UI state
analyzeBtn.disabled = false;
btnText.innerHTML = "⚡ Analyze Complexity";
loader.classList.add('hidden');
// Fade results back in
resNotation.style.opacity = '1';
resTitle.style.opacity = '1';
resDesc.style.opacity = '1';
// Add a little pop animation to the results
document.querySelectorAll('.result-card').forEach(card => {
card.style.transform = 'scale(1.02)';
setTimeout(() => card.style.transform = 'scale(1)', 200);
});
}
}
});
|