evolving konami sequence

Question

evolving konami sequence

I am working on creating a .js file for a website that will trigger the embedding of a video when the konami code is entered: Up, Up, Down, Down, Left, Right, Left, Right, B, A, Start (enter). While entering the correct keys, the webpage should display a message like "keep going". If a wrong key is entered, it should display "wrong, try again" and allow the user to start over.

So far, I have managed to make the JavaScript work such that it displays an alert when the correct code is entered and a different alert for incorrect codes. However, I'm struggling with implementing the part where it prompts the user to try again upon entering the wrong code.


if (window.addEventListener) {
var keys = [],
konami = "38,38,40,40,37,39,37,39,66,65,13";

window.addEventListener("keydown", function(e){
keys.push(e.keyCode);

if (keys.toString().indexOf(konami) >= 0) {            
alert('Right');
keys = [];
};

if (keys.toString().indexOf(konami) < 0) {
alert('Wrong');
keys = [];
}
}, true);

Any assistance would be highly appreciated.

javascript

Answer 1

Answer №1

if (document.addEventListener) {
    var count = 0;
    var code = [38,38,40,40,37,39,37,39,66,65,13];

    document.addEventListener("keydown", function(e){
        if (e.keyCode === code[count])
        {
            count++; //valid key at the valid point

            if (count == code.length)
            {
                alert("Access Granted");
            } else {
                alert("Keep going");
            }
        } else {
            // incorrect input, restart
            count = 0;
            alert("Wrong Code"); 
        }
   });
}

Answer 2

if (document.addEventListener) {
    var count = 0;
    var code = [38,38,40,40,37,39,37,39,66,65,13];

    document.addEventListener("keydown", function(e){
        if (e.keyCode === code[count])
        {
            count++; //valid key at the valid point

            if (count == code.length)
            {
                alert("Access Granted");
            } else {
                alert("Keep going");
            }
        } else {
            // incorrect input, restart
            count = 0;
            alert("Wrong Code"); 
        }
   });
}

Answer 3

Answer №2

If you're looking for a fun interactive element to add to your website, consider implementing a Konami code easter egg. This JavaScript code snippet allows users to input the famous Konami cheat code by pressing specific keys on their keyboard.

 if (window.addEventListener) {
    var keys = [],
    konami = "38,38,40,40,37,39,37,39,66,65,13".split(',');

    window.addEventListener("keydown", function(e){
    keys.push(e.keyCode);
        console.log(e.keyCode);
    var lengthOfKeys = keys.length -1;

    if (konami[lengthOfKeys] == keys[lengthOfKeys])
    {            
       alert('Right');
        if(konami.length === keys.length){
            alert('complete!');
        }

    }else{
       alert('Wrong');
        keys = [];
    }
}, true);
};

Check out this live demonstration on JSFiddle.

Answer 4

If you're looking for a fun interactive element to add to your website, consider implementing a Konami code easter egg. This JavaScript code snippet allows users to input the famous Konami cheat code by pressing specific keys on their keyboard.

 if (window.addEventListener) {
    var keys = [],
    konami = "38,38,40,40,37,39,37,39,66,65,13".split(',');

    window.addEventListener("keydown", function(e){
    keys.push(e.keyCode);
        console.log(e.keyCode);
    var lengthOfKeys = keys.length -1;

    if (konami[lengthOfKeys] == keys[lengthOfKeys])
    {            
       alert('Right');
        if(konami.length === keys.length){
            alert('complete!');
        }

    }else{
       alert('Wrong');
        keys = [];
    }
}, true);
};

Check out this live demonstration on JSFiddle.

Answer 5

Answer №3

Here is a simple solution that works for me:

const konamiCode = "38,38,40,40,37,39,37,39,66,65,13";
let keysEntered = [];
const konamiArr = konamiCode.split(',');

window.addEventListener("keydown", function(e){
    keysEntered.push(e.keyCode);

    const position = keysEntered.length - 1;

    if(keysEntered[position] !== konamiArr[position])
    {
        alert('Incorrect');
        keysEntered = [];
    }
    else if (keysEntered.join(',') === konamiCode) 
    {            
       alert('Correct! Konami code entered successfully.');
        keysEntered = [];
    };
}, true);

View the jsFiddle example here

Answer 6

Here is a simple solution that works for me:

const konamiCode = "38,38,40,40,37,39,37,39,66,65,13";
let keysEntered = [];
const konamiArr = konamiCode.split(',');

window.addEventListener("keydown", function(e){
    keysEntered.push(e.keyCode);

    const position = keysEntered.length - 1;

    if(keysEntered[position] !== konamiArr[position])
    {
        alert('Incorrect');
        keysEntered = [];
    }
    else if (keysEntered.join(',') === konamiCode) 
    {            
       alert('Correct! Konami code entered successfully.');
        keysEntered = [];
    };
}, true);

View the jsFiddle example here

Answer 7

Answer №4

Receiving an alert with each keystroke can be disruptive. A better approach would be to have a DIV display validated correct answers and only trigger an alert for incorrect ones.

function checker(){

     if (kc==11){

        kc=0;  // Reset the sequence. 

        // Add your desired function here. 
      }
     }

     function keyUp(e) {
 var keynum;
        if (window.event){keynum = event.keyCode;}
 else if (e.which){keynum = e.which;}
     for (i=0;i<222;i++){

// The 222 represents all keys on the keyboard.

     var kx=konamicode[kc]; // Represents current position in the code sequence.

     var res=document.getElementById('response');
     var dumb=wrong[kc];

      if (keynum==i){

 // Check if key matches sequence, reset sequence if it doesn't.

      if (i!=kx){
                 res.innerHTML='';
                 alert(dumb); // Alert user of mistake and reset sequence.
                 kc=0;
                 } 
             else {
             res.innerHTML=right[kc];   // Congratulate user and advance sequence.
             kc++;
             }

       }
     }
   checker();
       }

document.onkeyup = keyUp;

To show validated keystrokes, add a DIV in the body of the page.

<div id="response"></div>

Answer 8

Receiving an alert with each keystroke can be disruptive. A better approach would be to have a DIV display validated correct answers and only trigger an alert for incorrect ones.

function checker(){

     if (kc==11){

        kc=0;  // Reset the sequence. 

        // Add your desired function here. 
      }
     }

     function keyUp(e) {
 var keynum;
        if (window.event){keynum = event.keyCode;}
 else if (e.which){keynum = e.which;}
     for (i=0;i<222;i++){

// The 222 represents all keys on the keyboard.

     var kx=konamicode[kc]; // Represents current position in the code sequence.

     var res=document.getElementById('response');
     var dumb=wrong[kc];

      if (keynum==i){

 // Check if key matches sequence, reset sequence if it doesn't.

      if (i!=kx){
                 res.innerHTML='';
                 alert(dumb); // Alert user of mistake and reset sequence.
                 kc=0;
                 } 
             else {
             res.innerHTML=right[kc];   // Congratulate user and advance sequence.
             kc++;
             }

       }
     }
   checker();
       }

document.onkeyup = keyUp;

To show validated keystrokes, add a DIV in the body of the page.

<div id="response"></div>

evolving konami sequence

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

Is there a way to assign innerHTML values to table cells using PHP?

Guide to automating tests on MAC using Protractor with Appium and IOS-Simulator

Content within Drawer featuring Material UI Scrollable Tabs

Sorting an array using the Insertion sort algorithm in JavaScript / An undefined function

Ways to update state based on changes in localStorage values

capturing the HTML title and storing it in a JavaScript variable

What is the best way to determine the quantity of request query parameters in an express.js application?

Is the MUI Drawer Open 20% of the Time?

JavaScript, specifically in the VueJS framework, consistently defaults to utilizing the final value within a

Transfer picture information to the server on Internet Explorer versions 8 and 9

Modify website styling using JavaScript to edit external CSS/SCSS files

Choose specific GeoJSON elements using a mouse click - OpenLayers 3

Arranging radio input options in alphabetical order

Comparing mustache.js and dust.js: How can I select my list of schools?

What is the best way to ensure a multi-page form is validated using HTML5 and JavaScript before progressing to the next page?

Similar to the filter() method in Vanilla Javascript but behaves in a equivalent way to

How to Use Conditional In-Line CSS for Internet Explorer and Other Browsers

Precommit hook failing to activate despite errors occurring

Exploring ways to retrieve texture dimensions using Three.js

React does not support the map function