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 6402 times so far.
Like this? Tweet it to your followers!

Latest articles from Jelle De Loecker

Latest 'tweets' from Jelle De Loecker

  • @NicoBouton Ik ben ook al jalozrs. Link Saturday, 04 February 2012 10:42
  • De garagepoort is dichtgevroren! #fb Link Saturday, 04 February 2012 06:52
  • Wanneer gaat Facebook hun "Music Bridge" API nu eindelijk eens toegankelijk maken? Link Saturday, 04 February 2012 05:16
blog comments powered by Disqus

Watch our shortmovie "Zin"

Scroll To Top