How to recreate the Konami code in Javascript

Facebook has featured in social media blogs recently for adding a Konami code Easter egg in their home page. In this blog post I show you how to add similar “functionality” to your site using Javascript.

First, the full code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// check to make sure that the browser can handle window.addEventListener
if (window.addEventListener) {
    // create the keys and konami variables
    var keys = [],
        konami = "38,38,40,40,37,39,37,39,66,65";
 
    // bind the keydown event to the Konami function
    window.addEventListener("keydown", function(e){
        // push the keycode to the 'keys' array
        keys.push(e.keyCode);
 
        // and check to see if the user has entered the Konami code
        if (keys.toString().indexOf(konami) >= 0) {
            // do something such as:
            // alert('Konami');
 
            // and finally clean up the keys array
            keys = [];
        };
    }, true);
};

The script adds a callback function to the keydown event which stores the keycode in the keys array. It then checks the array against the pre-defined konami array (which contains a keycoded version of the Konami code).

Found the Konami code (or any other easter eggs) on the web? Let me know in the comments.

Related Posts

Comments

  • Raz
    How come you haven't the konami code implemented on this page??
    FAIL!
  • ReederDa
    Hey, once you get the konami code implemented, what do you have to do in order to make the code do something, like go to a hidden page?
  • To redirect to another page you'll need to use the window.location attribute e.g.

    if (keys.toString().indexOf(konami) >= 0) {
    window.location = "http://your-hidden-page.com";
    keys = [];
    };
  • ReederDa
    Thank you!
    Where do you put this extra bit of code?
  • Just replace '// alert('konami')' with 'window.location = 'http://your-hidden-page.com'. Probably should have said this the first time :)
  • ReederDa
    Sorry, I probably seem like i don't know anything, but i can't seem to get the code to work. I'm using dreamweaver to preview the site, and i have the javascript in a separate file. When I preview the webpage and try the code, nothing happens. Is there something I'm missing?
  • Dod
    how to implement this inside PHP?
  • This effect isn't possible with PHP. It requires client-side code to tell which keys the user has pressed which is something that PHP, a server-side language, is simply unable to do.
  • A very handy hint!
    I've seen a lot of sites implement this recently.

    http://konamicodesites.com/
  • x0fx3
    Is it possible to make up a different code to use? How could do that if you know?
  • If you want to use a different code just replace the keycodes in the 'konami' variable.
  • Thank you so much for this. I was looking for the js/jQuery implementation of the Konami Code but almost all of the google results I opened said "link to google's repository, etc.."

    Which doesn't really teach me anything. =/

    As for the sites that use the konami code, konamicodesites.com lists them. But you'll have to enter the konami code to see the list. =) [the jquery site uses the konami code]
blog comments powered by Disqus