Keyboard Input | Multiple Keypress Demo
Instructions/Info/Notes:
- Pressing one or more keyboard keys (of the ones shown/supported in this visualization) will cause them to light up (i.e. change color) until released. The only exception is {Caps Lock}: which will exhibit its expected 'toggle on / toggle off' behavior.
- OS/Browser Note: This visualization was built and tested on a laptop running Windows 10 and using the Google Chrome browser. While I believe the keyboard keys shown / implemented will work for most mainstream operating systems, browsers, and keyboards... there's always that one exception.
- There is no support for the {Right Shift}, {Right Control}, nor {Right Alt} keys; largely because I want to keep this demo interesting yet simple. They could be supported, but this requires grabbing additional info from the keyPress event on the JavaScript side of things (i.e. external to p5js support).
- The {ANY} key is this visualization's Easter Egg. It's there mostly to fill in the gap between {?, /} and {Enter}, though I might find some later feature for it (i.e. trigger via key combo, etc.)
- Lastly: this could probably also be easily refactored into a virtual keyboard demo as well (as a kind of inverse thereof). Maybe via removing key detection code, adding mouse collision support for KeyRep objects, collecting 'onVirtualKeypress' events thereof, and sending the chars into a buffer (WLOG).