shortcuts & controls displayed in a user friendly way

this library is in a early stage and will be moved to GitHub soon

Keys only, no strokes

	var ahks = AHKeystrokes.setup($('.justKeys'))
				.of('{use} AWSY {to move, hit} [SPACE] {to shoot!}');

Keys and strokes sequence

	var ahks = AHKeystrokes.setup($('.jumpAndRun'))
				.of('{use} [LEFT][RIGHT] {to walk} [UP] {to jump &} [DOWN] {to duck!}')
				.play([0,1,0,1,0,1,2,3,2,3,2,3], 250)

Keys positioning and strokes

look around
	var ahks = AHKeystrokes.setup($('.jumpAndRunPositioned'))
				.of('AWSY [UP][DOWN]')

Keys live (shows keys hit by user)

	var ahks = AHKeystrokes.setup($('.live'))
				.of('This is live {click here to invoke focus, then press keys}')

Keys live (keypress and keyrelease callbacks invoked)

	var options = {onKeyPressed: userPressedKeyHandler,
				   onKeyReleased: userReleasedKeyHandler

	var ahks = AHKeystrokes.setup($('.liveCallback'), options)
							.of('Hit keys like there is no morning!')

Keyboard layout

	var krow0 = '[ESC] [F1][F2][F3][F4] [F5][F6][F7][F8] [F9][F10][F11][F12] [INS][DEL]',
		krow1 = '§1234567890?^[BACKSPACE]',
		krow2 = '[TAB]qwertzuiopü¨',
		krow3 = '[CAPSLOCK]asdfghjklöä$[ENTER]',
		krow4 = '[SHIFT]‹yxcvbnm,.-[SHIFT]',

	standardKeyboard = AHKeystrokes.setup($('#standardKeyboard'))
					.fillWith($('#standardKeyboard .row0'), krow0)
					.fillWith($('#standardKeyboard .row1'), krow1)
					.fillWith($('#standardKeyboard .row2'), krow2)
					.fillWith($('#standardKeyboard .row3'), krow3)
					.fillWith($('#standardKeyboard .row4'), krow4)
					.fillWith($('#standardKeyboard .row5'), krow5);

	$("#standardKeyboard .row0 .key").addClass("small");


Custom Keyboard layout (a modified Colemak), holding keys

	var cmkrow0 = '`1234567890-=[BACKSPACE]',
		cmkrow1 = '[TAB]qwfpgjluy;()',
		cmkrow2 = '[BACKSPACE]arstdhneio`[ENTER]',
		cmkrow3 = '[SHIFT]zxcvbkm,./[SHIFT]',
		cmkrow4 = '[CTRL][ALT][SPACE][ALT][CTRL]',

		ahks = AHKeystrokes.setup($('#colemakKeyboard'))
				.fillWith($('#colemakKeyboard .row0'), cmkrow0)
				.fillWith($('#colemakKeyboard .row1'), cmkrow1)
				.fillWith($('#colemakKeyboard .row2'), cmkrow2)
				.fillWith($('#colemakKeyboard .row3'), cmkrow3)
				.fillWith($('#colemakKeyboard .row4'), cmkrow4)


Interactive Demo: Learn Sublime Text Shortcuts

Links trigger display of shortcuts