// Dashboard JavaScript - Externe Datei für CSP-Konformität

// Globale Variablen
let dashboardData = {};
let updateInterval;

// DOM-Elemente
const elements = {
    activeJobs: null,
    scheduledJobs: null,
    availablePrinters: null,
    totalPrintTime: null,
    schedulerStatus: null,
    recentJobsList: null,
    recentActivitiesList: null,
    refreshBtn: null,
    schedulerToggleBtn: null
};

// Initialisierung beim Laden der Seite
document.addEventListener('DOMContentLoaded', function() {
    initializeDashboard();
});

function initializeDashboard() {
    // DOM-Elemente referenzieren
    elements.activeJobs = document.getElementById('active-jobs');
    elements.scheduledJobs = document.getElementById('scheduled-jobs');
    elements.availablePrinters = document.getElementById('available-printers');
    elements.totalPrintTime = document.getElementById('total-print-time');
    elements.schedulerStatus = document.getElementById('scheduler-status');
    elements.recentJobsList = document.getElementById('recent-jobs-list');
    elements.recentActivitiesList = document.getElementById('recent-activities-list');
    elements.refreshBtn = document.getElementById('refresh-btn');
    elements.schedulerToggleBtn = document.getElementById('scheduler-toggle-btn');

    // Event-Listener hinzufügen
    if (elements.refreshBtn) {
        elements.refreshBtn.addEventListener('click', refreshDashboard);
    }
    
    if (elements.schedulerToggleBtn) {
        elements.schedulerToggleBtn.addEventListener('click', toggleScheduler);
    }

    // Initiales Laden der Daten
    loadDashboardData();
    loadRecentJobs();
    loadRecentActivities();
    loadSchedulerStatus();

    // Auto-Update alle 30 Sekunden
    updateInterval = setInterval(function() {
        loadDashboardData();
        loadRecentJobs();
        loadRecentActivities();
        loadSchedulerStatus();
    }, 30000);
}

// Dashboard-Hauptdaten laden
async function loadDashboardData() {
    try {
        const response = await fetch('/api/dashboard');
        if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
        }
        
        dashboardData = await response.json();
        updateDashboardUI();
        
    } catch (error) {
        console.error('Fehler beim Laden der Dashboard-Daten:', error);
        showError('Fehler beim Laden der Dashboard-Daten');
    }
}

// Dashboard-UI aktualisieren
function updateDashboardUI() {
    if (elements.activeJobs) {
        elements.activeJobs.textContent = dashboardData.active_jobs || 0;
    }
    
    if (elements.scheduledJobs) {
        elements.scheduledJobs.textContent = dashboardData.scheduled_jobs || 0;
    }
    
    if (elements.availablePrinters) {
        elements.availablePrinters.textContent = dashboardData.available_printers || 0;
    }
    
    if (elements.totalPrintTime) {
        const hours = Math.floor((dashboardData.total_print_time || 0) / 3600);
        const minutes = Math.floor(((dashboardData.total_print_time || 0) % 3600) / 60);
        elements.totalPrintTime.textContent = `${hours}h ${minutes}m`;
    }
}

// Aktuelle Jobs laden
async function loadRecentJobs() {
    try {
        const response = await fetch('/api/jobs/recent');
        if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
        }
        
        const data = await response.json();
        updateRecentJobsList(data.jobs);
        
    } catch (error) {
        console.error('Fehler beim Laden der aktuellen Jobs:', error);
        if (elements.recentJobsList) {
            elements.recentJobsList.innerHTML = '<li class="list-group-item text-danger">Fehler beim Laden</li>';
        }
    }
}

// Jobs-Liste aktualisieren
function updateRecentJobsList(jobs) {
    if (!elements.recentJobsList) return;
    
    if (!jobs || jobs.length === 0) {
        elements.recentJobsList.innerHTML = '<li class="list-group-item text-muted">Keine aktuellen Jobs</li>';
        return;
    }
    
    const jobsHtml = jobs.map(job => {
        const statusClass = getStatusClass(job.status);
        const timeAgo = formatTimeAgo(job.created_at);
        
        return `
            <li class="list-group-item d-flex justify-content-between align-items-center">
                <div>
                    <strong>${escapeHtml(job.name)}</strong><br>
                    <small class="text-muted">${escapeHtml(job.printer_name)} • ${timeAgo}</small>
                </div>
                <span class="badge ${statusClass}">${getStatusText(job.status)}</span>
            </li>
        `;
    }).join('');
    
    elements.recentJobsList.innerHTML = jobsHtml;
}

// Aktuelle Aktivitäten laden
async function loadRecentActivities() {
    try {
        const response = await fetch('/api/activity/recent');
        if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
        }
        
        const data = await response.json();
        updateRecentActivitiesList(data.activities);
        
    } catch (error) {
        console.error('Fehler beim Laden der Aktivitäten:', error);
        if (elements.recentActivitiesList) {
            elements.recentActivitiesList.innerHTML = '<li class="list-group-item text-danger">Fehler beim Laden</li>';
        }
    }
}

// Aktivitäten-Liste aktualisieren
function updateRecentActivitiesList(activities) {
    if (!elements.recentActivitiesList) return;
    
    if (!activities || activities.length === 0) {
        elements.recentActivitiesList.innerHTML = '<li class="list-group-item text-muted">Keine aktuellen Aktivitäten</li>';
        return;
    }
    
    const activitiesHtml = activities.map(activity => {
        const timeAgo = formatTimeAgo(activity.timestamp);
        
        return `
            <li class="list-group-item">
                <div>${escapeHtml(activity.description)}</div>
                <small class="text-muted">${timeAgo}</small>
            </li>
        `;
    }).join('');
    
    elements.recentActivitiesList.innerHTML = activitiesHtml;
}

// Scheduler-Status laden
async function loadSchedulerStatus() {
    try {
        const response = await fetch('/api/scheduler/status');
        if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
        }
        
        const data = await response.json();
        updateSchedulerStatus(data.running);
        
    } catch (error) {
        console.error('Fehler beim Laden des Scheduler-Status:', error);
        if (elements.schedulerStatus) {
            elements.schedulerStatus.innerHTML = '<span class="badge bg-secondary">Unbekannt</span>';
        }
    }
}

// Scheduler-Status aktualisieren
function updateSchedulerStatus(isRunning) {
    if (!elements.schedulerStatus) return;
    
    const statusClass = isRunning ? 'bg-success' : 'bg-danger';
    const statusText = isRunning ? 'Aktiv' : 'Gestoppt';
    
    elements.schedulerStatus.innerHTML = `<span class="badge ${statusClass}">${statusText}</span>`;
    
    if (elements.schedulerToggleBtn) {
        elements.schedulerToggleBtn.textContent = isRunning ? 'Scheduler stoppen' : 'Scheduler starten';
        elements.schedulerToggleBtn.className = isRunning ? 'btn btn-danger btn-sm' : 'btn btn-success btn-sm';
    }
}

// Scheduler umschalten
async function toggleScheduler() {
    try {
        const isRunning = dashboardData.scheduler_running;
        const endpoint = isRunning ? '/api/scheduler/stop' : '/api/scheduler/start';
        
        const response = await fetch(endpoint, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            }
        });
        
        if (!response.ok) {
            throw new Error(`HTTP ${response.status}: ${response.statusText}`);
        }
        
        const result = await response.json();
        
        if (result.success) {
            showSuccess(result.message);
            // Status sofort neu laden
            setTimeout(loadSchedulerStatus, 1000);
        } else {
            showError(result.error || 'Unbekannter Fehler');
        }
        
    } catch (error) {
        console.error('Fehler beim Umschalten des Schedulers:', error);
        showError('Fehler beim Umschalten des Schedulers');
    }
}

// Dashboard manuell aktualisieren
function refreshDashboard() {
    if (elements.refreshBtn) {
        elements.refreshBtn.disabled = true;
        elements.refreshBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Aktualisiere...';
    }
    
    Promise.all([
        loadDashboardData(),
        loadRecentJobs(),
        loadRecentActivities(),
        loadSchedulerStatus()
    ]).finally(() => {
        if (elements.refreshBtn) {
            elements.refreshBtn.disabled = false;
            elements.refreshBtn.innerHTML = '<i class="fas fa-sync-alt"></i> Aktualisieren';
        }
    });
}

// Hilfsfunktionen
function getStatusClass(status) {
    const statusClasses = {
        'pending': 'bg-warning',
        'printing': 'bg-primary',
        'completed': 'bg-success',
        'failed': 'bg-danger',
        'cancelled': 'bg-secondary',
        'scheduled': 'bg-info'
    };
    return statusClasses[status] || 'bg-secondary';
}

function getStatusText(status) {
    const statusTexts = {
        'pending': 'Wartend',
        'printing': 'Druckt',
        'completed': 'Abgeschlossen',
        'failed': 'Fehlgeschlagen',
        'cancelled': 'Abgebrochen',
        'scheduled': 'Geplant'
    };
    return statusTexts[status] || status;
}

function formatTimeAgo(timestamp) {
    const now = new Date();
    const time = new Date(timestamp);
    const diffMs = now - time;
    const diffMins = Math.floor(diffMs / 60000);
    const diffHours = Math.floor(diffMins / 60);
    const diffDays = Math.floor(diffHours / 24);
    
    if (diffMins < 1) return 'Gerade eben';
    if (diffMins < 60) return `vor ${diffMins} Min`;
    if (diffHours < 24) return `vor ${diffHours} Std`;
    return `vor ${diffDays} Tag${diffDays > 1 ? 'en' : ''}`;
}

function escapeHtml(text) {
    const div = document.createElement('div');
    div.textContent = text;
    return div.innerHTML;
}

function showSuccess(message) {
    showNotification(message, 'success');
}

function showError(message) {
    showNotification(message, 'danger');
}

function showNotification(message, type) {
    // Einfache Notification - kann später durch Toast-System ersetzt werden
    const alertDiv = document.createElement('div');
    alertDiv.className = `alert alert-${type} alert-dismissible fade show position-fixed`;
    alertDiv.style.top = '20px';
    alertDiv.style.right = '20px';
    alertDiv.style.zIndex = '9999';
    alertDiv.innerHTML = `
        ${escapeHtml(message)}
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    `;
    
    document.body.appendChild(alertDiv);
    
    // Automatisch nach 5 Sekunden entfernen
    setTimeout(() => {
        if (alertDiv.parentNode) {
            alertDiv.parentNode.removeChild(alertDiv);
        }
    }, 5000);
}

// Cleanup beim Verlassen der Seite
window.addEventListener('beforeunload', function() {
    if (updateInterval) {
        clearInterval(updateInterval);
    }
});