script.js

// Load previously uploaded files when page loads
function loadSavedFiles() {
    const files = JSON.parse(localStorage.getItem('uploadedFiles') || '[]');
    const fileContainer = document.getElementById('file-container');
    
    // Clear existing cards except the add button
    const existingCards = document.querySelectorAll('custom-file-card');
    existingCards.forEach(card => card.remove());
    
    // Recreate cards from localStorage
    files.forEach(file => {
        const card = document.createElement('custom-file-card');
        card.setAttribute('name', file.name);
        card.setAttribute('status', file.status);
        fileContainer.insertBefore(card, addFileCard);
    });
}

document.addEventListener('DOMContentLoaded', function() {
    // Load any previously uploaded files
    loadSavedFiles();
// Initialize modal functionality
    const addFileCard = document.getElementById('add-file-card');
    const uploadModal = document.getElementById('upload-modal');
    const closeModal = document.getElementById('close-modal');
    const uploadForm = document.getElementById('upload-form');
    // Open modal when add file card is clicked
    document.getElementById('add-file-card').addEventListener('click', () => {
        document.getElementById('upload-modal').classList.remove('hidden');
    });
    // Close modal
    document.getElementById('close-modal').addEventListener('click', () => {
        document.getElementById('upload-modal').classList.add('hidden');
    });
// Handle file upload
    uploadForm.addEventListener('submit', async (e) => {
        e.preventDefault();
        e.stopPropagation();
        
        const fileName = document.getElementById('file-name').value.trim();
const fileInput = document.getElementById('file-upload');
        const file = fileInput.files[0];
        if (!file || !fileName) {
            alert('Please provide both a project name and select a file');
            return false;
        }
// Create a new file card immediately
        createFileCard(fileName, 'pending');
        
        // Close modal
        uploadModal.classList.add('hidden');
        // Simulate API call with mock response
        try {
            // Show loading state
            updateFileCardStatus(fileName, 'pending');
            // Simulate API delay
            await new Promise(resolve => setTimeout(resolve, 2000));
            
            // Generate mock response matching the API format
            const mockResponses = [
                {
                    "node": "convert_to_fcg", 
                    "output": {
                        "fcg_file_path": "/tmp/tmp2l9mdy32/uploaded_file.fcg"
                    }
                },
                {
                    "node": "detect_vulnerability_src", 
                    "output": {
                        "predicted_class": Math.random() > 0.5 ? "Vulnerable" : "NonVulnerable",
                        "confidence_score": (Math.random() * 0.5 + 0.5).toFixed(7)
                    }
                },
                {
                    "node": "detect_vulnerability_func",
                    "output": {
                        "vulnerable_functions": [
                            {
                                "function_name": "Example.doSomething()",
                                "function_code": "function doSomething() public {\n    // Vulnerable code\n}",
                                "prediction": 1,
                                "confidence": "99.99%"
                            }
                        ]
                    }
                },
                {
                    "node": "explain_vulnerability_func",
                    "output": {
                        "explanations": [
                            {
                                "function_name": "Example.doSomething()",
                                "explanation": "Vulnerability analysis of the function...\n\n### Security Issues Found:\n1. Direct use of block.timestamp for critical logic\n2. Potential front-running possible\n3. Missing access controls"
                            }
                        ]
                    }
                }
            ];
            // Process each mock response in sequence
            for (const mockResponse of mockResponses) {
                switch(mockResponse.node) {
                    case 'detect_vulnerability_src':
                        const isVulnerable = mockResponse.output.predicted_class === "Vulnerable";
                        updateFileCardStatus(fileName, isVulnerable ? 'vulnerable' : 'safe');
                        
                        localStorage.setItem(`analysis_${fileName}`, JSON.stringify({
                            isVulnerable,
                            confidence: mockResponse.output.confidence_score,
                            rawResponse: mockResponses // Store full response
                        }));
                        
                        if (isVulnerable) {
                            setTimeout(() => {
                                window.location.href = `analysis.html?file=${encodeURIComponent(fileName)}`;
                            }, 1500);
                        }
                        break;
                    
                    default:
                        // Store other responses for detail view
                        localStorage.setItem(`${mockResponse.node}_${fileName}`, JSON.stringify(mockResponse));
                }
            }
} catch (error) {
            console.error('Error:', error);
            updateFileCardStatus(fileName, 'error');
            
            // Show error message to user
            alert('Analysis failed. Please try again.');
        }
        
        // Reset form
        // Reset form after slight delay to allow user to see submission feedback
        setTimeout(() => {
            uploadForm.reset();
        }, 500);
        return false;
});
    // Function to create a new file card
    function createFileCard(name, status) {
        const fileContainer = document.getElementById('file-container');
        const card = document.createElement('custom-file-card');
        card.setAttribute('name', name);
        card.setAttribute('status', status);
        fileContainer.insertBefore(card, addFileCard);
        
        // Store the file info in localStorage
        const files = JSON.parse(localStorage.getItem('uploadedFiles') || '[]');
        files.push({ name, status });
        localStorage.setItem('uploadedFiles', JSON.stringify(files));
    }
    // Function to update file card status
    function updateFileCardStatus(name, status) {
        const cards = document.querySelectorAll('custom-file-card');
        for (const card of cards) {
            if (card.getAttribute('name') === name) {
                card.setAttribute('status', status);
                
                // Update the file status in localStorage
                const files = JSON.parse(localStorage.getItem('uploadedFiles') || '[]');
                const fileIndex = files.findIndex(f => f.name === name);
                if (fileIndex !== -1) {
                    files[fileIndex].status = status;
                    localStorage.setItem('uploadedFiles', JSON.stringify(files));
                }
                break;
            }
        }
    }
// Process analysis data from API
    function processAnalysisData(fileName, responses) {
        // This function now handles the full response array
        for (const response of responses) {
            if (response.node === 'detect_vulnerability_src') {
                updateFileCardStatus(
                    fileName,
                    response.output.predicted_class === "Vulnerable" ? 'vulnerable' : 'safe'
                );
                localStorage.setItem(`analysis_${fileName}`, JSON.stringify(response));
            }
            localStorage.setItem(`${response.node}_${fileName}`, JSON.stringify(response));
        }
    }
});