nav-diag"]:not(#nav-diag-sitio31) { display: none !important; }'; /* sus cuadritos de diagnóstico */ document.head.appendChild(ocultar); } catch (error) {} } /* el primer script (el del look aqua) metía sus propios estilos: se quitan */ function quitarAqua(nodo) { if (nodo.tagName === 'STYLE' && !nodo.attributes.length && nodo.textContent.indexOf('.nav-botones') === 0 && nodo.textContent.indexOf('@media (hover: hover) { .nav-botones') !== -1) nodo.remove(); } Array.prototype.forEach.call(document.querySelectorAll('head > style'), quitarAqua); new MutationObserver(function (cambios) { cambios.forEach(function (c) { Array.prototype.forEach.call(c.addedNodes, quitarAqua); }); }).observe(document.head, { childList: true }); /* ===== 7. Diagnóstico ===== */ /* escribe la palabra sonido con el teclado estando en la página: aparece un cuadrito con el estado del sonido y las medidas del menú; escríbela otra vez y se oculta. En el celular: abre la página con ?navdiag al final de la dirección */ var diagnostico = false, tecleado = '', reloj = null; escuchar(window, 'keydown', function (e) { if (!e.key || e.key.length !== 1) return; tecleado = (tecleado + e.key.toLowerCase()).slice(-6); if (tecleado !== 'sonido') return; tecleado = ''; diagnostico = !diagnostico; if (!reloj) reloj = setInterval(mostrar, 400); mostrar(); }, true); if (location.search.indexOf('navdiag') !== -1) { diagnostico = true; reloj = setInterval(mostrar, 400); } function mostrar() { var caja = document.getElementById('nav-diag-sitio31'); if (!diagnostico) { if (caja) caja.remove(); return; } if (!document.body) return; if (!caja) { caja = document.createElement('div'); caja.id = 'nav-diag-sitio31'; caja.style.cssText = 'position:fixed;right:10px;bottom:10px;z-index:2147483647;max-width:320px;padding:8px 10px;border-radius:8px;background:#fff;color:#111;border:1px solid #999;font:11px/1.45 Menlo,monospace;pointer-events:none'; document.body.appendChild(caja); } var cuenta = function (o) { return TODOS.filter(function (u) { return o[u]; }).length; }; var primerFallo = TODOS.filter(function (u) { return fallo[u]; }).map(function (u) { return nombreDe(u) + ': ' + fallo[u]; })[0] || '-'; var lineas = [ 'sitio v31', 'copia vieja: ' + (habiaViejo ? 'si (neutralizada)' : 'no'), 'audio: ' + (ctx ? ctx.state : 'esperando click') + (permitido ? ' (sin click)' : '') + (TACTIL ? ', celular' : ''), 'sesion: ' + ((navigator.audioSession && navigator.audioSession.type) || '-') + ', reproductores: ' + Object.keys(respaldo).length, 'descargados ' + cuenta(bajado) + '/' + TODOS.length + ', listos ' + cuenta(buffers) + '/' + TODOS.length, 'respaldo ' + cuenta(liberado) + '/' + TODOS.length + ', rotos ' + cuenta(roto) + '/' + TODOS.length, 'clicks ' + diag.clicks + ', hovers ' + diag.hovers, 'ultimo: ' + diag.ultimo, 'fallo: ' + primerFallo, 'error: ' + diag.error ]; var entrada = document.querySelector('.entrada'); if (entrada) { var ve = entrada.querySelector('video'); lineas.push('entrada: ' + (entrada.classList.contains('entrada-editor') ? 'editor' : 'sitio') + ', video ' + (ve ? 'listo ' + ve.readyState + (ve.error ? ', error ' + ve.error.code : '') : 'no hay')); } var nav = document.querySelector('.nav-movil'); if (nav) { var redondo = function (n) { return Math.round(n * 10) / 10; }; var barra = nav.querySelector('.nav-movil-barra'); var drop = nav.querySelector('.nav-movil-drop'); var vidrio = nav.querySelector('.nav-movil-drop .nav-movil-vidrio'); lineas.push('rem ' + getComputedStyle(document.documentElement).fontSize + ', pantalla ' + window.innerWidth + ' x ' + window.innerHeight); if (barra) lineas.push('barra: arriba ' + redondo(barra.getBoundingClientRect().top) + ', alto ' + redondo(barra.getBoundingClientRect().height)); if (drop) lineas.push('dropdown: arriba ' + redondo(drop.getBoundingClientRect().top) + ', ancho ' + redondo(drop.getBoundingClientRect().width)); if (vidrio) lineas.push('vidrio: padding ' + getComputedStyle(vidrio).paddingTop + ' / ' + getComputedStyle(vidrio).paddingLeft); lineas.push('abierto: ' + (abiertoDe(nav) || '-')); } caja.textContent = ''; lineas.forEach(function (t) { var d = document.createElement('div'); d.textContent = t; caja.appendChild(d); }); } /* ===== 8. Entrada: el video de click to enter ===== */ /* La página de entrada muestra el video quieto en su primer cuadro. Con un click, un toque, Enter o espacio, el video se reproduce y al terminar lleva a la página de bienvenida sin recargar: así ese mismo click deja encendidos los sonidos del resto del sitio. Si el navegador no puede reproducir el video, entra de una. */ var ENTRADA = '.entrada'; /* en el editor de Cargo la página se puede escribir: ahí la entrada no tapa la pantalla ni lleva a otra página */ function enEditor() { return !!document.querySelector('[contenteditable="true"], [contenteditable=""]'); } /* el video listo para mostrarse quieto: sin sonido y dentro de la página (en el iPhone, sin pantalla completa) */ /* el video lo arma este script a partir de data-video: así el editor de Cargo no lo toca. Si la página ya trae su propio video, se usa ese */ function armarVideo(caja) { var v = caja.querySelector('video'); var src = caja.getAttribute('data-video'); if (v || !src) return v; v = document.createElement('video'); v.className = 'entrada-video'; v.muted = true; v.defaultMuted = true; v.setAttribute('muted', ''); v.playsInline = true; v.setAttribute('playsinline', ''); v.setAttribute('webkit-playsinline', ''); v.setAttribute('disablepictureinpicture', ''); v.setAttribute('disableremoteplayback', ''); v.preload = 'auto'; v.src = src.indexOf('#') === -1 ? src + '#t=0.001' : src; /* así Safari muestra el primer cuadro */ caja.insertBefore(v, caja.firstChild); return v; } function prepararEntrada() { var editor = enEditor(); Array.prototype.forEach.call(document.querySelectorAll(ENTRADA), function (caja) { if (caja.classList.contains('entrada-editor') !== editor) caja.classList.toggle('entrada-editor', editor); armarVideo(caja); }); Array.prototype.forEach.call(document.querySelectorAll('.entrada video'), function (v) { if (v.__navEntrada) return; v.__navEntrada = true; v.muted = true; v.defaultMuted = true; v.playsInline = true; v.setAttribute('playsinline', ''); v.setAttribute('webkit-playsinline', ''); v.removeAttribute('autoplay'); v.removeAttribute('controls'); v.loop = false; v.addEventListener('error', function () { v.__navFallo = true; }, true); /* el archivo no se pudo cargar */ }); } /* a dónde lleva: la bienvenida de computadora o la de celular (un celular: pantalla táctil y pequeña) */ function destinoDe(caja) { var celular = TACTIL && Math.min(screen.width, screen.height) < 768; return (celular && caja.getAttribute('data-destino-celular')) || caja.getAttribute('data-destino') || 'welcome-laptop-users'; } /* va a la página de bienvenida sin recargar, con un link normal de Cargo (Cargo no deja que un script cambie de página por su cuenta). Si Cargo no tomara ese click, el mismo link funciona como un link de siempre; y si algo lo frenara, toda la pantalla queda como ese link: el siguiente click entra */ function irA(caja, destino) { var link = caja.querySelector('.entrada-salida'); if (!link) { link = document.createElement('a'); link.className = 'entrada-salida'; link.setAttribute('rel', 'history'); link.setAttribute('tabindex', '-1'); link.setAttribute('aria-hidden', 'true'); link.style.display = 'none'; caja.appendChild(link); } link.setAttribute('href', destino); var antes = location.pathname; var clic = new MouseEvent('click', { bubbles: true, cancelable: true, view: window }); clic.__navSonado = true; /* sin el sonido de los links */ link.dispatchEvent(clic); setTimeout(function () { if (location.pathname !== antes || !document.contains(caja)) return; link.style.cssText = 'display:block;position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;cursor:pointer'; link.removeAttribute('aria-hidden'); link.setAttribute('aria-label', caja.getAttribute('aria-label') || 'Enter'); }, 1500); } function empezarEntrada(caja) { if (caja.__navEmpezo) return; caja.__navEmpezo = true; caja.classList.add('entrada-andando'); prepararEntrada(); var v = caja.querySelector('video'); var destino = destinoDe(caja); var listo = false; var seguir = function () { if (listo) return; listo = true; if (enEditor()) { /* en el editor: vuelve al primer cuadro, para poder verlo otra vez */ try { v.pause(); v.currentTime = 0; } catch (error) {} caja.__navEmpezo = false; caja.classList.remove('entrada-andando'); return; } irA(caja, destino); }; if (!v || v.error || v.__navFallo || v.networkState === 3) { seguir(); return; } /* sin video que se pueda ver: entra de una */ var arranco = false; v.addEventListener('playing', function () { arranco = true; }); v.addEventListener('ended', seguir, { once: true }); v.addEventListener('error', seguir, { capture: true, once: true }); /* también si falla el archivo */ try { var p = v.play(); if (p && p.catch) p.catch(seguir); } catch (error) { seguir(); } /* si en 5 segundos no arrancó, entra igual */ setTimeout(function () { if (!arranco && v.paused) seguir(); }, 5000); /* por si el video se queda trabado: nunca más que lo que dura, y unos segundos de margen */ var dura = isFinite(v.duration) && v.duration > 0 ? v.duration : 12; setTimeout(seguir, (dura + 6) * 1000); } escuchar(document, 'click', function (e) { var el = e.target instanceof Element ? e.target : null; var caja = el ? el.closest(ENTRADA) : null; if (!caja || enEditor()) return; /* en el editor, el click es para editar */ if (el.closest('.entrada-salida')) return; /* el link de salida sigue derecho hasta Cargo */ e.preventDefault(); empezarEntrada(caja); }, true); escuchar(window, 'keydown', function (e) { if (e.key !== 'Enter' && e.key !== ' ' && e.key !== 'Spacebar') return; var caja = document.querySelector(ENTRADA); if (!caja || enEditor()) return; e.preventDefault(); empezarEntrada(caja); }, true); prepararEntrada(); })();

This website is updated weekly, thanks for stopping by