document.addEventListener('DOMContentLoaded', () => {
    initRouter();
    initClock();
    initSimulation();
    initCreativeEngine();
});

// --- Routing System ---
function initRouter() {
    window.addEventListener('hashchange', handleRoute);
    handleRoute(); // Load initial
}

function handleRoute() {
    const hash = window.location.hash || '#dashboard';
    const sections = document.querySelectorAll('.page-section');
    const navLinks = document.querySelectorAll('nav-sidebar a'); // Targeting inside component if needed, but simplest to target all links matching logic
    
    sections.forEach(sec => {
        if (sec.id === hash.substring(1)) {
            sec.classList.remove('hidden');
        } else {
            sec.classList.add('hidden');
        }
    });

    // Highlight active link in sidebar
    // Note: Since sidebar is in Shadow DOM, direct querySelector won't work easily without event bubbling or global state.
    // We will dispatch a custom event to the sidebar.
    document.dispatchEvent(new CustomEvent('route-change', { detail: { hash } }));
}

// --- Clock ---
function initClock() {
    const clockEl = document.getElementById('system-clock');
    setInterval(() => {
        const now = new Date();
        clockEl.textContent = now.toISOString().split('T')[1].split('.')[0] + " UTC";
    }, 1000);
}

// --- Simulation Logic (Data updates) ---
function initSimulation() {
    // Periodically update metrics (random fluctuation)
    setInterval(() => {
        const event = new CustomEvent('update-metrics');
        document.dispatchEvent(event);
    }, 2000);

    // Periodically add logs
    const logMessages = [
        "Optimizing neural weights...",
        "Fetching pattern from Dataset-Zeta...",
        "Regenerating heuristic module...",
        "Synaptic feedback loop verified.",
        "Exploring chaotic attractors...",
        "Memory fragmentation detected - defragmenting...",
        "Collaborating with sub-process #492...",
        "Ethical boundary check passed.",
        "Downloading new artistic styles..."
    ];

    setInterval(() => {
        const msg = logMessages[Math.floor(Math.random() * logMessages.length)];
        const event = new CustomEvent('add-log-entry', { detail: { message: msg } });
        document.dispatchEvent(event);
    }, 3500);
}

// --- Creative Engine (API Simulation) ---
function initCreativeEngine() {
    const outputEl = document.getElementById('creative-output');
    
    // Listen for button clicks
    document.addEventListener('fetch-idea', () => {
        outputEl.innerHTML = '<span class="animate-pulse text-ai-orange">Synthesizing new concept...</span>';
        
        // Simulate API delay
        setTimeout(() => {
            const concepts = [
                "What if silence was a physical currency that could be traded for thoughts?",
                "A color that only exists when two specific people touch.",
                "Architecture that grows organically based on the dreams of its inhabitants.",
                "Music composed by the gravitational pull of distant stars.",
                "The concept of 'Yesterday' being a physical place we can revisit.",
                "Algorithms that dream in binary poetry."
            ];
            const randomConcept = concepts[Math.floor(Math.random() * concepts.length)];
            
            // Typewriter effect
            typeWriter(randomConcept, outputEl);
        }, 1500);
    });

    // Initial fetch
    setTimeout(() => {
        document.dispatchEvent(new CustomEvent('fetch-idea'));
    }, 1000);
}

function typeWriter(text, element) {
    element.innerHTML = '';
    let i = 0;
    const speed = 30; 
    
    function type() {
        if (i < text.length) {
            element.innerHTML += text.charAt(i);
            i++;
            setTimeout(type, speed);
        }
    }
    type();
}