Click on the right/left arrows to move E.Key.

E.Key.

Detecting browser keyboard events is tough. E.Key is a key event listener utility that tries to help.

Download

e_key.js (Currently uses the YUI Event)

key_map.js (Default US keyboard map)

Docs

Contructor

object EKey(object keyMap, object element)

Instance Properties

object keyMap

Where keyMap is in object literal format.

var keyMap = {
	/*
	 * Common non-printing function keys. Keycode/Function reference mapping. Note keycodes
	 * may be device specific and different keyboard layouts may have different values. Note,
	 * F1-F12 keycodes are inconsistent and are in many instances tigtly coupled to browser.
	 */
	"functional":{
	    8:"backspace", 9:"tab", 12:"numlock", 13:"return", 19:"pause", 27:"escape", 32:"space",
	    33:"pageup", 34:"pagedown", 35:"end", 36:"home", 37:"left", 38:"up", 39:"right", 40:"down", 
	    44:"printscreen",  46:"delete"
	},
	/*
	 * Common printable keys. Keydown Keycode/Name reference mapping. Alphanumeric characters 
	 * have their ASCII code, but punctuation characters do not. 
	 * May have inconsistent behaviour on international keyboards, locale dependent.
	 */
	"printable":{
	    33:"!", 34:"\"", 35:"#", 36:"$", 37:"%", 38:"&", 39:"'", 40:"(", 41:")", 42:"*", 
	    43:"+", 44:",", 45:"-", 46:".", 47:"/", 
	    48:"0", 49:"1", 50:"2", 51:"3", 52:"4", 53:"5", 54:"6", 55:"7", 56:"8", 57:"9", 
	    58:":", 59:";", 60:"<", 61:"=", 62:">", 63:"?",
	    65:"A", 66:"B", 67:"C", 68:"D", 69:"E", 70:"F", 71:"G", 72:"H", 73:"I", 74:"J",
	    75:"K", 76:"L", 77:"M", 78:"N", 79:"O", 80:"P", 81:"Q", 82:"R", 83:"S", 84:"T",
	    85:"U", 86:"V", 87:"W", 88:"X", 89:"Y", 90:"Z",
	    91:"[", 92:"\\", 93:"]", 94:"^", 95:"_", 96:"`",
	    97:"a", 98:"b", 99:"c", 100:"d", 101:"e", 102:"f", 103:"g", 104:"h", 105:"i",
	    106:"j", 107:"k", 108:"l", 109:"m", 110:"n", 111:"o", 112:"p", 113:"q", 114:"r",
	    115:"s", 116:"t", 117:"u", 118:"v", 119:"w", 120:"x", 121:"y", 122:"z",
	    123:"{", 124:"|", 125:"}", 126:"~"
	},
	"modifiable":{
		18:"alt", 17:"ctrl", 16:"shift", 224:"meta"
	}
};

object element

Where element is an HTML Element object which defines the target for keyboard event listening.

Instance Methods

void addEventListener(string [modifier+][function+][print+], object listener)

The listener will receive an event object as the first argument.

void removeEventListener(string [modifier+][function+][print+], object listener)

Examples

Try the key combos in the examples and have fun!

-E.Key

Function Key Listener

	function spaceListener(evt){
		alert("space Listener");
	}
	var keyboard = new EKey(keyMap, document);
	keyboard.addEventListener("space", spaceListener);

Print Key Listener

	function qListener(evt){
		alert("q Listener");
	}
	var keyboard = new EKey(keyMap, document);
	keyboard.addEventListener("q", qListener);

Modifier/Print Key Listener

	function ctrlqListener(evt){
		alert("ctrl+q Listener");
	}
	var keyboard = new EKey(keyMap, document);
	keyboard.addEventListener("ctrl+q", altqListener);