feat: implementacion de dashboards por rol, soporte de clases virtuales concurrentes en importador de sheets y cartelera del dia

2026-09-18 23:04:48 -03:00
parent 47b50ede7e
commit 1080acd43a
240 changed files with 8354 additions and 8886 deletions
@@ -0,0 +1,88 @@
+/**
+ * Theme Toggle Manager - Edu-Space Admin
+ * Manejo de Modo Claro y Modo Oscuro con persistencia en localStorage y anti-flickering.
+ */
+
+(function() {
+    'use strict';
+
+    // 1. Obtener tema almacenado o preferencia del sistema
+    function getPreferredTheme() {
+        const storedTheme = localStorage.getItem('theme');
+        if (storedTheme) {
+            return storedTheme;
+        }
+        return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+    }
+
+    // 2. Aplicar tema al elemento <html>
+    function applyTheme(theme) {
+        document.documentElement.setAttribute('data-bs-theme', theme);
+        updateToggleButtons(theme);
+    }
+
+    // 3. Actualizar iconos de los botones de toggle
+    function updateToggleButtons(theme) {
+        const buttons = document.querySelectorAll('.theme-toggle-btn');
+        buttons.forEach(btn => {
+            const icon = btn.querySelector('i');
+            if (icon) {
+                if (theme === 'dark') {
+                    icon.className = 'bi bi-sun-fill';
+                    btn.setAttribute('aria-label', 'Cambiar a modo claro');
+                    btn.setAttribute('title', 'Modo Claro');
+                } else {
+                    icon.className = 'bi bi-moon-stars-fill';
+                    btn.setAttribute('aria-label', 'Cambiar a modo oscuro');
+                    btn.setAttribute('title', 'Modo Oscuro');
+                }
+            }
+        });
+    }
+
+    // 4. Función global para alternar tema
+    window.toggleTheme = function() {
+        const currentTheme = document.documentElement.getAttribute('data-bs-theme') || getPreferredTheme();
+        const newTheme = currentTheme === 'dark' ? 'light' : 'dark';
+        
+        localStorage.setItem('theme', newTheme);
+        applyTheme(newTheme);
+
+        // Si el usuario está autenticado, sincronizar asíncronamente con su perfil en el backend
+        if (document.body && document.body.getAttribute('data-user-authenticated') === 'true') {
+            fetch('/api/user/theme', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify({ theme: newTheme })
+            }).catch(err => {
+                console.warn('No se pudo sincronizar el tema con el servidor:', err);
+            });
+        }
+    };
+
+
+    // 5. Inicializar tema inmediatamente (anti-flicker)
+    const initialTheme = getPreferredTheme();
+    applyTheme(initialTheme);
+
+    // 6. Al cargar el DOM, registrar eventos en los botones de toggle
+    document.addEventListener('DOMContentLoaded', () => {
+        updateToggleButtons(document.documentElement.getAttribute('data-bs-theme') || initialTheme);
+
+        document.querySelectorAll('.theme-toggle-btn').forEach(btn => {
+            btn.addEventListener('click', (e) => {
+                e.preventDefault();
+                window.toggleTheme();
+            });
+        });
+    });
+
+    // 7. Escuchar cambios de preferencia del sistema si el usuario no fijó una manual
+    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', (e) => {
+        if (!localStorage.getItem('theme')) {
+            applyTheme(e.matches ? 'dark' : 'light');
+        }
+    });
+})();