Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ const dropZone = document.getElementById('dropZone');
+ const fileInput = document.getElementById('fileInput');
+ const fileList = document.getElementById('fileList');
+ const resultsContainer = document.getElementById('resultsContainer');
+
+ // Handle file selection via click
+ dropZone.addEventListener('click', () => {
+ fileInput.click();
+ });
+
+ // Handle drag and drop
+ dropZone.addEventListener('dragover', (e) => {
+ e.preventDefault();
+ dropZone.style.backgroundColor = 'rgba(108, 99, 255, 0.1)';
+ });
+
+ dropZone.addEventListener('dragleave', () => {
+ dropZone.style.backgroundColor = '';
+ });
+
+ dropZone.addEventListener('drop', (e) => {
+ e.preventDefault();
+ dropZone.style.backgroundColor = '';
+ handleFiles(e.dataTransfer.files);
+ });
+
+ fileInput.addEventListener('change', () => {
+ handleFiles(fileInput.files);
+ });
+
+ function handleFiles(files) {
+ fileList.innerHTML = '';
+ Array.from(files).forEach(file => {
+ if (validateFile(file)) {
+ const fileItem = createFileItem(file);
+ fileList.appendChild(fileItem);
+ processFile(file);
+ }
+ });
+ }
+
+ function validateFile(file) {
+ const validTypes = ['application/pdf', 'image/jpeg', 'image/png'];
+ if (!validTypes.includes(file.type)) {
+ alert('Please upload PDF, JPG, or PNG files only');
+ return false;
+ }
+ return true;
+ }
+
+ function createFileItem(file) {
+ const div = document.createElement('div');
+ div.className = 'file-item';
+ div.innerHTML = `
+ ${file.name}
+ ${formatFileSize(file.size)}
+ `;
+ return div;
+ }
+
+ function formatFileSize(bytes) {
+ if (bytes === 0) return '0 Bytes';
+ const k = 1024;
+ const sizes = ['Bytes', 'KB', 'MB', 'GB'];
+ const i = Math.floor(Math.log(bytes) / Math.log(k));
+ return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+ }
+
+ function processFile(file) {
+ // Simulated processing - in real implementation, this would connect to a backend service
+ const reader = new FileReader();
+ reader.onload = () => {
+ // Simulate processing delay
+ setTimeout(() => {
+ displayResults({
+ gstNumber: 'XX' + Math.random().toString().slice(2, 11),
+ companyName: 'Sample Company Ltd.',
+ invoiceNumber: 'INV-' + Math.random().toString().slice(2, 8),
+ amount: '₹' + (Math.random() * 10000).toFixed(2),
+ date: new Date().toLocaleDateString()
+ });
+ }, 1500);
+ };
+ reader.readAsDataURL(file);
+ }
+
+ function displayResults(data) {
+ const resultsContent = resultsContainer.querySelector('.results-content');
+ resultsContent.innerHTML = `
+
+ GST Number: ${data.gstNumber}
+
+
+ Company Name: ${data.companyName}
+
+
+ Invoice Number: ${data.invoiceNumber}
+
+
+ Amount: ${data.amount}
+
+ `;
+ resultsContainer.style.display = 'block';
+ }
+ });