updates to keyboard handler
This commit is contained in:
rolux
parent
a5fc65833d
commit
b6fdf0c28b
1 changed files with 73 additions and 146 deletions
|
|
@ -6,129 +6,47 @@
|
||||||
(function() {
|
(function() {
|
||||||
|
|
||||||
var buffer = '',
|
var buffer = '',
|
||||||
bufferTime = 0,
|
// the dot notation ('0.numpad') makes the keyboard event ('key_0.numpad')
|
||||||
bufferTimeout = 1000,
|
// namespaced, so that binding to 'key_0' will catch 'key_0.numpad' too
|
||||||
// wrapped in function so it can be collapsed in text editor
|
keyNames = {
|
||||||
keyNames = (function() {
|
0: 'section', 8: 'backspace', 9: 'tab', 12: 'clear', 13: 'enter',
|
||||||
return {
|
16: 'shift', 17: 'control', 18: 'alt', 20: 'capslock', 27: 'escape',
|
||||||
0: 'section',
|
32: 'space', 33: 'pageup', 34: 'pagedown', 35: 'end', 36: 'home',
|
||||||
8: 'backspace',
|
37: 'left', 38: 'up', 39: 'right', 40: 'down',
|
||||||
9: 'tab',
|
45: 'insert', 46: 'delete', 47: 'help',
|
||||||
12: 'clear',
|
48: '0', 49: '1', 50: '2', 51: '3', 52: '4',
|
||||||
13: 'enter',
|
53: '5', 54: '6', 55: '7', 56: '8', 57: '9',
|
||||||
16: 'shift',
|
65: 'a', 66: 'b', 67: 'c', 68: 'd', 69: 'e',
|
||||||
17: 'control',
|
70: 'f', 71: 'g', 72: 'h', 73: 'i', 74: 'j',
|
||||||
18: 'alt',
|
75: 'k', 76: 'l', 77: 'm', 78: 'n', 79: 'o',
|
||||||
20: 'capslock',
|
80: 'p', 81: 'q', 82: 'r', 83: 's', 84: 't',
|
||||||
27: 'escape',
|
85: 'u', 86: 'v', 87: 'w', 88: 'x', 89: 'y', 90: 'z',
|
||||||
32: 'space',
|
// fixme: this is usually 91: window.left, 92: window.right, 93: select
|
||||||
33: 'pageup',
|
91: 'meta.left', 92: 'meta.right', 93: 'meta.right',
|
||||||
34: 'pagedown',
|
96: '0.numpad', 97: '1.numpad', 98: '2.numpad', 99: '3.numpad',
|
||||||
35: 'end',
|
100: '4.numpad', 101: '5.numpad', 102: '6.numpad', 103: '7.numpad',
|
||||||
36: 'home',
|
104: '8.numpad', 105: '9.numpad', 106: 'asterisk.numpad', 107: 'plus.numpad',
|
||||||
37: 'left',
|
109: 'minus.numpad', 108: 'enter.numpad', 110: 'dot.numpad', 111: 'slash.numpad',
|
||||||
38: 'up',
|
112: 'f1', 113: 'f2', 114: 'f3', 115: 'f4', 116: 'f5',
|
||||||
39: 'right',
|
117: 'f6', 118: 'f7', 119: 'f8', 120: 'f9', 121: 'f10',
|
||||||
40: 'down',
|
122: 'f11', 123: 'f12', 124: 'f13', 125: 'f14', 126: 'f15', 127: 'f16',
|
||||||
45: 'insert',
|
144: 'numlock', 145: 'scrolllock',
|
||||||
46: 'delete',
|
186: 'semicolon', 187: 'equal', 188: 'comma', 189: 'minus',
|
||||||
47: 'help',
|
190: 'dot', 191: 'slash', 192: 'backtick', 219: 'openbracket',
|
||||||
48: '0',
|
220: 'backslash', 221: 'closebracket', 222: 'quote', 224: 'meta'
|
||||||
49: '1',
|
// see dojo, for ex.
|
||||||
50: '2',
|
},
|
||||||
51: '3',
|
// meta comes last so that we can differentiate between
|
||||||
52: '4',
|
// alt_control_shift_meta.left and alt_control_shift_meta.right
|
||||||
53: '5',
|
|
||||||
54: '6',
|
|
||||||
55: '7',
|
|
||||||
56: '8',
|
|
||||||
57: '9',
|
|
||||||
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: 'meta.left',
|
|
||||||
//92: 'meta.right',
|
|
||||||
91: 'meta',
|
|
||||||
//92: 'meta',
|
|
||||||
93: 'meta',
|
|
||||||
96: '0.numpad',
|
|
||||||
97: '1.numpad',
|
|
||||||
98: '2.numpad',
|
|
||||||
99: '3.numpad',
|
|
||||||
100: '4.numpad',
|
|
||||||
101: '5.numpad',
|
|
||||||
102: '6.numpad',
|
|
||||||
103: '7.numpad',
|
|
||||||
104: '8.numpad',
|
|
||||||
105: '9.numpad',
|
|
||||||
106: 'asterisk.numpad',
|
|
||||||
107: 'plus.numpad',
|
|
||||||
109: 'minus.numpad',
|
|
||||||
108: 'enter.numpad',
|
|
||||||
110: 'dot.numpad',
|
|
||||||
111: 'slash.numpad',
|
|
||||||
112: 'f1',
|
|
||||||
113: 'f2',
|
|
||||||
114: 'f3',
|
|
||||||
115: 'f4',
|
|
||||||
116: 'f5',
|
|
||||||
117: 'f6',
|
|
||||||
118: 'f7',
|
|
||||||
119: 'f8',
|
|
||||||
120: 'f9',
|
|
||||||
121: 'f10',
|
|
||||||
122: 'f11',
|
|
||||||
123: 'f12',
|
|
||||||
124: 'f13',
|
|
||||||
125: 'f14',
|
|
||||||
126: 'f15',
|
|
||||||
127: 'f16',
|
|
||||||
144: 'numlock',
|
|
||||||
145: 'scrolllock',
|
|
||||||
186: 'semicolon',
|
|
||||||
187: 'equal',
|
|
||||||
188: 'comma',
|
|
||||||
189: 'minus',
|
|
||||||
190: 'dot',
|
|
||||||
191: 'slash',
|
|
||||||
192: 'backtick',
|
|
||||||
219: 'openbracket',
|
|
||||||
220: 'backslash',
|
|
||||||
221: 'closebracket',
|
|
||||||
222: 'quote'
|
|
||||||
// see dojo, for ex.
|
|
||||||
};
|
|
||||||
})(),
|
|
||||||
modifierNames = {
|
modifierNames = {
|
||||||
altKey: 'alt', // mac: option
|
altKey: 'alt', // Mac: option
|
||||||
ctrlKey: 'control',
|
ctrlKey: 'control',
|
||||||
// metaKey: 'meta', // mac: command
|
shiftKey: 'shift',
|
||||||
shiftKey: 'shift'
|
metaKey: 'meta', // Mac: command
|
||||||
};
|
},
|
||||||
|
resetTimeout, triggerTimeout;
|
||||||
|
|
||||||
|
/*
|
||||||
Ox.UI.ready(function() {
|
Ox.UI.ready(function() {
|
||||||
// fixme: how to do this better?
|
// fixme: how to do this better?
|
||||||
// in firefox on mac, keypress doesn't fire for up/down
|
// in firefox on mac, keypress doesn't fire for up/down
|
||||||
|
|
@ -157,46 +75,55 @@
|
||||||
Ox.UI.$document.keydown(keypress);
|
Ox.UI.$document.keydown(keypress);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
*/
|
||||||
|
|
||||||
function keypress(event) {
|
Ox.UI.ready(function() {
|
||||||
|
Ox.UI.$document.keydown(keydown)
|
||||||
|
});
|
||||||
|
|
||||||
|
function keydown(event) {
|
||||||
var focused = Ox.Focus.focused(),
|
var focused = Ox.Focus.focused(),
|
||||||
key,
|
key,
|
||||||
keys = [],
|
keyName = keyNames[event.keyCode] || '',
|
||||||
//ret = true,
|
keyBasename = keyName.split('.')[0],
|
||||||
time;
|
keys = keyName ? [keyName] : [];
|
||||||
Ox.forEach(modifierNames, function(v, k) {
|
Ox.forEach(modifierNames, function(v, k) {
|
||||||
event[k] && keys.push(v);
|
// avoid pushing modifier twice
|
||||||
});
|
if (event[k] && keyBasename != v) {
|
||||||
// avoid pushing modifier twice
|
keys.splice(-1, 0, v);
|
||||||
if (keyNames[event.keyCode] && keys.indexOf(keyNames[event.keyCode]) == -1) {
|
}
|
||||||
keys.push(keyNames[event.keyCode]);
|
});
|
||||||
}
|
key = keys.join('_');
|
||||||
key = keys.join('_');
|
if (/^(shift_)?[a-z]$|^\d(\.numpad)?$|space/.test(key)) {
|
||||||
if (key.match(/^[\w\d\-]$|SPACE/)) {
|
// don't register leading spaces or trailing double spaces
|
||||||
time = Ox.getTime();
|
if (!(keyName == 'space' && (buffer == '' || / $/.test(buffer)))) {
|
||||||
if (time - bufferTime > bufferTimeout) {
|
buffer += keyName == 'space' ? ' ' : keyBasename;
|
||||||
buffer = '';
|
Ox.print('buffer', buffer)
|
||||||
|
// clear the trigger timeout only if the key went into the buffer
|
||||||
|
clearTimeout(triggerTimeout);
|
||||||
|
triggerTimeout = setTimeout(function() {
|
||||||
|
Ox.print('buffer', buffer)
|
||||||
|
focused !== null && Ox.UI.elements[focused].triggerEvent('keys', {
|
||||||
|
keys: buffer
|
||||||
|
});
|
||||||
|
}, 250);
|
||||||
}
|
}
|
||||||
buffer += key == 'SPACE' ? ' ' : key;
|
|
||||||
bufferTime = time;
|
|
||||||
}
|
}
|
||||||
|
// clear the reset timeout even if the key didn't go into the buffer
|
||||||
|
clearTimeout(resetTimeout);
|
||||||
|
resetTimeout = setTimeout(function() {
|
||||||
|
buffer = '';
|
||||||
|
}, 1000);
|
||||||
if (focused !== null) {
|
if (focused !== null) {
|
||||||
Ox.UI.elements[focused].triggerEvent('key_' + key);
|
Ox.UI.elements[focused].triggerEvent('key_' + key);
|
||||||
|
// prevent Chrome from going back in history, or scrolling
|
||||||
if (
|
if (
|
||||||
['down', 'left', 'right', 'space', 'up'].indexOf(key) > -1 &&
|
['backspace', 'down', 'left', 'right', 'space', 'up'].indexOf(key) > -1 &&
|
||||||
!Ox.UI.elements[focused].hasClass('OxInput')
|
!Ox.UI.elements[focused].hasClass('OxInput')
|
||||||
) {
|
) {
|
||||||
// prevent Chrome from scrolling
|
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/*
|
|
||||||
stack.forEach(function(v) {
|
|
||||||
// fixme: we dont get the return value!
|
|
||||||
ret = Ox.event.trigger(keyboard + Ox.toCamelCase(key) + '.' + v);
|
|
||||||
return ret;
|
|
||||||
});
|
|
||||||
*/
|
|
||||||
}
|
}
|
||||||
|
|
||||||
})();
|
})();
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue