/* ===================================================================== DQ INSURANCE · JavaScript para el portal de cursos (GoHighLevel) Pegar en: Memberships > Courses > Settings > Advanced > Custom JS (si el campo pide etiquetas, pon una etiqueta script de apertura antes y una de cierre después) Qué agrega: 1. Banner de bienvenida de marca en la biblioteca de cursos (saludo según la hora, contador de cursos y frase motivadora). 2. Botón flotante de ayuda por WhatsApp. 3. Confeti y un mensaje de felicitación al completar una lección. 4. Aparición suave de las tarjetas al hacer scroll. Todo es a prueba de fallos: si algo no existe en la página, se omite sin afectar el portal. ===================================================================== */ (function () { "use strict"; if (window.__dqPortal) return; // evita cargarlo dos veces window.__dqPortal = true; /* ---------------- AJUSTES (puedes editarlos) ---------------- */ var CONFIG = { brandName: "DQ Insurance", whatsappNumber: "18632517298", // WhatsApp de DQ: (863) 251-7298 whatsappMessage: "Hola DQ, tengo una pregunta sobre los cursos", helpLabel: "¿Necesitas ayuda?", showHero: true, showHelpButton: true, showConfetti: true, heroEyebrow: "Academia DQ Insurance", heroText: "Aprende a tu ritmo, crece como agente y protege a más familias. Cada lección te acerca a tu próxima meta.", quotes: [ "Detrás de cada póliza hay una familia que duerme tranquila.", "Un agente preparado cambia historias. Hoy es un gran día para aprender.", "La constancia vence al talento cuando el talento no es constante.", "Cada cliente que proteges es una razón para seguir creciendo.", "Pequeños avances todos los días construyen grandes carreras.", ], // Textos de botones que cuentan como "lección completada" completeWords: [ "completar", "completado", "marcar como completad", "complete", "mark as complete", "mark complete", "finish", "terminar", ], }; /* ---------------- utilidades ---------------- */ function safe(fn) { try { fn(); } catch (e) { if (window.console) console.warn("[DQ portal]", e); } } function $(sel, root) { return (root || document).querySelector(sel); } function $$(sel, root) { return Array.prototype.slice.call((root || document).querySelectorAll(sel)); } function debounce(fn, ms) { var t; return function () { clearTimeout(t); t = setTimeout(fn, ms); }; } var reduceMotion = window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches; function path() { return (location.pathname + location.hash).toLowerCase(); } function isLibrary() { var p = path(); return ( /course|curso|library|biblioteca/.test(p) && !/lesson|post|categor|product\/|products\/[^/?#]/.test(p) ); } /* ---------------- 1. Banner de bienvenida ---------------- */ function greeting() { var h = new Date().getHours(); return h < 12 ? "¡Buenos días" : h < 19 ? "¡Buenas tardes" : "¡Buenas noches"; } function memberFirstName() { // Intenta leer el nombre del miembro desde el menú de usuario, si está visible. var cand = $$( '[class*="user-name"],[class*="userName"],[class*="profile-name"],[class*="profileName"],[class*="avatar"] + *' ); for (var i = 0; i < cand.length; i++) { var t = (cand[i].textContent || "").trim(); if (t && t.length < 40 && !/@/.test(t)) return t.split(/\s+/)[0]; } return ""; } var CARD_SEL = '[class*="course-card"],[class*="courseCard"],[class*="CourseCard"],[class*="product-card"],[class*="productCard"],[class*="ProductCard"]'; function outermost(list) { // Quita las partes internas (p. ej. "course-card__body") para contar cada tarjeta una sola vez return list .filter(function (el) { return !(el.parentElement && el.parentElement.closest(CARD_SEL)); }) .filter(function (el) { return !/__/.test( el.className && el.className.baseVal === undefined ? el.className : "" ); }); } function courseCount() { return outermost($$(CARD_SEL)).length; } function findMainContainer() { return ( $("main") || $('[role="main"]') || $('[class*="library"]') || $('[class*="content"]') || $("#app > div") || document.body ); } function buildHero() { var name = memberFirstName(); var el = document.createElement("section"); el.className = "dq-hero"; el.id = "dq-hero"; el.setAttribute("aria-label", "Bienvenida"); el.innerHTML = '

' + CONFIG.heroEyebrow + "

" + '

' + greeting() + (name ? ", " + escapeHtml(name) : "") + "! 👋

" + '

' + CONFIG.heroText + "

" + '

' + '📚 Tus cursos te esperan' + '🎯 Aprende a tu ritmo' + '🛡️ ' + CONFIG.brandName + "" + "

" + '

'; return el; } function escapeHtml(s) { return String(s).replace(/[&<>"]/g, function (c) { return { "&": "&", "<": "<", ">": ">", '"': """ }[c]; }); } var quoteTimer; function startQuotes() { var q = $("#dq-quote"); if (!q) return; var i = Math.floor(Math.random() * CONFIG.quotes.length); q.textContent = "“" + CONFIG.quotes[i] + "”"; clearInterval(quoteTimer); if (reduceMotion) return; quoteTimer = setInterval(function () { var el = $("#dq-quote"); if (!el) return clearInterval(quoteTimer); el.style.opacity = "0"; setTimeout(function () { i = (i + 1) % CONFIG.quotes.length; el.textContent = "“" + CONFIG.quotes[i] + "”"; el.style.opacity = "1"; }, 400); }, 7000); } function placeHero() { if (!CONFIG.showHero) return; var existing = $("#dq-hero"); if (!isLibrary()) { if (existing) existing.remove(); return; } if (!existing) { var cards = outermost($$(CARD_SEL)); var hero = buildHero(); if ( cards.length && cards[0].parentElement && cards[0].parentElement.parentElement ) { var grid = cards[0].parentElement; // la cuadrícula de cursos grid.parentElement.insertBefore(hero, grid); } else { var main = findMainContainer(); if (main === document.body) return; // sin un lugar seguro, no se agrega main.insertBefore(hero, main.firstChild); } startQuotes(); } // Solo escribe si cambió, para no provocar ciclos con el observador de cambios var n = courseCount(); var pill = $("#dq-count-pill"); if (!pill) return; var label = n ? "📚 " + n + " curso" + (n === 1 ? "" : "s") + " disponible" + (n === 1 ? "" : "s") + "" : "📚 Tus cursos te esperan"; if (pill.getAttribute("data-label") !== label) { pill.setAttribute("data-label", label); pill.innerHTML = label; } } /* ---------------- 2. Botón de ayuda (WhatsApp) ---------------- */ function placeHelp() { if (!CONFIG.showHelpButton || $("#dq-help")) return; var a = document.createElement("a"); a.id = "dq-help"; a.className = "dq-help"; a.href = "https://wa.me/" + CONFIG.whatsappNumber + "?text=" + encodeURIComponent(CONFIG.whatsappMessage); a.target = "_blank"; a.rel = "noopener"; a.setAttribute("aria-label", "Escríbenos por WhatsApp"); a.innerHTML = '' + CONFIG.helpLabel + "" + ''; document.body.appendChild(a); } /* ---------------- 3. Confeti al completar ---------------- */ function toast(msg) { var t = $("#dq-toast"); if (!t) { t = document.createElement("div"); t.id = "dq-toast"; t.className = "dq-toast"; t.setAttribute("role", "status"); document.body.appendChild(t); } t.textContent = msg; requestAnimationFrame(function () { t.classList.add("is-on"); }); clearTimeout(toast._t); toast._t = setTimeout(function () { t.classList.remove("is-on"); }, 3800); } function confetti() { if (reduceMotion) return; var cv = document.createElement("canvas"); cv.className = "dq-confetti"; var dpr = window.devicePixelRatio || 1; cv.width = innerWidth * dpr; cv.height = innerHeight * dpr; document.body.appendChild(cv); var ctx = cv.getContext("2d"); ctx.scale(dpr, dpr); var colors = [ "#3B7BC0", "#3FC4AC", "#5A8FD4", "#F5B300", "#F47CA6", "#FFFFFF", ]; var parts = []; for (var i = 0; i < 140; i++) { parts.push({ x: innerWidth / 2 + (Math.random() - 0.5) * 120, y: innerHeight * 0.35, vx: (Math.random() - 0.5) * 13, vy: Math.random() * -12 - 4, s: Math.random() * 7 + 5, r: Math.random() * 6.28, vr: (Math.random() - 0.5) * 0.3, c: colors[i % colors.length], round: Math.random() < 0.35, }); } var start = performance.now(); (function frame(now) { var el = now - start; ctx.clearRect(0, 0, innerWidth, innerHeight); parts.forEach(function (p) { p.vy += 0.32; p.vx *= 0.99; p.x += p.vx; p.y += p.vy; p.r += p.vr; ctx.save(); ctx.translate(p.x, p.y); ctx.rotate(p.r); ctx.fillStyle = p.c; ctx.globalAlpha = Math.max(0, 1 - el / 2600); if (p.round) { ctx.beginPath(); ctx.arc(0, 0, p.s / 2, 0, 6.28); ctx.fill(); } else ctx.fillRect(-p.s / 2, -p.s / 4, p.s, p.s / 2); ctx.restore(); }); if (el < 2600) requestAnimationFrame(frame); else cv.remove(); })(start); } var cheers = [ "¡Lección completada! Sigue así 🚀", "¡Excelente trabajo! Un paso más cerca de tu meta 🎯", "¡Muy bien! Tu esfuerzo se nota 💪", "¡Lo lograste! Vamos por la siguiente 🙌", ]; function onClick(e) { if (!CONFIG.showConfetti) return; var b = e.target.closest && e.target.closest('button,[role="button"],a,input[type="checkbox"]'); if (!b) return; var txt = ( (b.textContent || "") + " " + (b.getAttribute("aria-label") || "") + " " + (b.value || "") ).toLowerCase(); var hit = CONFIG.completeWords.some(function (w) { return txt.indexOf(w) !== -1; }); var isUndo = /incomplet|desmarcar|undo|deshacer/.test(txt); if (hit && !isUndo) { confetti(); toast(cheers[Math.floor(Math.random() * cheers.length)]); } } /* ---------------- 4. Aparición suave de tarjetas ---------------- */ var io = "IntersectionObserver" in window ? new IntersectionObserver( function (entries) { entries.forEach(function (en) { if (en.isIntersecting) { en.target.classList.add("is-in"); io.unobserve(en.target); } }); }, { rootMargin: "0px 0px -30px 0px" } ) : null; function revealCards() { if (!io || reduceMotion) return; outermost( $$(CARD_SEL + ',[class*="category-card"],[class*="lesson-card"]') ).forEach(function (el, i) { if (el.dataset.dqReveal) return; el.dataset.dqReveal = "1"; var r = el.getBoundingClientRect(); if (r.top < innerHeight) return; // lo visible al cargar no se oculta el.classList.add("dq-reveal"); el.style.transitionDelay = Math.min(i % 4, 3) * 70 + "ms"; io.observe(el); }); } /* ---------------- 5. Menú lateral (blanco; opción abierta con degradado) ---------------- */ var NAV_WORDS = /^(tablero|dashboard|inicio|home|comunidades|communities|cursos|courses|facturas|invoices|estimaciones|estimates|contratos|contracts|documentos|documents|archivos|files|citas|appointments|afiliados|affiliates?|fidelidad|loyalty|ajustes|settings|perfil|profile)/i; function findSidebar() { var best = null, bestScore = 0; $$( 'aside, nav, [class*="sidebar"], [class*="Sidebar"], [class*="side-nav"], [class*="sidenav"], [class*="menu"]' ).forEach(function (el) { var r = el.getBoundingClientRect(); if (r.width < 120 || r.width > 420 || r.left > 40 || r.height < 250) return; var hits = $$("a, button, [role='menuitem'], [role='link']", el).filter( function (a) { return NAV_WORDS.test((a.textContent || "").trim()); } ).length; if ( hits >= 3 && (hits > bestScore || (hits === bestScore && best && best.contains(el))) ) { best = el; bestScore = hits; } }); return best; } function navItems(sb) { // la opción "clicable" más externa de cada fila (evita marcar el ícono y el texto por separado) var items = $$("a, button, [role='menuitem'], [role='link']", sb).filter( function (a) { var txt = (a.textContent || "").trim(); return ( txt.length > 0 && txt.length < 60 && !( a.parentElement && a.parentElement.closest( "a, button, [role='menuitem'], [role='link']" ) && sb.contains( a.parentElement.closest( "a, button, [role='menuitem'], [role='link']" ) ) ) ); } ); return items; } function isActiveItem(a) { if ( a.matches( '[aria-current="page"], [aria-current="true"], [aria-selected="true"], .router-link-exact-active, .router-link-active, .active, .is-active, .selected, .is-selected' ) ) return true; var cls = typeof a.className === "string" ? a.className : ""; if (/(^|\s|-)(active|selected|current)(\s|$|-)/i.test(cls)) return true; return false; } function hrefScore(a) { var h = a.getAttribute("href"); if (!h || h.charAt(0) === "#") return -1; try { var u = new URL(h, location.href); if (u.host !== location.host) return -1; var p = u.pathname.replace(/\/$/, ""); return p && location.pathname.indexOf(p) === 0 ? p.length : -1; } catch (e) { return -1; } } function styleSidebar() { var sb = findSidebar(); if (!sb) return; if (!sb.classList.contains("dq-sidebar")) sb.classList.add("dq-sidebar"); var items = navItems(sb); var active = items.filter(isActiveItem); if (!active.length) { // si el portal no marca la opción, se deduce por la dirección var top = null, topScore = 0; items.forEach(function (a) { var s = hrefScore(a); if (s > topScore) { topScore = s; top = a; } }); if (top) active = [top]; } if (active.length > 1) active = [active[active.length - 1]]; items.forEach(function (a) { var isBrand = !NAV_WORDS.test((a.textContent || "").trim()) && a.querySelector("img"); a.classList.toggle("dq-nav-brand", !!isBrand); if (!isBrand && !a.classList.contains("dq-nav-item")) a.classList.add("dq-nav-item"); if (!isBrand) a.classList.toggle("dq-nav-active", active.indexOf(a) !== -1); }); } document.addEventListener( "click", function (e) { var it = e.target.closest && e.target.closest(".dq-sidebar .dq-nav-item"); if (!it) return; $$(".dq-sidebar .dq-nav-active").forEach(function (a) { a.classList.remove("dq-nav-active"); }); it.classList.add("dq-nav-active"); // respuesta inmediata al tocar setTimeout(function () { safe(styleSidebar); }, 400); }, true ); /* ---------------- arranque y navegación ---------------- */ function run() { safe(styleSidebar); safe(placeHero); safe(placeHelp); safe(revealCards); } var rerun = debounce(run, 250); function boot() { run(); document.addEventListener( "click", function (e) { safe(function () { onClick(e); }); }, true ); // El portal es una app de una sola página: vigilamos cambios de ruta y de contenido. var lastPath = path(); new MutationObserver(function () { if (path() !== lastPath) { lastPath = path(); var h = $("#dq-hero"); if (h && !isLibrary()) h.remove(); } rerun(); }).observe(document.body, { childList: true, subtree: true }); window.addEventListener("popstate", rerun); } if (document.readyState === "loading") document.addEventListener("DOMContentLoaded", boot); else boot(); })();