WhatKey.net, a simple way to find JavaScript keycodes

Tuesday, Dec 7, 2010 2 minute read Tags: whatkey javascript web project
Hey, thanks for the interest in this post, but just letting you know that it is over 3 years old, so the content in here may not be accurate.

Today while preparing a set of slides for an upcoming talk I decided that I wanted to do the slides as a series of web pages, the problem is that I still wanted to be able to use my Logitech clicker. Since it ‘just works’ when I plug it in I figured it was firing some simple keyboard events, but the question is, what keyboard events is it firing?

I fired up Chrome, opened the JavaScript console and added a body keypress event to capture the keycode. Sweet, got what I needed, but it was a bit of a pain in the ass to do, I just wished there was a simpler way to find it, and what if I need to get them again, I’ve gotta write little handler again.

It’s just one of those things that you don’t need all that often, but it’s just a tedious task to get done.

As they say, the necessity is the mother of all invention, so I decided to whip up a simple website which anyone can use, available at http://whatkey.net.

All you need to do is fire up http://whatkey.net and press the key that you want, this give you the keycode for the keydown event in big letters. If you want to check different keyboard events, like keypress or keyup then you can access them by going to http://whatkey.net/keypress or http://whatkey.net/keyup.

Best of all this whole application is done in about 20 lines of code (source code is on GitHub), it runs Ruby, using Sinatra and hosted on Heroku.

Hopefully this tool becomes useful to other web developers out there.