91 lines
3.3 KiB
JavaScript
91 lines
3.3 KiB
JavaScript
// frontend/public/bootstrap.js
|
|
|
|
(function () {
|
|
// El dominio donde se alojan los widgets
|
|
const WIDGETS_HOST = 'https://elecciones2025.eldia.com';
|
|
|
|
// Función para cargar dinámicamente un script
|
|
function loadScript(src) {
|
|
return new Promise((resolve, reject) => {
|
|
const script = document.createElement('script');
|
|
script.type = 'module';
|
|
script.src = src;
|
|
script.onload = resolve;
|
|
script.onerror = reject;
|
|
document.head.appendChild(script);
|
|
});
|
|
}
|
|
|
|
// Función para cargar dinámicamente una hoja de estilos
|
|
function loadCSS(href) {
|
|
const link = document.createElement('link');
|
|
link.rel = 'stylesheet';
|
|
link.href = href;
|
|
document.head.appendChild(link);
|
|
}
|
|
|
|
// Función principal
|
|
async function initWidgets() {
|
|
try {
|
|
// 1. Obtener el manifest.json para saber los nombres de archivo actuales
|
|
const response = await fetch(`${WIDGETS_HOST}/manifest.json`);
|
|
if (!response.ok) {
|
|
throw new Error('No se pudo cargar el manifest de los widgets.');
|
|
}
|
|
const manifest = await response.json();
|
|
|
|
// 2. Encontrar el punto de entrada principal (nuestro main.tsx)
|
|
const entryKey = Object.keys(manifest).find(key => manifest[key].isEntry);
|
|
if (!entryKey) {
|
|
throw new Error('No se encontró el punto de entrada en el manifest.');
|
|
}
|
|
|
|
const entry = manifest[entryKey];
|
|
const jsUrl = `${WIDGETS_HOST}/${entry.file}`;
|
|
|
|
// 3. Cargar el CSS si existe
|
|
if (entry.css && entry.css.length > 0) {
|
|
entry.css.forEach(cssFile => {
|
|
const cssUrl = `${WIDGETS_HOST}/${cssFile}`;
|
|
loadCSS(cssUrl);
|
|
});
|
|
}
|
|
|
|
// 4. Cargar el JS principal y esperar a que esté listo
|
|
await loadScript(jsUrl);
|
|
|
|
console.log('Bootstrap: Intentando llamar a render...');
|
|
if (window.EleccionesWidgets && typeof window.EleccionesWidgets.render === 'function') {
|
|
console.log('Bootstrap: La función render existe. Llamando ahora.');
|
|
window.EleccionesWidgets.render();
|
|
} else {
|
|
console.error('Bootstrap: La función render no se encontró en window.EleccionesWidgets.');
|
|
}
|
|
|
|
// 5. Una vez cargado, llamar a la función de renderizado
|
|
if (window.EleccionesWidgets && typeof window.EleccionesWidgets.render === 'function') {
|
|
console.log('Bootstrap: La función render existe. Llamando ahora.');
|
|
// Encontramos los contenedores aquí y pasamos sus props.
|
|
const widgetContainers = document.querySelectorAll('[data-elecciones-widget]');
|
|
widgetContainers.forEach(container => {
|
|
// 'dataset' es un objeto que contiene todos los atributos data-*
|
|
// container.dataset = { eleccionesWidget: 'mapa-municipios', focoMunicipio: 'LA PLATA' }
|
|
window.EleccionesWidgets.render(container, container.dataset);
|
|
});
|
|
} else {
|
|
console.error('Bootstrap: ERROR CRÍTICO - La función render() NO SE ENCONTRÓ en window.EleccionesWidgets.');
|
|
console.log('Bootstrap: Contenido de window.EleccionesWidgets:', window.EleccionesWidgets);
|
|
}
|
|
|
|
} catch (error) {
|
|
console.error('Error al inicializar los widgets de elecciones:', error);
|
|
}
|
|
}
|
|
|
|
if (document.readyState === 'loading') { // Aún cargando
|
|
document.addEventListener('DOMContentLoaded', initWidgets);
|
|
} else { // Ya cargado
|
|
initWidgets();
|
|
}
|
|
|
|
})(); |