script.js

document.addEventListener('DOMContentLoaded', () => {
    console.log('CS Practical Questions App Initialized');

    // Apply saved theme on page load
    const savedTheme = localStorage.getItem('theme') || 'light';
    applyTheme(savedTheme);

    // Update toggle button icon if it exists
    updateToggleButton(savedTheme);
});

// Apply theme to the document
function applyTheme(theme) {
    if (theme === 'dark') {
        document.documentElement.setAttribute('data-theme', 'dark');
    } else {
        document.documentElement.removeAttribute('data-theme');
    }
}

// Update the toggle button icon
function updateToggleButton(theme) {
    const toggleBtn = document.querySelector('.theme-toggle');
    if (toggleBtn) {
        toggleBtn.textContent = theme === 'dark' ? '☀️' : '🌙';
    }
}

// Toggle between light and dark theme
function toggleTheme() {
    const currentTheme = localStorage.getItem('theme') || 'light';
    const newTheme = currentTheme === 'dark' ? 'light' : 'dark';

    localStorage.setItem('theme', newTheme);
    applyTheme(newTheme);
    updateToggleButton(newTheme);
}

// Report Problem Modal Functions
function openReportModal() {
    const modal = document.getElementById('reportModal');
    if (modal) {
        modal.classList.add('active');
    }
}

function closeReportModal() {
    const modal = document.getElementById('reportModal');
    if (modal) {
        modal.classList.remove('active');
        // Reset form
        document.getElementById('reportForm').reset();
    }
}

// Close modal when clicking outside
document.addEventListener('click', (e) => {
    const modal = document.getElementById('reportModal');
    if (modal && e.target === modal) {
        closeReportModal();
    }
});

// Close modal with Escape key
document.addEventListener('keydown', (e) => {
    if (e.key === 'Escape') {
        closeReportModal();
    }
});

// Submit report to Discord webhook
async function submitReport(event) {
    event.preventDefault();

    const subject = document.getElementById('reportSubject').value.trim();
    const message = document.getElementById('reportMessage').value.trim();
    const imageInput = document.getElementById('reportImage');
    const submitBtn = document.getElementById('submitBtn');

    if (!subject || !message) {
        alert('Please fill in all fields.');
        return;
    }

    // Check file size (max 8MB)
    const imageFile = imageInput.files[0];
    if (imageFile && imageFile.size > 8 * 1024 * 1024) {
        alert('Image file is too large. Maximum size is 8MB.');
        return;
    }

    // Disable button during submission
    submitBtn.disabled = true;
    submitBtn.textContent = 'Sending...';

    const webhookUrl = 'https://discord.com/api/webhooks/1469972554344300608/A-XEXdQLFH9yhS6vIskrV9Fc-7dSICBMkBaEoSdeaJ_RDhBAjAhryMUxRLMnhN4SR3yU';

    const payload = {
        embeds: [{
            title: '🐛 Problem Report',
            color: 0xff6b6b,
            fields: [
                {
                    name: 'Subject',
                    value: subject,
                    inline: false
                },
                {
                    name: 'Message',
                    value: message,
                    inline: false
                }
            ],
            timestamp: new Date().toISOString()
        }]
    };

    // If there's an image, add it to the embed
    if (imageFile) {
        payload.embeds[0].image = { url: 'attachment://image.' + imageFile.name.split('.').pop() };
    }

    try {
        let response;

        if (imageFile) {
            // Use FormData for file upload
            const formData = new FormData();
            formData.append('payload_json', JSON.stringify(payload));
            formData.append('file', imageFile, 'image.' + imageFile.name.split('.').pop());

            response = await fetch(webhookUrl, {
                method: 'POST',
                body: formData
            });
        } else {
            // No image, just send JSON
            response = await fetch(webhookUrl, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(payload)
            });
        }

        if (response.ok) {
            alert('Thank you! Your report has been submitted.');
            closeReportModal();
        } else {
            throw new Error('Failed to send report');
        }
    } catch (error) {
        console.error('Error submitting report:', error);
        alert('Failed to submit report. Please try again later.');
    } finally {
        submitBtn.disabled = false;
        submitBtn.textContent = 'Submit';
    }
}