This is pretty cool, I'd love to see it work with Dvorak!
I don't know if this is something you want to do, but if you'd like to add Dvorak I mapped the coordinates for it here: https://gist.github.com/1195948
It's rather strange to see a QWERTY layout when using dvorak. That said, if you showed a dvorak layout to a QWERTY user, you'd have a powerful demonstration of how much less finger travel there is and it convince them to switch.
I love your work on this - a good heatmap library is super helpful, and this is a very clever way to demonstrate it. And that QR code demo you posted earlier is pretty sweet, too...good weekend, huh?
Does it work only in Chrome, or something? Noting happens for me in Firefox.
Edit: got blocked by AdBlock+.
Remark: it ignores characters/keys that aren't present on US keyboards. No é è à ñ ö π ς φ ... would it be possible to catch Alt/Shift keys, for instance?
Shifted keys, or at least upper-case letters should be easily handled. The problem I suspect is deciding which shift key has been used (or whether caps lock is enabled).
As far as other modifiers, I think a lot of those aren't available to the keypress handler (Specifically, things like cmd-* on a Mac are usually handled by the windowmanager or as app menu shortcuts). I think I have seen html5/js demos that capture more than the usual set of keystrokes though (emacs & vim js demos spring to mind), so it might be possible to do so.
As far as special characters, that'd require you to detect the user keyboard layout in order to know where the appropriate key lives (with added effort for dead-key style modification)
I think it would be very useful to track auxiliary keys such as delete, shift etc too. Personally, I tend to use delete a lot as I am a lousy touch typist, and this would help me visualize how bad the problem actually is.
I just added the DVORAK layout to the keyboard heatmap and also open sourced it on GitHub, where everybody can contribute his layout preferences: https://github.com/pa7/Keyboard-Heatmap
17 comments
[ 2.6 ms ] story [ 48.4 ms ] threadI don't know if this is something you want to do, but if you'd like to add Dvorak I mapped the coordinates for it here: https://gist.github.com/1195948
Thanks!
Edit: got blocked by AdBlock+.
Remark: it ignores characters/keys that aren't present on US keyboards. No é è à ñ ö π ς φ ... would it be possible to catch Alt/Shift keys, for instance?
As far as other modifiers, I think a lot of those aren't available to the keypress handler (Specifically, things like cmd-* on a Mac are usually handled by the windowmanager or as app menu shortcuts). I think I have seen html5/js demos that capture more than the usual set of keystrokes though (emacs & vim js demos spring to mind), so it might be possible to do so.
As far as special characters, that'd require you to detect the user keyboard layout in order to know where the appropriate key lives (with added effort for dead-key style modification)
Edit: poking around in the http://www.ymacs.org/ source, there's a reference to http://unixpapa.com/js/key.html which gives access to a whole bunch of extra keycodes.