// mGuard VPN Manager - Custom JavaScript

// HTMX Configuration
document.body.addEventListener('htmx:configRequest', function(evt) {
    // Add CSRF token to all HTMX requests
    // evt.detail.headers['X-CSRFToken'] = document.querySelector('meta[name="csrf-token"]')?.content;
});

// Show loading indicator during HTMX requests
document.body.addEventListener('htmx:beforeRequest', function(evt) {
    // Optional: Show global loading indicator
});

document.body.addEventListener('htmx:afterRequest', function(evt) {
    // Optional: Hide global loading indicator
});

// Handle HTMX errors
document.body.addEventListener('htmx:responseError', function(evt) {
    console.error('HTMX Error:', evt.detail);
    // Show error toast or alert
});

// Initialize tooltips
document.addEventListener('DOMContentLoaded', function() {
    // Bootstrap tooltips
    var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
    tooltipTriggerList.map(function(tooltipTriggerEl) {
        return new bootstrap.Tooltip(tooltipTriggerEl);
    });

    // Bootstrap popovers
    var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
    popoverTriggerList.map(function(popoverTriggerEl) {
        return new bootstrap.Popover(popoverTriggerEl);
    });
});

// Confirm delete dialogs
function confirmDelete(message, formId) {
    if (confirm(message || 'Wirklich löschen?')) {
        document.getElementById(formId).submit();
    }
    return false;
}

// Auto-refresh gateway status
function refreshGatewayStatus() {
    // Handled by HTMX polling
}

// Format relative time
function formatRelativeTime(dateString) {
    if (!dateString) return 'Nie';

    const date = new Date(dateString);
    const now = new Date();
    const diff = Math.floor((now - date) / 1000);

    if (diff < 60) return 'Gerade eben';
    if (diff < 3600) return Math.floor(diff / 60) + ' Min.';
    if (diff < 86400) return Math.floor(diff / 3600) + ' Std.';
    return Math.floor(diff / 86400) + ' Tage';
}

// Update all relative times on page
function updateRelativeTimes() {
    document.querySelectorAll('[data-relative-time]').forEach(function(el) {
        el.textContent = formatRelativeTime(el.dataset.relativeTime);
    });
}

// Update times every minute
setInterval(updateRelativeTimes, 60000);

// Copy to clipboard
function copyToClipboard(text) {
    navigator.clipboard.writeText(text).then(function() {
        // Show success toast
        console.log('Copied to clipboard');
    });
}