Class_generator/js/core/simple-logger.js

// === SIMPLE LOGGER - VERSION DE SECOURS ===
// Version simplifiée qui marche à coup sûr

console.log('🔧 Simple Logger chargé');

// Logger global simple
window.logEntries = [];

window.logSh = function(message, level = 'INFO') {
    const timestamp = new Date().toLocaleTimeString('fr-FR');
    const entry = { timestamp, level, message };

    // Stocker
    window.logEntries.push(entry);
    if (window.logEntries.length > 200) {
        window.logEntries.shift();
    }

    // Console
    const color = level === 'ERROR' ? 'color: red' :
                 level === 'WARN' ? 'color: orange' :
                 level === 'DEBUG' ? 'color: blue' : 'color: green';
    console.log(`%c[${timestamp}] ${level}: ${message}`, color);

    // Mettre à jour l'affichage si ouvert
    if (window.simpleLoggerVisible) {
        updateLogDisplay();
    }
};

window.simpleLoggerVisible = false;

window.toggleSimpleLogger = function() {
    console.log('🔧 Toggle simple logger');

    let container = document.getElementById('simple-logger');

    if (!container) {
        // Créer le container
        container = document.createElement('div');
        container.id = 'simple-logger';
        container.style.cssText = `
            position: fixed;
            top: 60px;
            right: 10px;
            width: 500px;
            max-height: 400px;
            background: white;
            border: 2px solid #007bff;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.2);
            font-family: monospace;
            font-size: 12px;
            z-index: 10000;
            display: none;
        `;

        container.innerHTML = `
            <div style="background: #007bff; color: white; padding: 10px; display: flex; justify-content: space-between; align-items: center;">
                <strong>📋 System Logs</strong>
                <button onclick="toggleSimpleLogger()" style="background: rgba(255,255,255,0.2); border: none; color: white; padding: 4px 8px; border-radius: 4px; cursor: pointer;">❌</button>
            </div>
            <div id="log-content" style="max-height: 350px; overflow-y: auto; padding: 0;">
            </div>
            <div style="padding: 8px; background: #f8f9fa; border-top: 1px solid #eee; text-align: center; font-size: 10px; color: #666;">
                ${window.logEntries.length} logs • Ctrl+Shift+L pour toggle
            </div>
        `;

        document.body.appendChild(container);
        console.log('✅ Container créé');
    }

    // Toggle visibility
    if (window.simpleLoggerVisible) {
        container.style.display = 'none';
        window.simpleLoggerVisible = false;
        console.log('Logger masqué');
    } else {
        container.style.display = 'block';
        window.simpleLoggerVisible = true;
        updateLogDisplay();
        console.log('Logger affiché');
    }
};

function updateLogDisplay() {
    const content = document.getElementById('log-content');
    if (!content) return;

    const html = window.logEntries.slice(-50).map(entry => {
        const levelColor = entry.level === 'ERROR' ? '#dc3545' :
                          entry.level === 'WARN' ? '#ffc107' :
                          entry.level === 'DEBUG' ? '#007bff' : '#28a745';

        return `
            <div style="padding: 4px 8px; border-bottom: 1px solid #eee; display: flex; gap: 8px; font-size: 11px;">
                <span style="color: #666; min-width: 60px;">${entry.timestamp}</span>
                <span style="color: ${levelColor}; font-weight: bold; min-width: 50px;">${entry.level}</span>
                <span style="flex: 1;">${entry.message}</span>
            </div>
        `;
    }).join('');

    content.innerHTML = html;
    content.scrollTop = content.scrollHeight;
}

// Raccourci clavier
document.addEventListener('keydown', function(e) {
    if (e.ctrlKey && e.shiftKey && e.key === 'L') {
        toggleSimpleLogger();
    }
});

// Logger disponible
console.log('✅ Simple Logger prêt - window.logSh() disponible');