Spaces:
Running
Running
| 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(); | |
| } |