Probablemente hayas oído hablar del Código Konami. Es un código de trampa en muchos juegos de Konami, donde el truco se ejecuta con una secuencia de pulsaciones de teclas en el teclado. Desde entonces, se ha convertido en uno de los elementos básicos de la tradición well-liked de los videojuegos, y muchos sitios net, juegos y aplicaciones tienen sus propios huevos de pascua activados con el código de Konami.
La secuencia de claves es:
arriba, arriba, abajo, abajo, izquierda, derecha, izquierda, derecha, B, A
¡No dudes en probarlo en este sitio!
En esta publicación de #GTMtips, te mostraré cómo implementar el Código Konami en tu sitio net con una única y muy easy etiqueta HTML personalizada.
Antes de continuar, felicitaciones por la thought al increíble Gerry Blancoquien amablemente me permitió robarle su brillante thought.
incógnita
El boletín a fuego lento
Suscríbete al Boletín a fuego lento para recibir las últimas noticias y contenido de Simo Ahava en su bandeja de entrada de correo electrónico.
Consejo 12: Añade el Código Konami a tu sitio net
La implementación es sencilla. Todo lo que necesita es una etiqueta HTML personalizada que se lively en todas las páginas. El código en la etiqueta se ve así:
<script>
var els, i, len, title;
var konamiCode = '38,38,40,40,37,39,37,39,66,65';
var keyPresses = ();
var checkKonami = operate(e) {
keyPresses.push(e.keyCode);
if (keyPresses.slice(keyPresses.length-10).be a part of() === konamiCode) {
runKonami();
}
};
var runKonami = operate() {
els = doc.getElementsByTagName('h2');
for (i = 0, len = els.size; i < len; i++)
};
doc.addEventListener('keyup', checkKonami);
script>Esto es lo que sucede en el guión:
var els, i, len, title;
var konamiCode = '38,38,40,40,37,39,37,39,66,65';
var keyPresses = ();
Las tres líneas anteriores son declaraciones de variables para el script. La primera línea outline un montón de variables de utilidad que necesitaremos más adelante. El konamiCode La variable es una Cadena con la secuencia de teclas necesarias para ejecutar el huevo de Pascua. Los códigos de clave y sus respectivas claves son: 38 – flecha hacia arriba, 40 – flecha hacia abajo, 37 – flecha izquierda, 39 – flecha derecha, 66 – tecla B, 65 – tecla A.
La tercera línea declara la keyPresses Matriz, cuyo trabajo es mantener un registro de todas las teclas presionadas en la página.
var checkKonami = operate(e) {
keyPresses.push(e.keyCode);
if (keyPresses.slice(keyPresses.length-10).be a part of() === konamiCode) {
runKonami();
}
};
El checkKonami La función es la devolución de llamada para el evento ‘keyup’ (ver más abajo). En esencia, se llama cada vez que se registra una pulsación de tecla en la página. Toma el objeto del evento como parámetro (e).
La primera línea, keyPresses.push(e.keyCode);empuja el código de tecla para la pulsación de tecla registrada en el keyPresses Formación. Las siguientes tres líneas son un bloque if, donde el últimos 10 códigos clave son evaluados. Estos se unen en un objeto String separado por comas y luego se comparan con la secuencia de códigos clave en el konamiCode Cadena. Si estos dos coinciden, es decir, si las últimas diez teclas presionadas tienen los mismos códigos en la misma secuencia que el konamiCode Cadena, la función runKonami se llama.
var runKonami = operate() {
els = doc.getElementsByTagName('h2');
for (i = 0, len = els.size; i < len; i++)
};
En el runKonami función, puede ejecutar cualquier código que desee cuando el código Konami esté registrado correctamente en el sitio net. En mi ejemplo, tomo el contenido de texto de cada elemento H2 de la página e invierto el orden de los caracteres.
doc.addEventListener('keyup', checkKonami);
La última línea de JavaScript agrega el detector de eventos para el evento ‘keyup’ y denota checkKonami como la devolución de llamada que se invocará cada vez que se registre dicho evento.
Con suerte, este fue un ejemplo divertido de cómo agregar un detector de eventos personalizado en el sitio y cómo manipular el DOM en una etiqueta HTML personalizada.