// Main application script document.addEventListener('DOMContentLoaded', function() { // Handle login form submission const loginForm = document.getElementById('loginForm'); if (loginForm) { loginForm.addEventListener('submit', function(e) { e.preventDefault(); const username = document.getElementById('username').value; const password = document.getElementById('password').value; // Simple validation (in production, use proper authentication) if (username && password) { localStorage.setItem('isAuthenticated', 'true'); window.location.href = 'dashboard.html'; } else { alert('Please enter both username and password'); } }); } // Check authentication on dashboard pages const isAuthenticated = localStorage.getItem('isAuthenticated'); if (!isAuthenticated && !window.location.pathname.includes('login.html')) { window.location.href = 'login.html'; } // PDF Upload Functionality const pdfUploadForms = document.querySelectorAll('.pdf-upload-form'); pdfUploadForms.forEach(form => { form.addEventListener('submit', function(e) { e.preventDefault(); const department = this.querySelector('select[name="department"]').value; const startDate = this.querySelector('input[name="start_date"]').value; const endDate = this.querySelector('input[name="end_date"]').value; const pdfFile = this.querySelector('input[name="pdf_file"]').files[0]; if (pdfFile) { const reader = new FileReader(); reader.onload = function(e) { const pdfData = e.target.result; // Store in localStorage (in production, use backend) localStorage.setItem(`pdf_${department}_${startDate}_${endDate}`, pdfData); alert('PDF uploaded successfully!'); }; reader.readAsDataURL(pdfFile); } }); }); // Generate trend chart from PDF data (mock implementation) function generateTrendChart(department, startDate, endDate) { // In a real app, you would parse the PDF and extract data // This is a mock implementation with random data const ctx = document.getElementById('trendChart'); if (!ctx) return; const labels = []; const start = new Date(startDate); const end = new Date(endDate); const diffTime = Math.abs(end - start); const diffDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24)); for (let i = 0; i <= diffDays; i += 7) { labels.push(`Week ${i/7 + 1}`); } const randomData = labels.map(() => Math.floor(Math.random() * 100)); new Chart(ctx, { type: 'line', data: { labels: labels, datasets: [{ label: `${department} Performance Trend`, data: randomData, borderColor: '#f97316', backgroundColor: 'rgba(249, 115, 22, 0.1)', borderWidth: 2, tension: 0.3, fill: true }] }, options: { responsive: true, scales: { y: { beginAtZero: true, max: 100 } } } }); } // Initialize trend chart when viewing a PDF const urlParams = new URLSearchParams(window.location.search); const department = urlParams.get('department'); const startDate = urlParams.get('start_date'); const endDate = urlParams.get('end_date'); if (department && startDate && endDate) { generateTrendChart(department, startDate, endDate); } }); // Theme toggle functionality function toggleTheme() { const html = document.documentElement; if (html.classList.contains('dark')) { html.classList.remove('dark'); localStorage.setItem('theme', 'light'); } else { html.classList.add('dark'); localStorage.setItem('theme', 'dark'); } } // Check for saved theme preference if (localStorage.getItem('theme') === 'dark' || (!localStorage.getItem('theme') && window.matchMedia('(prefers-color-scheme: dark)').matches)) { document.documentElement.classList.add('dark'); } else { document.documentElement.classList.remove('dark'); }