di0ib
/
tmk_keyboard
Watch 1
Star 0
Fork 0
Code Releases 4 Activity
Browse Source

Add editor/hhkb, initial version of keymap editor for HHKB

gh-pages
tmk 10 years ago
parent
17547b66cc
commit
48b6c5baae
4 changed files with 1843 additions and 0 deletions
Split View Show Diff Stats
  1. 407
    0
      editor/hhkb/MEMO.txt
  2. 712
    0
      editor/hhkb/codes.js
  3. 642
    0
      editor/hhkb/index.html
  4. 82
    0
      editor/hhkb/keyboard.css

+ 407
- 0
editor/hhkb/MEMO.txt View File

@@ -0,0 +1,407 @@
TODO
test on remote site
tmk.github.io/tmk_editor/hhkb/?
github pages
https://help.github.com/articles/user-organization-and-project-pages

save file button
https://developer.mozilla.org/en-US/docs/Web/API/Blob
var typedArray = GetTheTypedArraySomehow();
var blob = new Blob([typedArray], {type: "application/octet-binary"}); // pass a useful mime type here
"application/octet-stream"
var url = URL.createObjectURL(blob);

TrueErgonomic
var a = document.getElementById("download-link");
a.href = window.URL.createObjectURL(blob);
a.download = 'TrulyErgonomic_v3_3.hex';
// a.textContent = 'Download file.';
a.className = 'TE_link';
a.click()

keyboard key text css
align of wrapped text

edit action for FN key
load/save JSON
load/save hex(binary)
binary file format
meta info:
date/time
keyboard id
keymap/actionmap

firmware
load binary
Mass Storage or HID comm
fixed address for keymaps

action map support

Hex file format
http://en.wikipedia.org/wiki/Intel_HEX
1.Start code: ':'
2.Byte Count: 2 hex(0-255)
3.Address: 4 hex(0-2^16)
4.Record Type: 2 hex(00-05)
00: Data record. which contains 16bit address and data.
01: End of File record. It must appear in the last line.(usually :00000001FF)
02: Extended Segment Address Record.
03: Start Segment Address Record.
04: Extended Linear Address Record. Upper two bytes of 32 bit address.
05: Start Linear Address Record.
5.Data: byte_count * hex(a sequence of bytes)
6.Checksum: 2 hex LSB of 2's complement of the sum of fields: 'Byte Count', 'Address', 'Record Type' and 'Data'.
checksum = ~(the sum of bytes)&0xff + 1 = (the sum)&0xff^0xff + 1

TMK keymapping mode
keymap 8bit code
Special 8bit code Fn0-32 can be assigned for action code.
actions[] -> ---------------
| action x 32 |
keymaps[] -> ---------------
| keymap 0 |
---------------
| keymap 1 |
---------------
| keymap 2 |
---------------
| keymap 3 |
---------------
Interface: uint8_t keymap_key_to_keycode(uint8_t layer, key_t key) in keymap.h
action_t keymap_fn_to_action(uint8_t keycode) in keymap.h
static const uint16_t PROGMEM fn_actions[] = {
[0] = ACTION_LAYER_MOMENTARY(0),
[1] = ACTION_LAYER_MOMENTARY(1),
[2] = ACTION_LAYER_MOMENTARY(2),
[3] = ACTION_LAYER_MOMENTARY(3),
[4] = ACTION_LAYER_TOGGLE(0),
[5] = ACTION_LAYER_TOGGLE(1),
[6] = ACTION_LAYER_TOGGLE(2),
[7] = ACTION_LAYER_TOGGLE(3),
[8] = ACTION_LAYER_TAP_TOGGLE(0),
[9] = ACTION_LAYER_TAP_TOGGLE(1),
[10] = ACTION_LAYER_TAP_TOGGLE(2),
[11] = ACTION_LAYER_TAP_TOGGLE(3),
};

actionmap 16bit code
All key action can be defined in 16bit code.
Memory usage will be about doubled size compared to keymap 8bit code.
Map Structure:
actionmaps[] -> ---------------
| actionmap 0 |
---------------
| actionmap 1 |
---------------
| actionmap 2 |
---------------
| actionmap 3 |
---------------
Interface: action_t action_for_key(uint8_t layer, key_t key) in action.h

Flash usage cosidaration
ATmega32U4
32KB Firmware -24KB(with full option)
Keymapping 4KB-
Bootloader 4KB(Atmel stock) or 512B(Teensy)
ATmega16U4
16KB Firmware -10KB
Keymapping 2KB-
Bootloader 4KB(Atmel stock) or 512B(Teensy)
PS/2 and ADB have 256 keys in map, so use 512B each layer.
8layers will be available for ATMega32U4 and 4layers for 16U4. This seems like enough in most case.


HTML
Keyboard key element ID
a) ID indicates place of look. needs Converter Table.
b) ID indicates matrix position.
x c) ID indicates defalut key name like: q, w, ... lshift...
Not good. no consistency of name length.

Javascript
Keymap Array
includes matrix postions of the key.
keymap[LAYER][8][8] = {
{ { }, { } }

Keycode table
keyname => keycode(16bit)
keycode => keyname

Keymap
16bit keymap at first
8bit keymap support depends on future request
Fn key configure
Macro editor


Where it converts key postion into matrix position at?
Convert table? UI can use position of elemen placing.
UI uses matrix posiotn for ID of element.



HHKB key matrix
COL 0 1 2 3 4 5 6 7
ROW ---------------------------------------------------------------
0| 2 q w s a z x c
1| 3 4 r e d f v b
2| 5 6 y t g h n _NONE_
3| 1 Esc Tab Control LShift LAlt LMeta Space
4| 7 8 u i k j m _NONE_
5| \ ` Delete Return Fn RShift RAlt RMeta
6| 9 0 o p ; l , _NONE_
7| - + ] [ ' / . _NONE_


Key to matrix Table
/* Qwerty
* ,-----------------------------------------------------------.
* |Esc| 1| 2| 3| 4| 5| 6| 7| 8| 9| 0| -| =| \| `|
* |-----------------------------------------------------------|
* |Tab | Q| W| E| R| T| Y| U| I| O| P| [| ]|Backs|
* |-----------------------------------------------------------|
* |Contro| A| S| D| F| G| H| J| K| L| ;| '|Enter |
* |-----------------------------------------------------------|
* |Shift | Z| X| C| V| B| N| M| ,| .| /|Shift |Fn |
* `-----------------------------------------------------------'
* |Gui|Alt | Space |Alt |Gui|
* `-------------------------------------------'
*/
[
0x31, 0x30, 0x00, 0x10, 0x11, 0x20, 0x21, 0x40, 0x41, 0x60, 0x61, 0x70, 0x71, 0x50, 0x51,
0x32, 0x01, 0x02, 0x13, 0x12, 0x23, 0x22, 0x42, 0x43, 0x62, 0x63, 0x73, 0x72, 0x52,
0x33, 0x04, 0x03, 0x14, 0x15, 0x24, 0x25, 0x45, 0x44, 0x65, 0x64, 0x66, 0x53,
0x34, 0x05, 0x06, 0x07, 0x16, 0x17, 0x26, 0x46, 0x66, 0x76, 0x75, 0x55, 0x54,
0x35, 0x36, 0x37, 0x57, 0x56,
]




KC_NO = 0x00,
KC_ROLL_OVER,
KC_POST_FAIL,
KC_UNDEFINED,
KC_A,
KC_B,
KC_C,
KC_D,
KC_E,
KC_F,
KC_G,
KC_H,
KC_I,
KC_J,
KC_K,
KC_L,
KC_M, /* 0x10 */
KC_N,
KC_O,
KC_P,
KC_Q,
KC_R,
KC_S,
KC_T,
KC_U,
KC_V,
KC_W,
KC_X,
KC_Y,
KC_Z,
KC_1,
KC_2,
KC_3, /* 0x20 */
KC_4,
KC_5,
KC_6,
KC_7,
KC_8,
KC_9,
KC_0,
KC_ENTER,
KC_ESCAPE,
KC_BSPACE,
KC_TAB,
KC_SPACE,
KC_MINUS,
KC_EQUAL,
KC_LBRACKET,
KC_RBRACKET, /* 0x30 */
KC_BSLASH, /* \ (and |) */
KC_NONUS_HASH, /* Non-US # and ~ */
KC_SCOLON, /* ; (and :) */
KC_QUOTE, /* ' and " */
KC_GRAVE, /* Grave accent and tilde */
KC_COMMA, /* , and < */
KC_DOT, /* . and > */
KC_SLASH, /* / and ? */
KC_CAPSLOCK,
KC_F1,
KC_F2,
KC_F3,
KC_F4,
KC_F5,
KC_F6,
KC_F7, /* 0x40 */
KC_F8,
KC_F9,
KC_F10,
KC_F11,
KC_F12,
KC_PSCREEN,
KC_SCROLLLOCK,
KC_PAUSE,
KC_INSERT,
KC_HOME,
KC_PGUP,
KC_DELETE,
KC_END,
KC_PGDOWN,
KC_RIGHT,
KC_LEFT, /* 0x50 */
KC_DOWN,
KC_UP,
KC_NUMLOCK,
KC_KP_SLASH,
KC_KP_ASTERISK,
KC_KP_MINUS,
KC_KP_PLUS,
KC_KP_ENTER,
KC_KP_1,
KC_KP_2,
KC_KP_3,
KC_KP_4,
KC_KP_5,
KC_KP_6,
KC_KP_7,
KC_KP_8, /* 0x60 */
KC_KP_9,
KC_KP_0,
KC_KP_DOT,
KC_NONUS_BSLASH, /* Non-US \ and | */
KC_APPLICATION,
KC_POWER,
KC_KP_EQUAL,
KC_F13,
KC_F14,
KC_F15,
KC_F16,
KC_F17,
KC_F18,
KC_F19,
KC_F20,
KC_F21, /* 0x70 */
KC_F22,
KC_F23,
KC_F24,
KC_EXECUTE,
KC_HELP,
KC_MENU,
KC_SELECT,
KC_STOP,
KC_AGAIN,
KC_UNDO,
KC_CUT,
KC_COPY,
KC_PASTE,
KC_FIND,
KC__MUTE,
KC__VOLUP, /* 0x80 */
KC__VOLDOWN,
KC_LOCKING_CAPS, /* locking Caps Lock */
KC_LOCKING_NUM, /* locking Num Lock */
KC_LOCKING_SCROLL, /* locking Scroll Lock */
KC_KP_COMMA,
KC_KP_EQUAL_AS400, /* equal sign on AS/400 */
KC_INT1,
KC_INT2,
KC_INT3,
KC_INT4,
KC_INT5,
KC_INT6,
KC_INT7,
KC_INT8,
KC_INT9,
KC_LANG1, /* 0x90 */
KC_LANG2,
KC_LANG3,
KC_LANG4,
KC_LANG5,
KC_LANG6,
KC_LANG7,
KC_LANG8,
KC_LANG9,
KC_ALT_ERASE,
KC_SYSREQ,
KC_CANCEL,
KC_CLEAR,
KC_PRIOR,
KC_RETURN,
KC_SEPARATOR,
KC_OUT, /* 0xA0 */
KC_OPER,
KC_CLEAR_AGAIN,
KC_CRSEL,
KC_EXSEL, /* 0xA4 */

/* NOTE: Following codes(0xB0-DD) are not used. Leave them for reference. */
KC_KP_00 = 0xB0,
KC_KP_000,
KC_THOUSANDS_SEPARATOR,
KC_DECIMAL_SEPARATOR,
KC_CURRENCY_UNIT,
KC_CURRENCY_SUB_UNIT,
KC_KP_LPAREN,
KC_KP_RPAREN,
KC_KP_LCBRACKET, /* { */
KC_KP_RCBRACKET, /* } */
KC_KP_TAB,
KC_KP_BSPACE,
KC_KP_A,
KC_KP_B,
KC_KP_C,
KC_KP_D,
KC_KP_E, /* 0xC0 */
KC_KP_F,
KC_KP_XOR,
KC_KP_HAT,
KC_KP_PERC,
KC_KP_LT,
KC_KP_GT,
KC_KP_AND,
KC_KP_LAZYAND,
KC_KP_OR,
KC_KP_LAZYOR,
KC_KP_COLON,
KC_KP_HASH,
KC_KP_SPACE,
KC_KP_ATMARK,
KC_KP_EXCLAMATION,
KC_KP_MEM_STORE, /* 0xD0 */
KC_KP_MEM_RECALL,
KC_KP_MEM_CLEAR,
KC_KP_MEM_ADD,
KC_KP_MEM_SUB,
KC_KP_MEM_MUL,
KC_KP_MEM_DIV,
KC_KP_PLUS_MINUS,
KC_KP_CLEAR,
KC_KP_CLEAR_ENTRY,
KC_KP_BINARY,
KC_KP_OCTAL,
KC_KP_DECIMAL,
KC_KP_HEXADECIMAL, /* 0xDD */

/* Modifiers */
KC_LCTRL = 0xE0,
KC_LSHIFT,
KC_LALT,
KC_LGUI,
KC_RCTRL,
KC_RSHIFT,
KC_RALT,
KC_RGUI,

+ 712
- 0
editor/hhkb/codes.js View File

@@ -0,0 +1,712 @@
/*
function flatten(obj)
{
var a = [];
if (obj instanceof Array) {
return obj.map(function(e) {return flatten(e) ;});
} else {
return obj
}
};
*/

function to_2hexstr(b)
{
return ('0'+ b.toString(16)).substr(-2).toUpperCase();
};

function hex_line(data, address, record_type)
{
var sum = 0;
sum += data.length;
sum += (address >> 8);
sum += (address & 0xff);
sum += record_type;

var line = '';
line += ':';
line += to_2hexstr(data.length);
line += to_2hexstr(address >> 8);
line += to_2hexstr(address & 0xff);
line += to_2hexstr(record_type);
for (var i = 0; i < data.length; i++) {
sum = (sum + data[i]);
line += to_2hexstr(data[i]);
}
line += to_2hexstr((~sum + 1)&0xff); // Checksum
line +="\r\n";
return line;
}

function hex_output(keymaps) {
var output = '';
var bytes = [];

// TODO: address
// TODO: refine
// flatten keymaps into one dimension array
[].concat.apply([], [].concat.apply([], keymaps)).forEach(function(e) {
bytes.push(e);
if (bytes.length == 16) {
output += hex_line(bytes, 0x0123, 0x05);
console.log(bytes);
bytes.length = 0;
}
});
if (bytes.length > 0) {
console.log(bytes);
}
return output;
};

function source_output(keymaps) {
var output = '';
// fn actions
output += "/*\n";
output += " * Keymap for PFU HHKB Pro\n";
output += " * generated by tmk keymap editor\n";
output += " */\n";
output += "#include <stdint.h>\n";
output += "#include <stdbool.h>\n";
output += "#include <avr/pgmspace.h>\n";
output += "#include \"keycode.h\"\n";
output += "#include \"action.h\"\n";
output += "#include \"action_macro.h\"\n";
output += "#include \"keymap.h\"\n\n";

output += "static const uint16_t PROGMEM fn_actions[] = {\n";
output += " [0] = ACTION_LAYER_MOMENTARY(0), \n";
output += " [1] = ACTION_LAYER_MOMENTARY(1), \n";
output += " [2] = ACTION_LAYER_MOMENTARY(2), \n";
output += " [3] = ACTION_LAYER_MOMENTARY(3), \n";
output += " [4] = ACTION_LAYER_TOGGLE(0), \n";
output += " [5] = ACTION_LAYER_TOGGLE(1), \n";
output += " [6] = ACTION_LAYER_TOGGLE(2), \n";
output += " [7] = ACTION_LAYER_TOGGLE(3), \n";
output += " [8] = ACTION_LAYER_TAP_TOGGLE(0), \n";
output += " [9] = ACTION_LAYER_TAP_TOGGLE(1), \n";
output += " [10] = ACTION_LAYER_TAP_TOGGLE(2), \n";
output += " [11] = ACTION_LAYER_TAP_TOGGLE(3), \n";
output += "};\n\n";

// keymaps
output += 'static const uint8_t PROGMEM keymaps[][';
output += keymaps[0].length; // row
output += '][';
output += keymaps[0][0].length; // col
output += "] = {\n";
for (var i in keymaps) {
output += " {\n";
for (var j in keymaps[i]) {
output += " { ";
for (var k in keymaps[i][j]) {
output += '0x' + ('0' + keymaps[i][j][k].toString(16)).substr(-2);
output += ',';
}
output += " },\n";
}
output += " },\n";
}
output += "};\n\n";
output += "/* translates key to keycode */\n";
output += "uint8_t keymap_key_to_keycode(uint8_t layer, key_t key)\n";
output += "{\n";
output += " return pgm_read_byte(&keymaps[(layer)][(key.row)][(key.col)]);\n";
output += "}\n";
output += "\n";
output += "/* translates Fn index to action */\n";
output += "action_t keymap_fn_to_action(uint8_t keycode)\n";
output += "{\n";
output += " action_t action;\n";
output += " if (FN_INDEX(keycode) < sizeof(fn_actions) / sizeof(fn_actions[0])) {\n";
output += " action.code = pgm_read_word(&fn_actions[FN_INDEX(keycode)]);\n";
output += " } else {\n";
output += " action.code = ACTION_NO;\n";
output += " }\n";
output += " return action;\n";
output += "}\n";
return output;
};

var id_code = {
'act-no': 0,
'act-roll-over': 1,
'act-post-fail': 2,
'act-undefined': 3,
'act-a': 4,
'act-b': 5,
'act-c': 6,
'act-d': 7,
'act-e': 8,
'act-f': 9,
'act-g': 10,
'act-h': 11,
'act-i': 12,
'act-j': 13,
'act-k': 14,
'act-l': 15,
'act-m': 16,
'act-n': 17,
'act-o': 18,
'act-p': 19,
'act-q': 20,
'act-r': 21,
'act-s': 22,
'act-t': 23,
'act-u': 24,
'act-v': 25,
'act-w': 26,
'act-x': 27,
'act-y': 28,
'act-z': 29,
'act-1': 30,
'act-2': 31,
'act-3': 32,
'act-4': 33,
'act-5': 34,
'act-6': 35,
'act-7': 36,
'act-8': 37,
'act-9': 38,
'act-0': 39,
'act-enter': 40,
'act-escape': 41,
'act-bspace': 42,
'act-tab': 43,
'act-space': 44,
'act-minus': 45,
'act-equal': 46,
'act-lbracket': 47,
'act-rbracket': 48,
'act-bslash': 49,
'act-nonus-hash': 50,
'act-scolon': 51,
'act-quote': 52,
'act-grave': 53,
'act-comma': 54,
'act-dot': 55,
'act-slash': 56,
'act-capslock': 57,
'act-f1': 58,
'act-f2': 59,
'act-f3': 60,
'act-f4': 61,
'act-f5': 62,
'act-f6': 63,
'act-f7': 64,
'act-f8': 65,
'act-f9': 66,
'act-f10': 67,
'act-f11': 68,
'act-f12': 69,
'act-pscreen': 70,
'act-scrolllock': 71,
'act-pause': 72,
'act-insert': 73,
'act-home': 74,
'act-pgup': 75,
'act-delete': 76,
'act-end': 77,
'act-pgdown': 78,
'act-right': 79,
'act-left': 80,
'act-down': 81,
'act-up': 82,
'act-numlock': 83,
'act-kp-slash': 84,
'act-kp-asterisk': 85,
'act-kp-minus': 86,
'act-kp-plus': 87,
'act-kp-enter': 88,
'act-kp-1': 89,
'act-kp-2': 90,
'act-kp-3': 91,
'act-kp-4': 92,
'act-kp-5': 93,
'act-kp-6': 94,
'act-kp-7': 95,
'act-kp-8': 96,
'act-kp-9': 97,
'act-kp-0': 98,
'act-kp-dot': 99,
'act-nonus-bslash': 100,
'act-application': 101,
'act-power': 102,
'act-kp-equal': 103,
'act-f13': 104,
'act-f14': 105,
'act-f15': 106,
'act-f16': 107,
'act-f17': 108,
'act-f18': 109,
'act-f19': 110,
'act-f20': 111,
'act-f21': 112,
'act-f22': 113,
'act-f23': 114,
'act-f24': 115,
'act-execute': 116,
'act-help': 117,
'act-menu': 118,
'act-select': 119,
'act-stop': 120,
'act-again': 121,
'act-undo': 122,
'act-cut': 123,
'act-copy': 124,
'act-paste': 125,
'act-find': 126,
'act--mute': 127,
'act--volup': 128,
'act--voldown': 129,
'act-locking-caps': 130,
'act-locking-num': 131,
'act-locking-scroll': 132,
'act-kp-comma': 133,
'act-kp-equal-as400': 134,
'act-int1': 135,
'act-int2': 136,
'act-int3': 137,
'act-int4': 138,
'act-int5': 139,
'act-int6': 140,
'act-int7': 141,
'act-int8': 142,
'act-int9': 143,
'act-lang1': 144,
'act-lang2': 145,
'act-lang3': 146,
'act-lang4': 147,
'act-lang5': 148,
'act-lang6': 149,
'act-lang7': 150,
'act-lang8': 151,
'act-lang9': 152,
'act-alt-erase': 153,
'act-sysreq': 154,
'act-cancel': 155,
'act-clear': 156,
'act-prior': 157,
'act-return': 158,
'act-separator': 159,
'act-out': 160,
'act-oper': 161,
'act-clear-again': 162,
'act-crsel': 163,
'act-exsel': 164,
'act-reserved-165': 165,
'act-reserved-166': 166,
'act-reserved-167': 167,
'act-reserved-168': 168,
'act-reserved-169': 169,
'act-reserved-170': 170,
'act-reserved-171': 171,
'act-reserved-172': 172,
'act-reserved-173': 173,
'act-reserved-174': 174,
'act-reserved-175': 175,
'act-kp-00': 176,
'act-kp-000': 177,
'act-thousands-separator': 178,
'act-decimal-separator': 179,
'act-currency-unit': 180,
'act-currency-sub-unit': 181,
'act-kp-lparen': 182,
'act-kp-rparen': 183,
'act-kp-lcbracket': 184,
'act-kp-rcbracket': 185,
'act-kp-tab': 186,
'act-kp-bspace': 187,
'act-kp-a': 188,
'act-kp-b': 189,
'act-kp-c': 190,
'act-kp-d': 191,
'act-kp-e': 192,
'act-kp-f': 193,
'act-kp-xor': 194,
'act-kp-hat': 195,
'act-kp-perc': 196,
'act-kp-lt': 197,
'act-kp-gt': 198,
'act-kp-and': 199,
'act-kp-lazyand': 200,
'act-kp-or': 201,
'act-kp-lazyor': 202,
'act-kp-colon': 203,
'act-kp-hash': 204,
'act-kp-space': 205,
'act-kp-atmark': 206,
'act-kp-exclamation': 207,
'act-kp-mem-store': 208,
'act-kp-mem-recall': 209,
'act-kp-mem-clear': 210,
'act-kp-mem-add': 211,
'act-kp-mem-sub': 212,
'act-kp-mem-mul': 213,
'act-kp-mem-div': 214,
'act-kp-plus-minus': 215,
'act-kp-clear': 216,
'act-kp-clear-entry': 217,
'act-kp-binary': 218,
'act-kp-octal': 219,
'act-kp-decimal': 220,
'act-kp-hexadecimal': 221,
'act-reserved-222': 222,
'act-reserved-223': 223,
'act-lctrl': 224,
'act-lshift': 225,
'act-lalt': 226,
'act-lgui': 227,
'act-rctrl': 228,
'act-rshift': 229,
'act-ralt': 230,
'act-rgui': 231,
};

/* keycode to display */
var code_display = [
// {id, name(text), description(tooltip)}
{id: 'NO ', name: 'NO', desc: 'No action'},
{id: 'TRNS', name: 'TRNS', desc: 'Transparent'},
{id: 'POST_FAIL', name: 'POST_FAIL', desc: 'POST_FAIL'},
{id: 'UNDEFINED', name: 'UNDEFINED', desc: 'UNDEFINED'},
{id: 'A', name: 'A', desc: 'A'},
{id: 'B', name: 'B', desc: 'B'},
{id: 'C', name: 'C', desc: 'C'},
{id: 'D', name: 'D', desc: 'D'},
{id: 'E', name: 'E', desc: 'E'},
{id: 'F', name: 'F', desc: 'F'},
{id: 'G', name: 'G', desc: 'G'},
{id: 'H', name: 'H', desc: 'H'},
{id: 'I', name: 'I', desc: 'I'},
{id: 'J', name: 'J', desc: 'J'},
{id: 'K', name: 'K', desc: 'K'},
{id: 'L', name: 'L', desc: 'L'},
{id: 'M', name: 'M', desc: 'M'},
{id: 'N', name: 'N', desc: 'N'},
{id: 'O', name: 'O', desc: 'O'},
{id: 'P', name: 'P', desc: 'P'},
{id: 'Q', name: 'Q', desc: 'Q'},
{id: 'R', name: 'R', desc: 'R'},
{id: 'S', name: 'S', desc: 'S'},
{id: 'T', name: 'T', desc: 'T'},
{id: 'U', name: 'U', desc: 'U'},
{id: 'V', name: 'V', desc: 'V'},
{id: 'W', name: 'W', desc: 'W'},
{id: 'X', name: 'X', desc: 'X'},
{id: 'Y', name: 'Y', desc: 'Y'},
{id: 'Z', name: 'Z', desc: 'Z'},
{id: '1', name: '1', desc: '1'},
{id: '2', name: '2', desc: '2'},
{id: '3', name: '3', desc: '3'},
{id: '4', name: '4', desc: '4'},
{id: '5', name: '5', desc: '5'},
{id: '6', name: '6', desc: '6'},
{id: '7', name: '7', desc: '7'},
{id: '8', name: '8', desc: '8'},
{id: '9', name: '9', desc: '9'},
{id: '0', name: '0', desc: '0'},
{id: 'ENT', name: 'Enter', desc: 'ENTER'},
{id: 'ESC', name: 'Esc', desc: 'Escape'},
{id: 'BSPC', name: 'Back Space', desc: 'Back Space'},
{id: 'TAB', name: 'Tab', desc: 'Tab'},
{id: 'SPC', name: 'Space', desc: 'Space'},
{id: 'MINS', name: '-', desc: 'MINUS'},
{id: 'EQL', name: '=', desc: 'EQUAL'},
{id: 'LBRC', name: '[', desc: 'Left Bracket'},
{id: 'RBRC', name: ']', desc: 'Right Bracket'},
{id: 'BSLS', name: "\\", desc: 'Backslash'},
{id: 'NUHS', name: 'ISO #', desc: 'Non-US Hash'},
{id: 'SCLN', name: ';', desc: 'Semicolon'},
{id: 'QUOT', name: "'", desc: 'Quote'},
{id: 'GRV ', name: '`', desc: 'Grave'},
{id: 'COMM', name: ',', desc: 'Comma'},
{id: 'DOT ', name: '.', desc: 'Dot'},
{id: 'SLSH', name: '/', desc: 'Slash'},
{id: 'CAPS', name: 'Caps Lock', desc: 'Need this? Sure? :)'},
{id: 'F1 ', name: 'F1', desc: 'F1'},
{id: 'F2 ', name: 'F2', desc: 'F2'},
{id: 'F3 ', name: 'F3', desc: 'F3'},
{id: 'F4 ', name: 'F4', desc: 'F4'},
{id: 'F5 ', name: 'F5', desc: 'F5'},
{id: 'F6 ', name: 'F6', desc: 'F6'},
{id: 'F7 ', name: 'F7', desc: 'F7'},
{id: 'F8 ', name: 'F8', desc: 'F8'},
{id: 'F9 ', name: 'F9', desc: 'F9'},
{id: 'F10 ', name: 'F10', desc: 'F10'},
{id: 'F11 ', name: 'F11', desc: 'F11'},
{id: 'F12 ', name: 'F12', desc: 'F12'},
{id: 'PSCR', name: 'Print Screen', desc: 'Print Screen'},
{id: 'SLCK', name: 'Scroll Lock', desc: 'Scroll Lock'},
{id: 'PAUS', name: 'Pause', desc: 'Pause'},
{id: 'INS ', name: 'Insert', desc: 'Insert'},
{id: 'HOME', name: 'Home', desc: 'Home'},
{id: 'PGUP', name: 'Page Up', desc: 'Page Up'},
{id: 'DEL ', name: 'Delete', desc: 'Delete'},
{id: 'END ', name: 'END', desc: 'End'},
{id: 'PGDN', name: 'Page Down', desc: 'Page Down'},
{id: 'RGHT', name: '\u2192', desc: 'Right'},
{id: 'LEFT', name: '\u2190', desc: 'Left'},
{id: 'DOWN', name: '\u2193', desc: 'Down'},
{id: 'UP ', name: '\u2191', desc: 'Up'},
{id: 'NLCK', name: 'Num Lock', desc: 'Num Lock'},
{id: 'PSLS', name: 'P/', desc: 'Keypad Slash'},
{id: 'PAST', name: 'P*', desc: 'Keypad Asterisk'},
{id: 'PMNS', name: 'P-', desc: 'Keypad Minus'},
{id: 'PPLS', name: 'P+', desc: 'Keypad Plus'},
{id: 'PENT', name: 'P\u21A9', desc: 'Keypad Enter'},
{id: 'P1 ', name: 'P1', desc: 'Keypad 1'},
{id: 'P2 ', name: 'P2', desc: 'Keypad 2'},
{id: 'P3 ', name: 'P3', desc: 'Keypad 3'},
{id: 'P4 ', name: 'P4', desc: 'Keypad 4'},
{id: 'P5 ', name: 'P5', desc: 'Keypad 5'},
{id: 'P6 ', name: 'P6', desc: 'Keypad 6'},
{id: 'P7 ', name: 'P7', desc: 'Keypad 7'},
{id: 'P8 ', name: 'P8', desc: 'Keypad 8'},
{id: 'P9 ', name: 'P9', desc: 'Keypad 9'},
{id: 'P0 ', name: 'P0', desc: 'Keypad 0'},
{id: 'PDOT', name: 'P.', desc: 'Keypad Dot'},
{id: 'NUBS', name: 'ISO \\', desc: 'Non-US Backslash'},
{id: 'APP ', name: 'Application', desc: 'Application'},
{id: 'POWER', name: '_Power', desc: 'Power(Not work on Windows)'},
{id: 'PEQL', name: 'P=', desc: 'Keymapd Equal'},
{id: 'F13 ', name: 'F13', desc: 'F13'},
{id: 'F14 ', name: 'F14', desc: 'F14'},
{id: 'F15 ', name: 'F15', desc: 'F15'},
{id: 'F16 ', name: 'F16', desc: 'F16'},
{id: 'F17 ', name: 'F17', desc: 'F17'},
{id: 'F18 ', name: 'F18', desc: 'F18'},
{id: 'F19 ', name: 'F19', desc: 'F19'},
{id: 'F20 ', name: 'F20', desc: 'F20'},
{id: 'F21 ', name: 'F21', desc: 'F21'},
{id: 'F22 ', name: 'F22', desc: 'F22'},
{id: 'F23 ', name: 'F23', desc: 'F23'},
{id: 'F24 ', name: 'F24', desc: 'F24'},
{id: 'EXECUTE', name: 'EXECUTE', desc: 'EXECUTE'},
{id: 'HELP', name: 'HELP', desc: 'HELP'},
{id: 'MENU', name: 'MENU', desc: 'MENU'},
{id: 'SELECT', name: 'SELECT', desc: 'SELECT'},
{id: 'STOP', name: 'STOP', desc: 'STOP'},
{id: 'AGAIN', name: 'AGAIN', desc: 'AGAIN'},
{id: 'UNDO', name: 'UNDO', desc: 'UNDO'},
{id: 'CUT', name: 'CUT', desc: 'CUT'},
{id: 'COPY', name: 'COPY', desc: 'COPY'},
{id: 'PASTE', name: 'PASTE', desc: 'PASTE'},
{id: 'FIND', name: 'FIND', desc: 'FIND'},
{id: '_MUTE', name: '_MUTE', desc: '_MUTE(Not work on Windows)'},
{id: '_VOLUP', name: '_VOLUP', desc: '_VOLUP(Not work on Windows)'},
{id: '_VOLDOWN', name: '_VOLDOWN', desc: '_VOLDOWN(Not work on Windows)'},
{id: 'LCAP', name: 'Locking Caps Lock', desc: 'Locking Caps Lock'},
{id: 'LNUM', name: 'Locking Num Lock', desc: 'Locking Num Lock'},
{id: 'LSCR', name: 'Locking Scroll Lock', desc: 'Locking Scroll Lock'},
{id: 'PCMM', name: 'P,', desc: 'Keypad Comma'},
{id: 'KP_EQUAL_AS400', name: 'P= (AS400)', desc: 'Keypad Equal (AS400)'},
{id: 'INT1', name: '\u308D', desc: 'Japanese RO'},
{id: 'INT2', name: '\u3072\u3089\u304c\u306a', desc: 'Japanese Hiragana'},
{id: 'INT3', name: '\uffe5', desc: 'Japanese Yen'},
{id: 'INT4', name: '\u5909\u63db', desc: 'Japanese Henkan'},
{id: 'INT5', name: '\u7121\u5909\u63db', desc: 'Japanese Muhenkan'},
{id: 'INT6', name: 'INT6', desc: 'INT6'},
{id: 'INT7', name: 'INT7', desc: 'INT7'},
{id: 'INT8', name: 'INT8', desc: 'INT8'},
{id: 'INT9', name: 'INT9', desc: 'INT9'},
{id: 'LANG1', name: 'LANG1', desc: 'LANG1'},
{id: 'LANG2', name: 'LANG2', desc: 'LANG2'},
{id: 'LANG3', name: 'LANG3', desc: 'LANG3'},
{id: 'LANG4', name: 'LANG4', desc: 'LANG4'},
{id: 'LANG5', name: 'LANG5', desc: 'LANG5'},
{id: 'LANG6', name: 'LANG6', desc: 'LANG6'},
{id: 'LANG7', name: 'LANG7', desc: 'LANG7'},
{id: 'LANG8', name: 'LANG8', desc: 'LANG8'},
{id: 'LANG9', name: 'LANG9', desc: 'LANG9'},
{id: 'ALT_ERASE', name: 'ALT_ERASE', desc: 'ALT_ERASE'},
{id: 'SYSREQ', name: 'SYSREQ', desc: 'SYSREQ'},
{id: 'CANCEL', name: 'CANCEL', desc: 'CANCEL'},
{id: 'CLEAR', name: 'CLEAR', desc: 'CLEAR'},
{id: 'PRIOR', name: 'PRIOR', desc: 'PRIOR'},
{id: 'RETURN', name: 'RETURN', desc: 'RETURN'},
{id: 'SEPARATOR', name: 'SEPARATOR', desc: 'SEPARATOR'},
{id: 'OUT', name: 'OUT', desc: 'OUT'},
{id: 'OPER', name: 'OPER', desc: 'OPER'},
{id: 'CLEAR_AGAIN', name: 'CLEAR_AGAIN', desc: 'CLEAR_AGAIN'},
{id: 'CRSEL', name: 'CRSEL', desc: 'CRSEL'},
{id: 'EXSEL', name: 'EXSEL', desc: 'EXSEL'},

/* Special codes A5-DF */
/* System & Media key */
{id: 'PWR ', name: 'Sys Power', desc: 'System Power'},
{id: 'SLEP', name: 'Sys Sleep', desc: 'System Sleep'},
{id: 'WAKE', name: 'Sys Wake', desc: 'System Wake'},
{id: 'MUTE', name: 'Mute', desc: 'Audio Mute'},
{id: 'VOLU', name: 'Vol Up', desc: 'Audio Vol Up'},
{id: 'VOLD', name: 'Vol Down', desc: 'Audio Vol Down'},
{id: 'MNXT', name: 'Next Track', desc: 'Next Track'},
{id: 'MPRV', name: 'Prev Track', desc: 'Previous Track'},
{id: 'MSTP', name: 'Stop', desc: 'Media Stop'},
{id: 'MPLY', name: 'Play Pause', desc: 'Play Pause'},
{id: 'MSEL', name: 'Select', desc: 'Media Select'},
{id: 'EJCT', name: 'Eject', desc: 'Media Eject'},
{id: 'MAIL', name: 'Mail', desc: 'Mail'},
{id: 'CALC', name: 'Calc', desc: 'Calculator'},
{id: 'MYCM', name: 'My Computer', desc: 'My Computer'},
{id: 'WSCH', name: 'WWW Search', desc: 'WWW Search'},
{id: 'WHOM', name: 'WWW Home', desc: 'WWW Home'},
{id: 'WBAK', name: 'WWW Back', desc: 'WWW Back'},
{id: 'WFWD', name: 'WWW Forward', desc: 'WWW Forward'},
{id: 'WSTP', name: 'WWW Stop', desc: 'WWW Stop'},
{id: 'WREF', name: 'WWW Refresh', desc: 'WWW Refresh'},
{id: 'WFAV', name: 'WWW Favorites', desc: 'WWW Favorites'},
{id: 'RESERVED-187', name: 'RESERVED-187', desc: 'RESERVED-187'},
{id: 'RESERVED-188', name: 'RESERVED-188', desc: 'RESERVED-188'},
{id: 'RESERVED-189', name: 'RESERVED-189', desc: 'RESERVED-189'},
{id: 'RESERVED-190', name: 'RESERVED-190', desc: 'RESERVED-190'},
{id: 'RESERVED-191', name: 'RESERVED-191', desc: 'RESERVED-191'},
/* Fn key */
{id: 'FN0 ', name: 'L0', desc: 'Change to Layer 0(Momentary) '},
{id: 'FN1 ', name: 'L1', desc: 'Change to Layer 1(Momentary) '},
{id: 'FN2 ', name: 'L2', desc: 'Change to Layer 2(Momentary) '},
{id: 'FN3 ', name: 'L3', desc: 'Change to Layer 3(Momentary) '},
{id: 'FN4 ', name: 'T0', desc: 'Change to Layer 0(Toggle) '},
{id: 'FN5 ', name: 'T1', desc: 'Change to Layer 1(Toggle) '},
{id: 'FN6 ', name: 'T2', desc: 'Change to Layer 2(Toggle) '},
{id: 'FN7 ', name: 'T3', desc: 'Change to Layer 3(Toggle) '},
{id: 'FN8 ', name: 'TL0', desc: 'Change to Layer 0(Momentary with Tap Toggle) '},
{id: 'FN9 ', name: 'TL1', desc: 'Change to Layer 1(Momentary with Tap Toggle) '},
{id: 'FN10', name: 'TL2', desc: 'Change to Layer 2(Momentary with Tap Toggle) '},
{id: 'FN11', name: 'TL3', desc: 'Change to Layer 3(Momentary with Tap Toggle) '},

/*
{id: 'FN0 ', name: 'FN0 ', desc: 'FN0 '},
{id: 'FN1 ', name: 'FN1 ', desc: 'FN1 '},
{id: 'FN2 ', name: 'FN2 ', desc: 'FN2 '},
{id: 'FN3 ', name: 'FN3 ', desc: 'FN3 '},
{id: 'FN4 ', name: 'FN4 ', desc: 'FN4 '},
{id: 'FN5 ', name: 'FN5 ', desc: 'FN5 '},
{id: 'FN6 ', name: 'FN6 ', desc: 'FN6 '},
{id: 'FN7 ', name: 'FN7 ', desc: 'FN7 '},
{id: 'FN8 ', name: 'FN8 ', desc: 'FN8 '},
{id: 'FN9 ', name: 'FN9 ', desc: 'FN9 '},
{id: 'FN10', name: 'FN10', desc: 'FN10'},
{id: 'FN11', name: 'FN11', desc: 'FN11'},
*/
{id: 'FN12', name: 'FN12', desc: 'FN12'},
{id: 'FN13', name: 'FN13', desc: 'FN13'},
{id: 'FN14', name: 'FN14', desc: 'FN14'},
{id: 'FN15', name: 'FN15', desc: 'FN15'},
{id: 'FN16', name: 'FN16', desc: 'FN16'},
{id: 'FN17', name: 'FN17', desc: 'FN17'},
{id: 'FN18', name: 'FN18', desc: 'FN18'},
{id: 'FN19', name: 'FN19', desc: 'FN19'},
{id: 'FN20', name: 'FN20', desc: 'FN20'},
{id: 'FN21', name: 'FN21', desc: 'FN21'},
{id: 'FN22', name: 'FN22', desc: 'FN22'},
{id: 'FN23', name: 'FN23', desc: 'FN23'},
{id: 'FN24', name: 'FN24', desc: 'FN24'},
{id: 'FN25', name: 'FN25', desc: 'FN25'},
{id: 'FN26', name: 'FN26', desc: 'FN26'},
{id: 'FN27', name: 'FN27', desc: 'FN27'},
{id: 'FN28', name: 'FN28', desc: 'FN28'},
{id: 'FN29', name: 'FN29', desc: 'FN29'},
{id: 'FN30', name: 'FN30', desc: 'FN30'},
{id: 'FN31', name: 'FN31', desc: 'FN31'},

/* Standeard codes for 16bit Action
{id: 'RESERVED-165', name: 'RESERVED-165', desc: 'RESERVED-165'},
{id: 'RESERVED-166', name: 'RESERVED-166', desc: 'RESERVED-166'},
{id: 'RESERVED-167', name: 'RESERVED-167', desc: 'RESERVED-167'},
{id: 'RESERVED-168', name: 'RESERVED-168', desc: 'RESERVED-168'},
{id: 'RESERVED-169', name: 'RESERVED-169', desc: 'RESERVED-169'},
{id: 'RESERVED-170', name: 'RESERVED-170', desc: 'RESERVED-170'},
{id: 'RESERVED-171', name: 'RESERVED-171', desc: 'RESERVED-171'},
{id: 'RESERVED-172', name: 'RESERVED-172', desc: 'RESERVED-172'},
{id: 'RESERVED-173', name: 'RESERVED-173', desc: 'RESERVED-173'},
{id: 'RESERVED-174', name: 'RESERVED-174', desc: 'RESERVED-174'},
{id: 'RESERVED-175', name: 'RESERVED-175', desc: 'RESERVED-175'},

{id: 'KP_00', name: 'KP_00', desc: 'KP_00'},
{id: 'KP_000', name: 'KP_000', desc: 'KP_000'},
{id: 'THOUSANDS_SEPARATOR', name: 'THOUSANDS_SEPARATOR', desc: 'THOUSANDS_SEPARATOR'},
{id: 'DECIMAL_SEPARATOR', name: 'DECIMAL_SEPARATOR', desc: 'DECIMAL_SEPARATOR'},
{id: 'CURRENCY_UNIT', name: 'CURRENCY_UNIT', desc: 'CURRENCY_UNIT'},
{id: 'CURRENCY_SUB_UNIT', name: 'CURRENCY_SUB_UNIT', desc: 'CURRENCY_SUB_UNIT'},
{id: 'KP_LPAREN', name: 'KP_LPAREN', desc: 'KP_LPAREN'},
{id: 'KP_RPAREN', name: 'KP_RPAREN', desc: 'KP_RPAREN'},
{id: 'KP_LCBRACKET', name: 'KP_LCBRACKET', desc: 'KP_LCBRACKET'},
{id: 'KP_RCBRACKET', name: 'KP_RCBRACKET', desc: 'KP_RCBRACKET'},
{id: 'KP_TAB', name: 'KP_TAB', desc: 'KP_TAB'},
{id: 'KP_BSPACE', name: 'KP_BSPACE', desc: 'KP_BSPACE'},
{id: 'KP_A', name: 'KP_A', desc: 'KP_A'},
{id: 'KP_B', name: 'KP_B', desc: 'KP_B'},
{id: 'KP_C', name: 'KP_C', desc: 'KP_C'},
{id: 'KP_D', name: 'KP_D', desc: 'KP_D'},
{id: 'KP_E', name: 'KP_E', desc: 'KP_E'},
{id: 'KP_F', name: 'KP_F', desc: 'KP_F'},
{id: 'KP_XOR', name: 'KP_XOR', desc: 'KP_XOR'},
{id: 'KP_HAT', name: 'KP_HAT', desc: 'KP_HAT'},
{id: 'KP_PERC', name: 'KP_PERC', desc: 'KP_PERC'},
{id: 'KP_LT', name: 'KP_LT', desc: 'KP_LT'},
{id: 'KP_GT', name: 'KP_GT', desc: 'KP_GT'},
{id: 'KP_AND', name: 'KP_AND', desc: 'KP_AND'},
{id: 'KP_LAZYAND', name: 'KP_LAZYAND', desc: 'KP_LAZYAND'},
{id: 'KP_OR', name: 'KP_OR', desc: 'KP_OR'},
{id: 'KP_LAZYOR', name: 'KP_LAZYOR', desc: 'KP_LAZYOR'},
{id: 'KP_COLON', name: 'KP_COLON', desc: 'KP_COLON'},
{id: 'KP_HASH', name: 'KP_HASH', desc: 'KP_HASH'},
{id: 'KP_SPACE', name: 'KP_SPACE', desc: 'KP_SPACE'},
{id: 'KP_ATMARK', name: 'KP_ATMARK', desc: 'KP_ATMARK'},
{id: 'KP_EXCLAMATION', name: 'KP_EXCLAMATION', desc: 'KP_EXCLAMATION'},
{id: 'KP_MEM_STORE', name: 'KP_MEM_STORE', desc: 'KP_MEM_STORE'},
{id: 'KP_MEM_RECALL', name: 'KP_MEM_RECALL', desc: 'KP_MEM_RECALL'},
{id: 'KP_MEM_CLEAR', name: 'KP_MEM_CLEAR', desc: 'KP_MEM_CLEAR'},
{id: 'KP_MEM_ADD', name: 'KP_MEM_ADD', desc: 'KP_MEM_ADD'},
{id: 'KP_MEM_SUB', name: 'KP_MEM_SUB', desc: 'KP_MEM_SUB'},
{id: 'KP_MEM_MUL', name: 'KP_MEM_MUL', desc: 'KP_MEM_MUL'},
{id: 'KP_MEM_DIV', name: 'KP_MEM_DIV', desc: 'KP_MEM_DIV'},
{id: 'KP_PLUS_MINUS', name: 'KP_PLUS_MINUS', desc: 'KP_PLUS_MINUS'},
{id: 'KP_CLEAR', name: 'KP_CLEAR', desc: 'KP_CLEAR'},
{id: 'KP_CLEAR_ENTRY', name: 'KP_CLEAR_ENTRY', desc: 'KP_CLEAR_ENTRY'},
{id: 'KP_BINARY', name: 'KP_BINARY', desc: 'KP_BINARY'},
{id: 'KP_OCTAL', name: 'KP_OCTAL', desc: 'KP_OCTAL'},
{id: 'KP_DECIMAL', name: 'KP_DECIMAL', desc: 'KP_DECIMAL'},
{id: 'KP_HEXADECIMAL', name: 'KP_HEXADECIMAL', desc: 'KP_HEXADECIMAL'},
{id: 'RESERVED-222', name: 'RESERVED-222', desc: 'RESERVED-222'},
{id: 'RESERVED-223', name: 'RESERVED-223', desc: 'RESERVED-223'},
*/

{id: 'LCTL', name: 'LCtrl', desc: 'Left Control'},
{id: 'LSFT', name: 'LShift', desc: 'Left Shift'},
{id: 'LALT', name: 'LAlt', desc: 'Left Alt(\u2325)'},
{id: 'LGUI', name: 'LGui', desc: 'Left Windows(\u2318)'},
{id: 'RCTL', name: 'RCtrl', desc: 'Right Control'},
{id: 'RSFT', name: 'RShift', desc: 'Right Shift'},
{id: 'RALT', name: 'RAlt', desc: 'Right Alt(\u2325)'},
{id: 'RGUI', name: 'RGui', desc: 'Right Windows(\u2318)'},

/* Special codes E8-FF */
{id: 'RESERVED-232', name: 'RESERVED-232', desc: 'RESERVED-232'},
{id: 'RESERVED-233', name: 'RESERVED-233', desc: 'RESERVED-233'},
{id: 'RESERVED-234', name: 'RESERVED-234', desc: 'RESERVED-234'},
{id: 'RESERVED-235', name: 'RESERVED-235', desc: 'RESERVED-235'},
{id: 'RESERVED-236', name: 'RESERVED-236', desc: 'RESERVED-236'},
{id: 'RESERVED-237', name: 'RESERVED-237', desc: 'RESERVED-237'},
{id: 'RESERVED-238', name: 'RESERVED-238', desc: 'RESERVED-238'},
{id: 'RESERVED-239', name: 'RESERVED-239', desc: 'RESERVED-239'},
/* Mousekey */
{id: 'MS_U', name: 'MS_UP', desc: 'MS_UP'},
{id: 'MS_D', name: 'MS_DOWN', desc: 'MS_DOWN'},
{id: 'MS_L', name: 'MS_LEFT', desc: 'MS_LEFT'},
{id: 'MS_R', name: 'MS_RIGHT', desc: 'MS_RIGHT'},
{id: 'BTN1', name: 'MS_BTN1', desc: 'MS_BTN1'},
{id: 'BTN2', name: 'MS_BTN2', desc: 'MS_BTN2'},
{id: 'BTN3', name: 'MS_BTN3', desc: 'MS_BTN3'},
{id: 'BTN4', name: 'MS_BTN4', desc: 'MS_BTN4'},
{id: 'BTN5', name: 'MS_BTN5', desc: 'MS_BTN5'},
{id: 'WH_U', name: 'MS_WH_UP', desc: 'MS_WH_UP'},
{id: 'WH_D', name: 'MS_WH_DOWN', desc: 'MS_WH_DOWN'},
{id: 'WH_L', name: 'MS_WH_LEFT', desc: 'MS_WH_LEFT'},
{id: 'WH_R', name: 'MS_WH_RIGHT', desc: 'MS_WH_RIGHT'},
{id: 'ACL0', name: 'MS_ACCEL0', desc: 'MS_ACCEL0'},
{id: 'ACL1', name: 'MS_ACCEL1', desc: 'MS_ACCEL1'},
{id: 'ACL2', name: 'MS_ACCEL2', desc: 'MS_ACCEL2'},
];

+ 642
- 0
editor/hhkb/index.html View File

@@ -0,0 +1,642 @@
<html>
<head>
<title>Keymap Editor</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="codes.js"></script>
<link href='keyboard.css' rel='stylesheet' type='text/css'>
<script>
/* HHKB pro keymap editor
*
* Key matrix:
* COL 0 1 2 3 4 5 6 7
* ROW,---------------------------------------------------------------
* 0| 2 q w s a z x c
* 1| 3 4 r e d f v b
* 2| 5 6 y t g h n _NONE_
* 3| 1 Esc Tab Control LShift LAlt LMeta Space
* 4| 7 8 u i k j m _NONE_
* 5| \ ` Delete Return Fn RShift RAlt RMeta
* 6| 9 0 o p ; l , _NONE_
* 7| - + ] [ ' / . _NONE_
*
* Default keymap
* ,-----------------------------------------------------------.
* |Esc| 1| 2| 3| 4| 5| 6| 7| 8| 9| 0| -| =| \| `|
* |-----------------------------------------------------------|
* |Tab | Q| W| E| R| T| Y| U| I| O| P| [| ]|Backs|
* |-----------------------------------------------------------|
* |Contro| A| S| D| F| G| H| J| K| L| ;| '|Enter |
* |-----------------------------------------------------------|
* |Shift | Z| X| C| V| B| N| M| ,| .| /|Shift |Fn |
* `-----------------------------------------------------------'
* |Gui|Alt | Space |Alt |Gui|
* `-------------------------------------------'
* ,-----------------------------------------------------------.
* |Esc| F1| F2| F3| F4| F5| F6| F7| F8| F9|F10|F11|F12|Ins|Del|
* |-----------------------------------------------------------|
* |Caps | | | | | | | |Psc|Slk|Pus|Up | |Backs|
* |-----------------------------------------------------------|
* |Contro|VoD|VoU|Mut| | | *| /|Hom|PgU|Lef|Rig|Enter |
* |-----------------------------------------------------------|
* |Shift | | | | | | +| -|End|PgD|Dow|Shift |Fn |
* `-----------------------------------------------------------'
* |Gui|Alt | Space |Alt |Gui|
* `-------------------------------------------'
*/
var no_map = function() { return [
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0],
]; };
var transparent_map = function() { return [
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1],
]; };

// default keymap
var keymaps = [
[
[ 0x1f,0x14,0x1a,0x16,0x04,0x1d,0x1b,0x06, ],
[ 0x20,0x21,0x15,0x08,0x07,0x09,0x19,0x05, ],
[ 0x22,0x23,0x1c,0x17,0x0a,0x0b,0x11,0x00, ],
[ 0x1e,0x29,0x2b,0xe0,0xe1,0xe3,0xe2,0x2c, ],
[ 0x24,0x25,0x18,0x0c,0x0e,0x0d,0x10,0x00, ],
[ 0x31,0x35,0x2a,0x28,0xc1,0xe5,0xe7,0xe6, ],
[ 0x26,0x27,0x12,0x13,0x33,0x0f,0x36,0x00, ],
[ 0x2d,0x2e,0x30,0x2f,0x34,0x38,0x37,0x00, ],
],
[
[ 0x3b,0x00,0x00,0xa9,0xaa,0x00,0x00,0x00, ],
[ 0x3c,0x3d,0x00,0x00,0xa8,0x00,0x00,0x00, ],
[ 0x3e,0x3f,0x00,0x00,0x00,0x55,0x57,0x00, ],
[ 0x3a,0x01,0x39,0x01,0x01,0x01,0x01,0x01, ],
[ 0x40,0x41,0x00,0x46,0x4a,0x54,0x56,0x00, ],
[ 0x49,0x4c,0x01,0x58,0x01,0x01,0x01,0x01, ],
[ 0x42,0x43,0x47,0x48,0x50,0x4b,0x4d,0x00, ],
[ 0x44,0x45,0x00,0x52,0x4f,0x51,0x4e,0x00, ]
],
no_map(),
no_map(),
];

// key id under editing
var editing_key;
// layer under editing
var editing_layer = 0;

$(function() {
// TODO: alert when leave or close window

// load keymap on keyboard key buttons
var load_keymap = function(layer, keymap) {
for (var row in keymap) {
for (var col in keymap[row]) {
var code = keymap[row][col];
var key = code_display[code];
$("#key-0" + row + "0" + col).text(key.name);
$("#key-0" + row + "0" + col).attr({ title: key.desc });
}
}
};

// load default keymap on startup
load_keymap(0, keymaps[0]);

/*
* Layer selector
*/
$("#layer_radio").buttonset();

// layer change
$(".layer").click(function(ev, ui) {
var layer = parseInt($(this).attr('id').match(/layer-(\d+)/)[1]);
editing_layer = layer;
load_keymap(layer, keymaps[layer]);
});

/*
* Keyboard display(key buttons)
*/
// Select key button to edit
$(".key").click(function(ev, ui) {
editing_key = $(this).attr('id');

// grey-out key to indicate being under editing
$(".key").removeClass("key-editing");
$(this).addClass("key-editing");
});

/*
* Keycodes button tab
*/
$("#keycode_tabs").tabs({
heightStyle: "auto",
});

// Keycodes: read name and description from code table
$(".action").each(function(index) {
// get code from code button id: code-[0x]CCCC where CCCC is dec or hex number
var code = parseInt($(this).attr('id').match(/code-((0x){0,1}[0-9a-fA-F]+)/)[1]);
$(this).text(code_display[code].name);
$(this).attr({ title: code_display[code].desc });
//console.log(index + ": " + code + " " + code_display[code].desc);
});

$(".action").click(function(ev,ui) {
if (!editing_key) return;

// get matrix position from key id: key-RRCC where RR is row and CC is column in dec
var pos = editing_key.match(/key-(\d\d)(\d\d)/i);
if (!pos) return;
var row = parseInt(pos[1]), col = parseInt(pos[2]);

// set text and tooltip to key button under editing
$("#" + editing_key).text($(this).text());
$("#" + editing_key).attr({ title: $(this).attr('title'), });

// change keymap array
// get code from keycode button id: code-[0x]CC where CC is dec or hex number
var code = $(this).attr('id').match(/code-((0x){0,1}[0-9a-fA-F]+)/)[1];
keymaps[editing_layer][row][col] = parseInt(code);
});

/*
* Output options
*/
//$("#keymap-source").resizable(); // resizable textarea

// TODO: Hex output
$("#keymap-hex-generate").click(function(ev, ui) {
$("#keymap-source").text(hex_output(keymaps));
});

// C source output
$("#keymap-source-generate").click(function(ev, ui) {
$("#keymap-source").text(source_output(keymaps));
});

// JSON output
$("#keymap-json-generate").click(function(ev, ui) {
var keymap_output;
//keymap_output = JSON.stringify(keymaps, null, 4);
keymap_output = JSON.stringify({ keymaps: keymaps });
$("#keymap-source").text(keymap_output);
});

});
</script>
</head>

<body>
<h1>TMK Keymap Editor</h1>
See <a href="https://github.com/tmk/tmk_keyboard/blob/master/doc/keymap.md" target="_blank">this</a> for keymap description.

<h2>Keyboard</h2>
<!--
Layer selector
-->
<form>
<div id="layer_radio">
<input type="radio" name="radio" class="layer" id="layer-0"checked="checked" /><label for="layer-0">Layer 0</label>
<input type="radio" name="radio" class="layer" id="layer-1"/><label for="layer-1">Layer 1</label>
<input type="radio" name="radio" class="layer" id="layer-2"/><label for="layer-2">Layer 2</label>
<input type="radio" name="radio" class="layer" id="layer-3"/><label for="layer-3">Layer 3</label>
</div>
</form>

<!-- TODO: set all key to NO or TRANS -->
<!-- TODO: copy layer -->

<!--
Keyboard keys
-->
<div class="keyboard">
<div id="key-0301" class="key">Esc</div>
<div id="key-0300" class="key">1</div>
<div id="key-0000" class="key">2</div>
<div id="key-0100" class="key">3</div>
<div id="key-0101" class="key">4</div>
<div id="key-0200" class="key">5</div>
<div id="key-0201" class="key">6</div>
<div id="key-0400" class="key">7</div>
<div id="key-0401" class="key">8</div>
<div id="key-0600" class="key">9</div>
<div id="key-0601" class="key">0</div>
<div id="key-0700" class="key">-</div>
<div id="key-0701" class="key">=</div>
<div id="key-0500" class="key">\</div>
<div id="key-0501" class="key">`</div>
<br class="clear" />

<div id="key-0302" class="key btn150">Tab</div>
<div id="key-0001" class="key">Q</div>
<div id="key-0002" class="key">W</div>
<div id="key-0103" class="key">E</div>
<div id="key-0102" class="key">R</div>
<div id="key-0203" class="key">T</div>
<div id="key-0202" class="key">Y</div>
<div id="key-0402" class="key">U</div>
<div id="key-0403" class="key">I</div>
<div id="key-0602" class="key">O</div>
<div id="key-0603" class="key">P</div>
<div id="key-0703" class="key">[</div>
<div id="key-0702" class="key">]</div>
<div id="key-0502" class="key btn150">BSpc</div>
<br class="clear" />

<div id="key-0303" class="key btn175">Ctrl</div>
<div id="key-0004" class="key">A</div>
<div id="key-0003" class="key">S</div>
<div id="key-0104" class="key">D</div>
<div id="key-0105" class="key">F</div>
<div id="key-0204" class="key">G</div>
<div id="key-0205" class="key">H</div>
<div id="key-0405" class="key">J</div>
<div id="key-0404" class="key">K</div>
<div id="key-0605" class="key">L</div>
<div id="key-0604" class="key">;</div>
<div id="key-0704" class="key">'</div>
<div id="key-0503" class="key btn225">Enter</div>
<br class="clear" />

<div id="key-0304" class="key btn225">Shift</div>
<div id="key-0005" class="key">Z</div>
<div id="key-0006" class="key">X</div>
<div id="key-0007" class="key">C</div>
<div id="key-0106" class="key">V</div>
<div id="key-0107" class="key">B</div>
<div id="key-0206" class="key">N</div>
<div id="key-0406" class="key">M</div>
<div id="key-0606" class="key">,</div>
<div id="key-0706" class="key">.</div>
<div id="key-0705" class="key">/</div>
<div id="key-0505" class="key btn175">Shift</div>
<div id="key-0504" class="key">Fn</div>
<br class="clear" />

<div class="key spc150"></div>
<div id="key-0305" class="key">Sup</div>
<div id="key-0306" class="key btn150">Alt</div>
<div id="key-0307" class="key btn600"></div>
<div id="key-0507" class="key btn150">Alt</div>
<div id="key-0506" class="key">Sup</div>
<div class="key spc150"></div>
<div class="key spc100"></div>
<br class="clear" />
</div>


<!--
Keycodes
TODO: make display name and tooltip better
TODO: better align of buttons
TODO: get text and title from code table?
-->
<h2>Keycodes</h2>
<div id="keycode_tabs">
<ul>
<li><a href="#tabs-1">Main</a></li>
<li><a href="#tabs-2">Function and Navigation</a></li>
<li><a href="#tabs-3">Keypad</a></li>
<li><a href="#tabs-4">Media and System</a></li>
<li><a href="#tabs-5">Layer</a></li>
</ul>

<!-- Main -->
<div id="tabs-1">
<button class="action" id="code-0">NO</button>
<button class="action" id="code-1">TRNS</button>
<br/>
<button class="action" id="code-4" title="A">A</button>
<button class="action" id="code-5" title="B">B</button>
<button class="action" id="code-6" title="C">C</button>
<button class="action" id="code-7" title="D">D</button>
<button class="action" id="code-8" title="E">E</button>
<button class="action" id="code-9" title="F">F</button>
<button class="action" id="code-10" title="G">G</button>
<button class="action" id="code-11" title="H">H</button>
<button class="action" id="code-12" title="I">I</button>
<button class="action" id="code-13" title="J">J</button>
<button class="action" id="code-14" title="K">K</button>
<button class="action" id="code-15" title="L">L</button>
<button class="action" id="code-16" title="M">M</button>
<button class="action" id="code-17" title="N">N</button>
<button class="action" id="code-18" title="O">O</button>
<button class="action" id="code-19" title="P">P</button>
<button class="action" id="code-20" title="Q">Q</button>
<button class="action" id="code-21" title="R">R</button>
<button class="action" id="code-22" title="S">S</button>
<button class="action" id="code-23" title="T">T</button>
<button class="action" id="code-24" title="U">U</button>
<button class="action" id="code-25" title="V">V</button>
<button class="action" id="code-26" title="W">W</button>
<button class="action" id="code-27" title="X">X</button>
<button class="action" id="code-28" title="Y">Y</button>
<button class="action" id="code-29" title="Z">Z</button>
<br/>
<button class="action" id="code-30" title="1">1</button>
<button class="action" id="code-31" title="2">2</button>
<button class="action" id="code-32" title="3">3</button>
<button class="action" id="code-33" title="4">4</button>
<button class="action" id="code-34" title="5">5</button>
<button class="action" id="code-35" title="6">6</button>
<button class="action" id="code-36" title="7">7</button>
<button class="action" id="code-37" title="8">8</button>
<button class="action" id="code-38" title="9">9</button>
<button class="action" id="code-39" title="0">0</button>
<br/>
<button class="action" id="code-45" title="MINUS">MINUS</button>
<button class="action" id="code-46" title="EQUAL">EQUAL</button>
<button class="action" id="code-47" title="LBRACKET">LBRACKET</button>
<button class="action" id="code-48" title="RBRACKET">RBRACKET</button>
<button class="action" id="code-49" title="BSLASH">BSLASH</button>
<button class="action" id="code-51" title="SCOLON">SCOLON</button>
<button class="action" id="code-52" title="QUOTE">QUOTE</button>
<button class="action" id="code-53" title="GRAVE">GRAVE</button>
<button class="action" id="code-54" title="COMMA">COMMA</button>
<button class="action" id="code-55" title="DOT">DOT</button>
<button class="action" id="code-56" title="SLASH">SLASH</button>
<br/>
<button class="action" id="code-40" title="ENTER">ENTER</button>
<button class="action" id="code-41" title="ESCAPE">ESCAPE</button>
<button class="action" id="code-42" title="BackSpace">BSPACE</button>
<button class="action" id="code-43" title="TAB">TAB</button>
<button class="action" id="code-44" title="SPACE">SPACE</button>
<button class="action" id="code-57" title="CAPSLOCK">CAPSLOCK</button>
<button class="action" id="code-101" title="APPLICATION">APPLICATION</button>
<br/>
<button class="action" id="code-50" title="NONUS_HASH">NONUS_HASH</button>
<button class="action" id="code-100" title="NONUS_BSLASH">NONUS_BSLASH</button>
<br/>
Modifier:
<button class="action" id="code-224" title="LCTRL">LCTRL</button>
<button class="action" id="code-225" title="LSHIFT">LSHIFT</button>
<button class="action" id="code-226" title="LALT">LALT</button>
<button class="action" id="code-227" title="LGUI">LGUI</button>
<button class="action" id="code-228" title="RCTRL">RCTRL</button>
<button class="action" id="code-229" title="RSHIFT">RSHIFT</button>
<button class="action" id="code-230" title="RALT">RALT</button>
<button class="action" id="code-231" title="RGUI">RGUI</button>
<br/>
</div>

<!-- Function and Navigation -->
<div id="tabs-2">
<button class="action" id="code-58" title="F1">F1</button>
<button class="action" id="code-59" title="F2">F2</button>
<button class="action" id="code-60" title="F3">F3</button>
<button class="action" id="code-61" title="F4">F4</button>
<button class="action" id="code-62" title="F5">F5</button>
<button class="action" id="code-63" title="F6">F6</button>
<button class="action" id="code-64" title="F7">F7</button>
<button class="action" id="code-65" title="F8">F8</button>
<button class="action" id="code-66" title="F9">F9</button>
<button class="action" id="code-67" title="F10">F10</button>
<button class="action" id="code-68" title="F11">F11</button>
<button class="action" id="code-69" title="F12">F12</button>
<br/>
<button class="action" id="code-104" title="F13">F13</button>
<button class="action" id="code-105" title="F14">F14</button>
<button class="action" id="code-106" title="F15">F15</button>
<button class="action" id="code-107" title="F16">F16</button>
<button class="action" id="code-108" title="F17">F17</button>
<button class="action" id="code-109" title="F18">F18</button>
<button class="action" id="code-110" title="F19">F19</button>
<button class="action" id="code-111" title="F20">F20</button>
<button class="action" id="code-112" title="F21">F21</button>
<button class="action" id="code-113" title="F22">F22</button>
<button class="action" id="code-114" title="F23">F23</button>
<button class="action" id="code-115" title="F24">F24</button>
<br/>
<br/>
<button class="action" id="code-70" title="PSCREEN">PSCREEN</button>
<button class="action" id="code-71" title="SCROLLLOCK">SCROLLLOCK</button>
<button class="action" id="code-72" title="PAUSE">PAUSE</button>
<br/>
<button class="action" id="code-73" title="INSERT">INSERT</button>
<button class="action" id="code-74" title="HOME">HOME</button>
<button class="action" id="code-75" title="PGUP">PGUP</button>
<br/>
<button class="action" id="code-76" title="DELETE">DELETE</button>
<button class="action" id="code-77" title="END">END</button>
<button class="action" id="code-78" title="PGDOWN">PGDOWN</button>
<br/>
<button class="action" id="code-80" title="LEFT">LEFT</button>
<button class="action" id="code-81" title="DOWN">DOWN</button>
<button class="action" id="code-82" title="UP">UP</button>
<button class="action" id="code-79" title="RIGHT">RIGHT</button>
</div>

<!-- Keypad -->
<div id="tabs-3">
<button class="action" id="code-83" title="NUMLOCK">NUMLOCK</button>
<button class="action" id="code-84" title="KP_SLASH">KP_SLASH</button>
<button class="action" id="code-85" title="KP_ASTERISK">KP_ASTERISK</button>
<button class="action" id="code-86" title="KP_MINUS">KP_MINUS</button>
<button class="action" id="code-87" title="KP_PLUS">KP_PLUS</button>
<button class="action" id="code-88" title="KP_ENTER">KP_ENTER</button>
<button class="action" id="code-99" title="KP_DOT">KP_DOT</button>
<button class="action" id="code-103" title="KP_EQUAL">KP_EQUAL</button>
<button class="action" id="code-133" title="KP_COMMA">KP_COMMA</button>
<button class="action" id="code-134" title="KP_EQUAL_AS400">KP_EQUAL_AS400</button>
<br/>
<button class="action" id="code-89" title="KP_1">KP_1</button>
<button class="action" id="code-90" title="KP_2">KP_2</button>
<button class="action" id="code-91" title="KP_3">KP_3</button>
<button class="action" id="code-92" title="KP_4">KP_4</button>
<button class="action" id="code-93" title="KP_5">KP_5</button>
<button class="action" id="code-94" title="KP_6">KP_6</button>
<button class="action" id="code-95" title="KP_7">KP_7</button>
<button class="action" id="code-96" title="KP_8">KP_8</button>
<button class="action" id="code-97" title="KP_9">KP_9</button>
<button class="action" id="code-98" title="KP_0">KP_0</button>
<br/>
<br/>
Japanese:
<button class="action" id="code-135" title="INT1">INT1</button>
<button class="action" id="code-136" title="INT2">INT2</button>
<button class="action" id="code-137" title="INT3">INT3</button>
<button class="action" id="code-138" title="INT4">INT4</button>
<button class="action" id="code-139" title="INT5">INT5</button>
<!--
<br/>
<button class="action" id="code-140" title="INT6">INT6</button>
<button class="action" id="code-141" title="INT7">INT7</button>
<button class="action" id="code-142" title="INT8">INT8</button>
<button class="action" id="code-143" title="INT9">INT9</button>
-->
<!--
<br/>
<button class="action" id="code-144" title="LANG1">LANG1</button>
<button class="action" id="code-145" title="LANG2">LANG2</button>
<button class="action" id="code-146" title="LANG3">LANG3</button>
<button class="action" id="code-147" title="LANG4">LANG4</button>
<button class="action" id="code-148" title="LANG5">LANG5</button>
<button class="action" id="code-149" title="LANG6">LANG6</button>
<button class="action" id="code-150" title="LANG7">LANG7</button>
<button class="action" id="code-151" title="LANG8">LANG8</button>
<button class="action" id="code-152" title="LANG9">LANG9</button>
-->

<!--
<br/>
<br/>
<button class="action" id="code-116" title="EXECUTE">EXECUTE</button>
<button class="action" id="code-117" title="HELP">HELP</button>
<button class="action" id="code-118" title="MENU">MENU</button>
<button class="action" id="code-119" title="SELECT">SELECT</button>
<button class="action" id="code-120" title="STOP">STOP</button>
<button class="action" id="code-121" title="AGAIN">AGAIN</button>
<button class="action" id="code-122" title="UNDO">UNDO</button>
<button class="action" id="code-123" title="CUT">CUT</button>
<button class="action" id="code-124" title="COPY">COPY</button>
<button class="action" id="code-125" title="PASTE">PASTE</button>
<button class="action" id="code-126" title="FIND">FIND</button>
<button class="action" id="code-127" title="_MUTE">_MUTE</button>
<button class="action" id="code-128" title="_VOLUP">_VOLUP</button>
<button class="action" id="code-129" title="_VOLDOWN">_VOLDOWN</button>
-->

<!--
<br/>
<button class="action" id="code-102" title="POWER">POWER</button>
<button class="action" id="code-153" title="ALT_ERASE">ALT_ERASE</button>
<button class="action" id="code-154" title="SYSREQ">SYSREQ</button>
<button class="action" id="code-155" title="CANCEL">CANCEL</button>
<button class="action" id="code-156" title="CLEAR">CLEAR</button>
<button class="action" id="code-157" title="PRIOR">PRIOR</button>
<button class="action" id="code-158" title="RETURN">RETURN</button>
<button class="action" id="code-159" title="SEPARATOR">SEPARATOR</button>
<button class="action" id="code-160" title="OUT">OUT</button>
<button class="action" id="code-161" title="OPER">OPER</button>
<button class="action" id="code-162" title="CLEAR_AGAIN">CLEAR_AGAIN</button>
<button class="action" id="code-163" title="CRSEL">CRSEL</button>
<button class="action" id="code-164" title="EXSEL">EXSEL</button>
-->
</div>

<!-- Media and System -->
<div id="tabs-4">
<button class="action" id="code-165"></button>
<button class="action" id="code-166"></button>
<button class="action" id="code-167"></button>

<br/>
<br/>
<button class="action" id="code-168"></button>
<button class="action" id="code-169"></button>
<button class="action" id="code-170"></button>
<button class="action" id="code-171"></button>
<button class="action" id="code-172"></button>
<button class="action" id="code-173"></button>
<button class="action" id="code-174"></button>
<button class="action" id="code-175"></button>
<button class="action" id="code-176"></button>
<button class="action" id="code-177"></button>
<button class="action" id="code-178"></button>
<button class="action" id="code-179"></button>

<br/>
<br/>
<button class="action" id="code-180"></button>
<button class="action" id="code-181"></button>
<button class="action" id="code-182"></button>
<button class="action" id="code-183"></button>
<button class="action" id="code-184"></button>
<button class="action" id="code-185"></button>
<button class="action" id="code-186"></button>

<!--
<button class="action" id="code-187"></button>
<button class="action" id="code-188"></button>
<button class="action" id="code-189"></button>
<button class="action" id="code-190"></button>
<button class="action" id="code-191"></button>
-->

<br/>
<br/>
<button class="action" id="code-130" title="LOCKING_CAPS">LOCKING_CAPS</button>
<button class="action" id="code-131" title="LOCKING_NUM">LOCKING_NUM</button>
<button class="action" id="code-132" title="LOCKING_SCROLL">LOCKING_SCROLL</button>
</div>

<!-- Layer -->
<div id="tabs-5">
<!-- TODO: layer actions -->
<!-- FN0-31 -->
<h3>Layer Switch</h3>
Momentary:
<button class="action" id="code-192"></button>
<button class="action" id="code-193"></button>
<button class="action" id="code-194"></button>
<button class="action" id="code-195"></button>
<br/>
Toggle:
<button class="action" id="code-196"></button>
<button class="action" id="code-197"></button>
<button class="action" id="code-198"></button>
<button class="action" id="code-199"></button>
<br/>
Momentary with Tap Toggle:
<button class="action" id="code-200"></button>
<button class="action" id="code-201"></button>
<button class="action" id="code-202"></button>
<button class="action" id="code-203"></button>
<br/>
<p>See <a href="https://github.com/tmk/tmk_keyboard/blob/master/doc/keymap.md#3-layer-switching-example" target="_blank">this</a> for detail of layer switching.</p>

<!--
<button class="action" id="code-204"></button>
<button class="action" id="code-205"></button>
<button class="action" id="code-206"></button>
<button class="action" id="code-207"></button>
<br/>
<button class="action" id="code-208"></button>
<button class="action" id="code-209"></button>
<button class="action" id="code-210"></button>
<button class="action" id="code-211"></button>
<button class="action" id="code-212"></button>
<button class="action" id="code-213"></button>
<button class="action" id="code-214"></button>
<button class="action" id="code-215"></button>
<br/>
<button class="action" id="code-216"></button>
<button class="action" id="code-217"></button>
<button class="action" id="code-218"></button>
<button class="action" id="code-219"></button>
<button class="action" id="code-220"></button>
<button class="action" id="code-221"></button>
<button class="action" id="code-222"></button>
<button class="action" id="code-223"></button>
-->
</div>
</div>

<h3>Keymap Output:</h3>
<textarea id="keymap-source" rows="20" cols="80"></textarea>
<br/>
<button id="keymap-source-generate" title="generate C source code">C source</button>
<button id="keymap-json-generate" title="generate JSON">JSON</button>
<button id="keymap-hex-generate" title="generate Hex">Hex</button>
<!-- TODO: Hex/load JSON -->
<!--
<button id="keymap-json-load" title="generate JSON">Load JSON</button>
-->

</body>
</html>

+ 82
- 0
editor/hhkb/keyboard.css View File

@@ -0,0 +1,82 @@
.key {
-moz-box-shadow:inset -8px -10px 0px -3px #ffffff;
-webkit-box-shadow:inset -8px -10px 0px -3px #ffffff;
box-shadow:inset -8px -10px 0px -3px #ffffff;
background-color:#ededed;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
border:2px solid #dcdcdc;
display:block;
float: left;
color:#777777;
font-family:arial;
font-size:16px;
font-weight:bold;
text-decoration:none;
padding:4px 16px 16px 4px;
width: 24px;
height: 24px;
overflow: hidden;
margin: 1px;
}
.key:hover {
background-color:#dfdfdf;
}
.key:active {
position:relative;
top:1px;
}
.key-editing {
background-color:#b4b4b4;
position:relative;
top:2px;
}
/* This imageless css button was generated by CSSButtonGenerator.com */

/* Key size and pixel
* key: 1.00 1.25 1.50 1.75 2.00
* size: 50 62.5 75 87.5 100
* width: 24 36.5 49 61.5 74
*
* margin:1 + border:2 + padding:4 + width:24 + padding:16 + border:2 + margin:1 = 50px
* width:24 + 26px = 50px
*/
.btn100 { width:24px; }
.btn125 { width:36.5px; }
.btn150 { width:49px; }
.btn175 { width:61.5px; }
.btn200 { width:74px; }
.btn225 { width:86.5px; }
.btn250 { width:99px; }
.btn275 { width:111.5px; }
.btn600 { width:274px; }
.btn625 { width:286.5px; }
.btn700 { width:324px; }

.spc100 { width:24px; visibility:hidden; }
.spc125 { width:36.5px; visibility:hidden; }
.spc150 { width:49px; visibility:hidden; }
.spc175 { width:61.5px; visibility:hidden; }
.spc200 { width 74px; visibility:hidden; }

.clear {
clear: left;
}

.keyboard {
width: 1000px;
overflow: auto;
}

#keycodes {
font-size:12px;
font-weight:bold;
width: 200px;
}

/* http://www.w3schools.com/cssref/css3_pr_resize.asp */
.resizable {
resize: both;
overflow: auto;
}

Write Preview
Loading…
Cancel
Save