Tuesday, February 21, 2023

Diary #2 Convert JavaScript Event.key to Virtual Key Codes

Next for my webapp to remotely control a desktop, I need to send messages to the server with the information: which key & pressed or released?

I thought and came to the conclusion that the easiest way would be to use an object and call its properties with JavaScript's brackets n' strings... thingy.

 

Note: these are for US keyboard (QWERTY specifically); other layouts may not correctly pick up the input or output the virtual key code as-is

(mostly punctuation keys on the right side of letters)
example: VK_OEM_4,VK_OEM_5,VK_OEM_6,VK_OEM_7 for '[', '\', ']', and '\'' keys respectively, as well as their shift versions.

I guess they mapped the values to the locations on the keyboard, and not to expected character messages for these keys, huh?

 

Since the code is vertically long, I'll post the example of its usage first, followed by the code.

Example:

function keyPressed(myEvent){
    var kc = vkCodes[myEvent.key];
    if(kc == undefined){
        alert('Unsupported key cannot be simmed: ' + myEvent.key + ' (code: ' + myEvent.keyCode + ')');
        return;
    }
    sendHTTPmessage('blah/keyPressedDown/' + kc);
}

 

If the key that is pressed is not in the vkCodes object, it the get would return null.

Note: I didn't flesh out the vkCodes with all possible codes, just those that would be relevant or useful to me.

Now for the code:  

var vkCodes = {
    'Enter':0x0D,
    'Alt':18,
    'Control':17,
    'Tab':0x09,
    'Shift':0x10,
    'CapsLock':0x0D,
    'Backspace':8,
    'OS':0x0D,
    'Escape':0x1B,
    'Delete':0x0D,
    'Insert':0x0D,
    'PageUp':33,
    'PageDown':34,
    'End':35,
    'Home':36,
    'ArrowLeft':37,
    'ArrowRight':39,
    'ArrowUp':38,
    'ArrowDown':40,
    'PrintScreen':0x2C,
    'Insert':45,
    'Delete':46,
    '0':0x30, // both numpad and numbers above letters will be used as numbers above letters
    '1':49,
    '2':50,
    '3':51,
    '4':52,
    '5':53,
    '6':54,
    '7':55,
    '8':56,
    '9':57,
    ' ':0x20,
    'a':0x41, // lowercase
    '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,
    'A':0x41, // uppercase, same keycode output as lowercase
    '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,
    '*':105, // assume numpad *
    '+':0x6B, // assume numpad +
    '.':0xBE, // period near letters, not decimal on numpad
    '>':0xBE,
    '<':0xBC,
    ',':0xBC,
    ';':0xBA,
    ':':0xBA,
    '\'':0xDE,
    '"':0xDE,
    '[':0xDB,
    '{':0xDB,
    ']':0xDD,
    '}':0xDD,
    '\\':0xDC,
    '|':0xDC,
    '`':0xC0,
    '~':0xC0,
    '-':0xBD, // minus near 0, not minus on numpad
    '_':0xBD,
    '=':0xBB,
    '/':0xBF, // slash near letters, not divide on numpad
    '?':0xBF,
    'F1':112,
    'F2':113,
    'F3':114,
    'F4':115,
    'F5':116,
    'F6':117,
    'F7':118,
    'F8':119,
    'F9':120,
    'F10':121,
    'F11':122,
    'F12':123,
    'AudioVolumeMute':0xAD,
    'AudioVolumeUp':0xAF,
    'AudioVolumeDown':0xAE,
    'MediaPlayPause':0xB3,
    'MediaPlayNext':0xB0,
    'MediaPlayPrevious':0xB1,
    'MediaPlayStop':0xB2
};

No comments:

Post a Comment

Coding Challenge #54 C++ int to std::string (no stringstream or to_string())

Gets a string from an integer (ejemplo gratis: 123 -> "123") Wanted to come up with my own function for this like 10 years ago ...