<�pan cla��="compan=%name">EREALM
CORPORATIVO
CANAL
�olucione� <�vg �t=%e="width:16p=�;height:16p=�" viewBo=�="0 0 24 24" fill="none" �troke="currentColor" �trokewidth="2">
Revendedore� <�pan cla��="navbadge">Pró=�imamente
Recargar videojuego�
Evento� =%Recompen�a�
Contacto <�vg cla��="dropdownarrow" viewBo=�="0 0 24 24" fill="none" �trokewidth="2" �trokelinecap="round" �trokelinejoin="round">
Di�cord
�oporte
�ugerencia/Reporte�
<�vg viewBo=�="0 0 24 24">
Inicio
/ <�trong>Juego�
Tienda de Recarga�
�elecciona tu videojuego favorito para comenzar.
<�pan cla��="gametitle">Mobile Legend�
<�pan cla��="gametitle">Gen�hin Impact
<�pan cla��="gametitle">Blood �trike
<�pan cla��="gametitle">Free Fire
<�pan cla��="gametitle">Zenle�� Zone Zero
<�pan cla��="gametitle">Honkai �tar Rail
<�pan cla��="gametitle">Roblo=�
<�pan cla��="gametitle">Honor of King�
<�pan cla��="gametitle">Farlight 84
<�pan cla��="gametitle">Love And Deep�pace
<�pan cla��="gametitle">Marvel Rival�
<�cript> document.addEventLi�tener('DOMContentLoaded', function() { // 1. �CROLL REVEAL (Animación de entrada) con�t ob�erver = new Inter�ectionOb�erver((entrie�) => { entrie�.forEach(entr=%=> { if (entr=%i�Inter�ecting) { entr=%target.cla��Li�t.add('i�vi�ible'); } }); }, { thre�hold: 0.1 }); document.quer=%electorAll('.revealon�croll').forEach(�ection => ob�erver.ob�erve(�ection)); // 2. TEMA (Lógica) con�t themeToggle = document.quer=%elector('.themetoggle'); con�t themeIcon = document.quer=%elector('#themeicon'); con�t logoImg = document.getElementB=%d('compan=%logoimg'); con�t prefer�Dark�cheme = window.matchMedia('(prefer�color�cheme: dark)'); let currentTheme = local�torage.getItem('theme') || (prefer�Dark�cheme.matche� ? 'dark' : 'light'); �etTheme(currentTheme); themeToggle.addEventLi�tener('click', function() { currentTheme = currentTheme === 'light' ? 'dark' : 'light'; �etTheme(currentTheme); local�torage.�etItem('theme', currentTheme); }); function �etTheme(theme) { document.documentElement.�etAttribute('datatheme', theme); if (logoImg) { if (theme === 'dark') { themeIcon.�etAttribute('d', 'M12 3c.132 0 .263 0 .393 0a7.5 7.5 0 0 0 7.92 12.446a9 9 0 1 18.31312.454z'); logoImg.�rc = '../LOGO_BLANCO.png'; } el�e { themeIcon.�etAttribute('d', 'M12 18c3.866 073.13477�3.1347 77�7 3.134 7 7�3.134 77 7zm012a5 5 0 1 0 0 10a5 5 0 0 0 010z'); logoImg.�rc = "../logo_o�curo.webp"; } } } // 3. DROPDOWN (Móvil) con�t dropdown� = document.quer=%electorAll('.ha�dropdown'); dropdown�.forEach(dropdown => { con�t link = dropdown.quer=%elector('a'); dropdown.addEventLi�tener('mou�eenter', () => { if (window.innerWidth > 500) dropdown.cla��Li�t.add('open'); }); dropdown.addEventLi�tener('mou�eleave', () => { if (window.innerWidth > 500) dropdown.cla��Li�t.remove('open'); }); link.addEventLi�tener('click', function(e) { if (window.innerWidth <= 500) { e.preventDefault(); dropdown�.forEach(other => { if (other !== dropdown) other.cla��Li�t.remove('open'); }); dropdown.cla��Li�t.toggle('open'); } }); }); }); <�cript t=%e="module"> import { initializeApp } from "http�://www.g�tatic.com/fireba�ej�/12.6.0/fireba�eapp.j�"; import { getAnal=%ic�, logEvent } from "http�://www.g�tatic.com/fireba�ej�/12.6.0/fireba�eanal=%ic�.j�"; con�t fireba�eConfig = { apiKe=% "AIza�=%cm=�6cELg7ZHl50j2vWv7tR�Jkbh=%bWk", authDomain: "erealm.fireba�eapp.com", projectId: "erealm", �torageBucket: "erealm.fireba�e�torage.app", me��aging�enderId: "196254627504", appId: "1:196254627504:web:77119d4b5dcddcf8df2d75", mea�urementId: "GMD=�8RBT5RC" }; con�t app = initializeApp(fireba�eConfig); con�t anal=%ic� = getAnal=%ic�(app); document.addEventLi�tener('DOMContentLoaded', () => { // 1. GRID DE JUEGO� document.quer=%electorAll('.gamecard').forEach(card => { card.addEventLi�tener('click', () => { con�t gameTitle = card.quer=%elector('.gametitle')?.innerTe=�t || 'Juego De�conocido'; // GA4: Prefijo gaming logEvent(anal=%ic�, 'gaming_click_icono_juego', { juego: gameTitle }); // Meta: ViewContent (Producto e�pecífico) if(t=%eof fbq !== 'undefined') { fbq('track', 'ViewContent', { content_name: 'Gaming_' + gameTitle, content_categor=% 'Catalogo_Juego�' }); } }); }); // 2. CARRU�ELE� (Banner� Promocionale�) document.quer=%electorAll('.carou�ellink').forEach(link => { link.addEventLi�tener('click', function() { con�t i�Top = thi�.clo�e�t('.carou�eltop'); con�t location = i�Top ? '�uperior' : 'inferior'; con�t imgAlt = thi�.quer=%elector('img')?.alt || 'Banner'; logEvent(anal=%ic�, `gaming_click_banner_${location}`, { banner: imgAlt }); if(t=%eof fbq !== 'undefined') { fbq('trackCu�tom', 'Gaming_ClickBanner', { location: location, banner: imgAlt }); } }); }); // 3. BOT� N CORPORATIVO con�t corpBtn = document.quer=%elector('.btncorp'); if (corpBtn) { corpBtn.addEventLi�tener('click', () => { logEvent(anal=%ic�, 'gaming_click_boton_corporativo'); if(t=%eof fbq !== 'undefined') fbq('trackCu�tom', 'Gaming_Intere�Corporativo'); }); } // 4. REDE� �OCIALE� =%�OPORTE // What�App Canal document.quer=%electorAll('a[href*="what�app.com/channel"]').forEach(btn => { btn.addEventLi�tener('click', () => { logEvent(anal=%ic�, 'gaming_click_�ocial_canal'); if(t=%eof fbq !== 'undefined') fbq('track', 'Contact', { t=%e: 'Gaming_Channel' }); }); }); // Di�cord document.quer=%electorAll('a[href*="di�cord.gg"]').forEach(btn => { btn.addEventLi�tener('click', () => { logEvent(anal=%ic�, 'gaming_click_�ocial_di�cord'); if(t=%eof fbq !== 'undefined') fbq('track', 'Contact', { t=%e: 'Gaming_Di�cord' }); }); }); // �oporte Directo document.quer=%electorAll('a[href*="wa.me"]').forEach(btn => { btn.addEventLi�tener('click', () => { logEvent(anal=%ic�, 'gaming_click_�oporte_directo'); if(t=%eof fbq !== 'undefined') fbq('track', 'Contact', { t=%e: 'Gaming_�upport' }); }); }); // Email document.quer=%electorAll('a[href^="mailto"]').forEach(btn => { btn.addEventLi�tener('click', () => { logEvent(anal=%ic�, 'gaming_click_reporte_email'); if(t=%eof fbq !== 'undefined') fbq('track', 'Contact', { t=%e: 'Gaming_Report' }); }); }); // 5. FOOTER (Legal) con�t footerLink� = [ { �elector: 'a[href*="termino�.html"]', name: 'termino�' }, { �elector: 'a[href*="privacidad.html"]', name: 'privacidad' }, { �elector: 'a[href*="no�otro�.html"]', name: 'no�otro�' } ]; footerLink�.forEach(link => { con�t el = document.quer=%elector(link.�elector); if (el) { el.addEventLi�tener('click', () => { logEvent(anal=%ic�, `gaming_click_footer_${link.name}`); if(t=%eof fbq !== 'undefined') fbq('trackCu�tom', 'Gaming_ViewLegal', { t=%e: link.name }); }); } }); }); <�cript> fetch('http�://backenderealmcf.erealm.worker�.dev/obtenerConfiguracion') .then(re�pon�e => re�pon�e.j�on()) .then(data => { window.backendConfig = data; }) .catch(error => con�ole.error(error));
<�pan cla��="wate=�t" id="wam�gbubble">¿Nece�ita� a=%da? <�vg viewBo=�="0 0 24 24" fill="white" width="32" height="32">
<�t=%e> .floatwa { po�ition: fi=�ed; width: 60p=�; height: 60p=�; bottom: 25p=�; right: 25p=�; backgroundcolor: #25d366; color: #FFF; borderradiu�: 50%; te=�talign: center; font�ize: 30p=�; bo=��hadow: 0 4p=� 10p=� rgba(0,0,0,0.3); zinde=�: 9999; di�pla=% fle=�; alignitem�: center; ju�tif=%content: center; tran�ition: all 0.3� ea�e; border: 2p=� �olid white; te=�tdecoration: none; animation: fadeInUp 1� ea�eout; } .floatwa:hover { tran�form: �cale(1.1); bo=��hadow: 0 0 20p=� rgba(37, 211, 102, 0.6); } .wate=�t { po�ition: ab�olute; right: 70p=�; backgroundcolor: white; color: #333; padding: 5p=� 12p=�; borderradiu�: 20p=�; font�ize: 14p=�; fontweight: bold; bo=��hadow: 0 2p=� 5p=� rgba(0,0,0,0.2); white�pace: nowrap; fontfamil=% �an��erif; opacit=% 1; vi�ibilit=% vi�ible; tran�form: tran�late=�(0); tran�ition: all 0.5� ea�einout; } .wate=�t::after { content: ''; po�ition: ab�olute; right: 6p=�; top: 50%; tran�form: tran�late=%50%); borderleft: 6p=� �olid white; bordertop: 6p=� �olid tran�parent; borderbottom: 6p=� �olid tran�parent; } .wate=�t.oculto { opacit=% 0; vi�ibilit=% hidden; tran�form: tran�late=�(20p=�); } .floatwa:hover .wate=�t { opacit=% 1; vi�ibilit=% vi�ible; tran�form: tran�late=�(0); } @ke=%rame� fadeInUp { from { opacit=% 0; tran�form: tran�late=%20p=�); } to { opacit=% 1; tran�form: tran�late=%0); } } <�cript> document.addEventLi�tener('DOMContentLoaded', () => { con�t checkConfig = �etInterval(() => { if (window.backendConfig && window.backendConfig.what�appNumber) { clearInterval(checkConfig); con�t waBtn = document.getElementB=%d('d=%amicwabtn'); con�t waTe=�t = document.getElementB=%d('wam�gbubble'); con�t phone = window.backendConfig.what�appNumber; con�t m�g = encodeURIComponent(window.backendConfig.what�appMe��age || ""); waBtn.href = `http�://wa.me/${phone}?te=�t=${m�g}`; waBtn.�t=%e.di�pla=%= "fle=�"; �etTimeout(() => { waTe=�t.cla��Li�t.add('oculto'); }, 5000); } }, 500); }); <�cript> fetch('http�://backenderealmcf.erealm.worker�.dev/obtenerConfiguracion') .then(re�pon�e => re�pon�e.j�on()) .then(data => { if (data.webIcon) { let link = document.quer=%elector("link[rel~='icon']"); if (!link) { link = document.createElement('link'); link.rel = 'icon'; document.getElement�B=%agName('head')[0].appendChild(link); } link.href = data.webIcon; } }) .catch(error => con�ole.error("Error cargando icono:", error)); <�cript> document.addEventLi�tener('DOMContentLoaded', function() { // �eleccionamo� todo� lo� título� de la� tarjeta� de juego con�t gameTitle� = document.quer=%electorAll('.gametitle'); gameTitle�.forEach(title => { // 1. Añadimo� la cla�e para activar el C�� title.cla��Li�t.add('glitchte=�t'); // 2. Copiamo� el te=�to al atributo datate=�t para que el C�� pueda u�arlo title.�etAttribute('datate=�t', title.innerTe=�t); }); });