// 1. Registrar los íconos SVG
// * Los iconos que comienzan con "_" aun estan pendientes de integrarse
const icons = {
// Branded
banregio: ``,
banregio_box: ``,
_banregio_icon: ``,
banregio_icon_box: ``,
banregio_realmente_personal: ``,
// Social Media
facebook: ``,
twitter: ``,
twitter_x: ``,
instagram: ``,
linkedin: ``,
// Utilities
close: ``,
check: ``,
arrow: ``
// Agrega más íconos aquí
};
// 2. Función para insertar el SVG correspondiente
function insertIcons() {
// Buscar todos los elementos que tengan una clase que empiece con "icon icon--"
document.querySelectorAll('[class*="icon--"]').forEach(element => {
// Extraer todas las clases del elemento
const classList = element.className.split(' ');
// Buscar la clase que contiene "icon--" y extraer la parte que sigue al guion
const iconClass = classList.find(cls => cls.startsWith('icon--'));
if (iconClass) {
// Obtener el nombre del icono sin el "icon--"
const iconName = iconClass.split('icon--')[1];
// Si el ícono existe en el registro, insertarlo
if (icons[iconName]) {
element.innerHTML = icons[iconName];
// console.log('Icono insertado:', iconName);
} else {
// console.log('Icono no encontrado:', iconName);
}
}
});
}
// 3. Ejecutar la función al cargar la página
document.addEventListener('DOMContentLoaded', insertIcons);
// 4. Ejecutar la función al modificar los inputs del form
function insertIconsForm() {
// Buscar todos los elementos que tengan una clase que empiece con "icon icon--"
document.querySelectorAll('form [class*="icon--"]').forEach(element => {
// Extraer todas las clases del elemento
const classList = element.className.split(' ');
// Buscar la clase que contiene "icon--" y extraer la parte que sigue al guion
const iconClass = classList.find(cls => cls.startsWith('icon--'));
if (iconClass) {
// Obtener el nombre del icono sin el "icon--"
const iconName = iconClass.split('icon--')[1];
// Si el ícono existe en el registro, insertarlo
if (icons[iconName]) {
element.innerHTML = icons[iconName];
// console.log('Icono insertado:', iconName);
} else {
// console.log('Icono no encontrado:', iconName);
}
}
});
}
document.querySelectorAll('form[id^="formulario__"] input.form-control').forEach(input => {
input.addEventListener('keyup', insertIconsForm);
input.addEventListener('blur', insertIconsForm);
input.addEventListener('input', insertIconsForm);
input.addEventListener('change', insertIconsForm);
input.addEventListener('focus', insertIconsForm);
input.addEventListener('paste', insertIconsForm);
});
document.querySelectorAll('form[id^="formulario__"] select').forEach(select => {
select.addEventListener('change', insertIconsForm);
select.addEventListener('input', insertIconsForm);
});