Processing.js and cross browser keycode compatibility

On Friday, I began looking (in more depth) at a ticket that started out as a simple problem of figuring out why an example sketch wasn’t working exactly like it’s Processing counterpart.  It started out as a simple problem but turned into the urge to overhaul our current key input structure to something that works on all browsers.  After much testing and figuring out how each browser treats keyCodes and key strokes, it is my recommendation to add a browser check and account for how each browser handles these items.

I used w3.org’s Keyboard Events and Codes page to figure out what each browser spit out as different keyCodes and charCodes.  This helped me figure out that Opera is pitching out the % keyCode for pressing the left arrow key.  As for key strokes, which was the original problem in the ticket, I used this site.  It showed me that Chrome refires keydown events (on certain keys) when you hold a key down.  This explains why the sketch works properly in Chrome but not in Firefox.  To make it work like p5, we’d have to account for all of that and eventually make everything uniform.

For implementation, I’m looking to port directly into PJS some browser and operating system detection code written in Javascript.  It uses the information from navigator.userAgent.  Strings may not be the best way to deal with them but at the moment it’s the only thing I’ve found that’s simple enough to implement.  If anyone’s got better ideas, feel free to link them to me here.  After I get the browser detection working, I’m moving on to making sure Firefox and Chrome work as p5 does.  Implementing the other browsers may be moved to a later date depending how much I can get done.

My only question to the browser builders out there is… couldn’t you guys get together and standardize all this so users don’t have to worry so much about browser compatibility?  *insert frowning face*