Blogs Jelle's blog Lazy keycode array for Javascript
There are no translations available.

I've only recently gotten into Javascript, thanks to the <canvas> element. I'm currently building a 2D tile-based render engine for a game. (What better way to learn something new than to build a game, right?)

Ofcourse, this game also has to respond to the keyboard. I got tired of looking up keycodes real quick and decided to just create an associative array out of them, for the hell of it. My IDE even autocompletes them. Here's the list:

// A var storing all useful keys for easy access
var key = {
    'Backspace': 8,
    'Tab': 9,
    'Enter': 13,
    'Shift': 16,
    'Ctrl': 17,
    'Alt': 18,
    'Pause': 19,
    'Capslock': 20,
    'Esc': 27,
    'Pageup': 33,
    'Pagedown': 34,
    'End': 35,
    'Home': 36,
    'Leftarrow': 37,
    'Uparrow': 38,
    'Rightarrow': 39,
    'Downarrow': 40,
    'Insert': 45,
    'Delete': 46,
    '0': 48,
    '1': 49,
    '2': 50,
    '3': 51,
    '4': 52,
    '5': 53,
    '6': 54,
    '7': 55,
    '8': 56,
    '9': 57,
    'a': 65,
    'b': 66,
    'c': 67,
    'd': 68,
    'e': 69,
    'f': 70,
    'g': 71,
    'h': 72,
    'i': 73,
    'j': 74,
    'k': 75,
    'l': 76,
    'm': 77,
    'n': 78,
    'o': 79,
    'p': 80,
    'q': 81,
    'r': 82,
    's': 83,
    't': 84,
    'u': 85,
    'v': 86,
    'w': 87,
    'x': 88,
    'y': 89,
    'z': 90,
    '0numpad': 96,
    '1numpad': 97,
    '2numpad': 98,
    '3numpad': 99,
    '4numpad': 100,
    '5numpad': 101,
    '6numpad': 102,
    '7numpad': 103,
    '8numpad': 104,
    '9numpad': 105,
    'Multiply': 106,
    'Plus': 107,
    'Minut': 109,
    'Dot': 110,
    'Slash1': 111,
    'F1': 112,
    'F2': 113,
    'F3': 114,
    'F4': 115,
    'F5': 116,
    'F6': 117,
    'F7': 118,
    'F8': 119,
    'F9': 120,
    'F10': 121,
    'F11': 122,
    'F12': 123,
    'equal': 187,
    'Coma': 188,
    'Slash': 191,
    'Backslash': 220
}

Now you can use things like "key.Uparrow" in your code in stead of it's corresponding number. For example:


// Bind the onKeyDown function to the onkeydown event.
window.onkeydown = onKeyDown;

/**
 *This function is called whenever a key is pressed on the keyboard
 *@param    key     {int}   The key
 */
function onKeyDown(keypress) {
    
    // Select the correct key and execute its functions
    switch (keypress.keyCode) {

        case key.Uparrow:
            // Do  something
            break;

        case key.Rightarrow:
            // Do  something
            break;

        case key.Downarrow:
            // Do  something
            break;
        
        case key.Leftarrow:
            // Do something
            break;
    }
}

Jelle De Loecker
Written on Thursday, 15 July 2010 17:03 by Jelle De Loecker

Viewed 6865 times so far.
Like this? Tweet it to your followers!

Latest articles from Jelle De Loecker

Latest 'tweets' from Jelle De Loecker

  • Vandaag heeft mijn vakantiebudget zich ook getransformeerd naar een kledingsbudget. 3 jeans, 1 paar flashy schoenen en een t-shirt. #fb Link Saturday, 19 May 2012 13:58
  • Net TWEE UUR de auto staan wassen. This is what you get for buying a white car! #fb Link Saturday, 19 May 2012 13:52
  • I unlocked the Marvel’s The Avengers Box Office sticker on @GetGlue! http://t.co/t4A8ryM3 Link Thursday, 17 May 2012 14:39
blog comments powered by Disqus

Watch our shortmovie "Zin"

Scroll To Top