adding labels

master
zach-m 2023-04-10 18:09:59 -06:00
parent 9418cecdf5
commit c2b8ab67f2
2 changed files with 73 additions and 11 deletions

View File

@ -0,0 +1,45 @@
// a key map of allowed keys
var allowedKeys = {
37: 'left',
38: 'up',
39: 'right',
40: 'down',
65: 'a',
66: 'b'
};
// the 'official' Konami Code sequence
var konamiCode = ['up', 'up', 'down', 'down', 'left', 'right', 'left', 'right', 'b', 'a'];
// a variable to remember the 'position' the user has reached so far.
var konamiCodePosition = 0;
// add keydown event listener
document.addEventListener('keydown', function(e) {
// get the value of the key code from the key map
var key = allowedKeys[e.keyCode];
// get the value of the required key from the konami code
var requiredKey = konamiCode[konamiCodePosition];
// compare the key with the required key
if (key == requiredKey) {
// move to the next key in the konami code sequence
konamiCodePosition++;
// if the last key is reached, activate cheats
if (konamiCodePosition == konamiCode.length) {
showSecrets();
konamiCodePosition = 0;
}
} else {
konamiCodePosition = 0;
}
});
function showSecrets() {
console.log("Hi")
var element = document.getElementById("konami")
console.log(element)
element.style = "display:block"
}

View File

@ -2,6 +2,7 @@
<html>
<header>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/dark.css">
<script src="konami.js"></script>
<script>
function formsay(message) {
console.log(`say '${message}'`)
@ -33,6 +34,8 @@
document.getElementById("ntfy").innerHTML = `<pre>${b}</pre>`
}, null)
}, 1500)
</script>
</header>
<body>
@ -74,21 +77,32 @@
<form id="controls">
<div style="display: flex; flex-wrap: wrap;">
<div>
<input type="text" maxLength=1 value="w" name="w" placeholder="up" onchange="recontrol()">
<input type="text" maxLength=1 value="s" name="s" placeholder="down" onchange="recontrol()">
<input type="text" maxLength=1 value="a" name="a" placeholder="left" onchange="recontrol()">
<input type="text" maxLength=1 value="d" name="d" placeholder="right" onchange="recontrol()">
<label for="input-up">Up</label>
<input id="input-up" type="text" maxLength=1 value="w" name="w" placeholder="up" onchange="recontrol()">
<label for="input-down">Down</label>
<input id="input-down" type="text" maxLength=1 value="s" name="s" placeholder="down" onchange="recontrol()">
<label for="input-left">Left</label>
<input id="input-left" type="text" maxLength=1 value="a" name="a" placeholder="left" onchange="recontrol()">
<label for="input-right">Right</label>
<input id="input-right" type="text" maxLength=1 value="d" name="d" placeholder="right" onchange="recontrol()">
</div>
<div>
<input type="text" maxLength=1 value="5" name="5" placeholder="start" onchange="recontrol()">
<input type="text" maxLength=1 value="q" name="q" placeholder="l" onchange="recontrol()">
<input type="text" maxLength=1 value="e" name="e" placeholder="r" onchange="recontrol()">
<label for="input-start">Start</label>
<input id="input-start" type="text" maxLength=1 value="5" name="5" placeholder="start" onchange="recontrol()">
<label for="input-left-bumper">Left Bumper</label>
<input id="input-left-bumper" type="text" maxLength=1 value="q" name="q" placeholder="l" onchange="recontrol()">
<label for="input-right-bumper">Right Bumper</label>
<input id="input-right-bumper" type="text" maxLength=1 value="e" name="e" placeholder="r" onchange="recontrol()">
</div>
<div>
<input type="text" maxLength=1 value="1" name="1" placeholder="a" onchange="recontrol()">
<input type="text" maxLength=1 value="2" name="2" placeholder="b" onchange="recontrol()">
<input type="text" maxLength=1 value="3" name="3" placeholder="x" onchange="recontrol()">
<input type="text" maxLength=1 value="4" name="4" placeholder="y" onchange="recontrol()">
<label for="input-a">A</label>
<input id="input-a" type="text" maxLength=1 value="1" name="1" placeholder="a" onchange="recontrol()">
<label for="input-b">B</label>
<input id="input-b" type="text" maxLength=1 value="2" name="2" placeholder="b" onchange="recontrol()">
<label for="input-x">X</label>
<input id="input-x" type="text" maxLength=1 value="3" name="3" placeholder="x" onchange="recontrol()">
<label for="input-y">Y</label>
<input id="input-y" type="text" maxLength=1 value="4" name="4" placeholder="y" onchange="recontrol()">
</div>
</div>
</form>
@ -96,6 +110,9 @@
</div>
<div id="ntfy"></div>
<div id="ws"></div>
<div id="konami" style="display:none">
<iframe width="560" height="315" src="https://www.youtube.com/embed/V4oJ62xrFZo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
</div>
</body>
<footer>
<script>