released v3.13.0 (#441 #463)

pull/465/head v3.13.0
jaywcjlove 1 year ago
parent 3c9bb77e05
commit 511e85529f

@ -188,6 +188,7 @@ hotkeys('ctrl-y, ctrl-a', {splitKey: '-'}, function(e){
- `keydown<Boolean>` - `keydown<Boolean>`
- `splitKey<string>` (默认值 `+`) - `splitKey<string>` (默认值 `+`)
- `capture<Boolean>` - `capture<Boolean>`
- `single<Boolean>`
```js ```js
hotkeys('o, enter', { hotkeys('o, enter', {

@ -159,6 +159,7 @@ hotkeys('*','wcj', function(event){
- `keydown<Boolean>` - `keydown<Boolean>`
- `splitKey<string>` (default is `+`) - `splitKey<string>` (default is `+`)
- `capture<Boolean>` - `capture<Boolean>`
- `single<Boolean>`
```js ```js
hotkeys('o, enter', { hotkeys('o, enter', {

@ -1,22 +1,25 @@
/**! /**!
* hotkeys-js v3.12.2 * hotkeys-js v3.13.0
* A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies. * A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies.
* *
* Copyright (c) 2023 kenny wong <wowohoo@qq.com> * Copyright (c) 2023 kenny wong <wowohoo@qq.com>
* https://jaywcjlove.github.io/hotkeys-js * https://github.com/jaywcjlove/hotkeys-js.git
*
* @website: https://jaywcjlove.github.io/hotkeys-js
* Licensed under the MIT license * Licensed under the MIT license
*/ */
'use strict'; 'use strict';
var isff = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase().indexOf('firefox') > 0 : false; const isff = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase().indexOf('firefox') > 0 : false;
// 绑定事件 // 绑定事件
function addEvent(object, event, method, useCapture) { function addEvent(object, event, method, useCapture) {
if (object.addEventListener) { if (object.addEventListener) {
object.addEventListener(event, method, useCapture); object.addEventListener(event, method, useCapture);
} else if (object.attachEvent) { } else if (object.attachEvent) {
object.attachEvent("on".concat(event), function () { object.attachEvent("on".concat(event), () => {
method(window.event); method(window.event);
}); });
} }
@ -24,8 +27,8 @@ function addEvent(object, event, method, useCapture) {
// 修饰键转换成对应的键码 // 修饰键转换成对应的键码
function getMods(modifier, key) { function getMods(modifier, key) {
var mods = key.slice(0, key.length - 1); const mods = key.slice(0, key.length - 1);
for (var i = 0; i < mods.length; i++) mods[i] = modifier[mods[i].toLowerCase()]; for (let i = 0; i < mods.length; i++) mods[i] = modifier[mods[i].toLowerCase()];
return mods; return mods;
} }
@ -33,8 +36,8 @@ function getMods(modifier, key) {
function getKeys(key) { function getKeys(key) {
if (typeof key !== 'string') key = ''; if (typeof key !== 'string') key = '';
key = key.replace(/\s/g, ''); // 匹配任何空白字符,包括空格、制表符、换页符等等 key = key.replace(/\s/g, ''); // 匹配任何空白字符,包括空格、制表符、换页符等等
var keys = key.split(','); // 同时设置多个快捷键,以','分割 const keys = key.split(','); // 同时设置多个快捷键,以','分割
var index = keys.lastIndexOf(''); let index = keys.lastIndexOf('');
// 快捷键可能包含',',需特殊处理 // 快捷键可能包含',',需特殊处理
for (; index >= 0;) { for (; index >= 0;) {
@ -47,17 +50,17 @@ function getKeys(key) {
// 比较修饰键的数组 // 比较修饰键的数组
function compareArray(a1, a2) { function compareArray(a1, a2) {
var arr1 = a1.length >= a2.length ? a1 : a2; const arr1 = a1.length >= a2.length ? a1 : a2;
var arr2 = a1.length >= a2.length ? a2 : a1; const arr2 = a1.length >= a2.length ? a2 : a1;
var isIndex = true; let isIndex = true;
for (var i = 0; i < arr1.length; i++) { for (let i = 0; i < arr1.length; i++) {
if (arr2.indexOf(arr1[i]) === -1) isIndex = false; if (arr2.indexOf(arr1[i]) === -1) isIndex = false;
} }
return isIndex; return isIndex;
} }
// Special Keys // Special Keys
var _keyMap = { const _keyMap = {
backspace: 8, backspace: 8,
'⌫': 8, '⌫': 8,
tab: 9, tab: 9,
@ -112,7 +115,7 @@ var _keyMap = {
}; };
// Modifier Keys // Modifier Keys
var _modifier = { const _modifier = {
// shiftKey // shiftKey
'⇧': 16, '⇧': 16,
shift: 16, shift: 16,
@ -129,7 +132,7 @@ var _modifier = {
cmd: 91, cmd: 91,
command: 91 command: 91
}; };
var modifierMap = { const modifierMap = {
16: 'shiftKey', 16: 'shiftKey',
18: 'altKey', 18: 'altKey',
17: 'ctrlKey', 17: 'ctrlKey',
@ -139,38 +142,28 @@ var modifierMap = {
altKey: 18, altKey: 18,
metaKey: 91 metaKey: 91
}; };
var _mods = { const _mods = {
16: false, 16: false,
18: false, 18: false,
17: false, 17: false,
91: false 91: false
}; };
var _handlers = {}; const _handlers = {};
// F1~F12 special key // F1~F12 special key
for (var k = 1; k < 20; k++) { for (let k = 1; k < 20; k++) {
_keyMap["f".concat(k)] = 111 + k; _keyMap["f".concat(k)] = 111 + k;
} }
var _downKeys = []; // 记录摁下的绑定键 let _downKeys = []; // 记录摁下的绑定键
var winListendFocus = false; // window是否已经监听了focus事件 let winListendFocus = false; // window是否已经监听了focus事件
var _scope = 'all'; // 默认热键范围 let _scope = 'all'; // 默认热键范围
var elementHasBindEvent = []; // 已绑定事件的节点记录 const elementHasBindEvent = []; // 已绑定事件的节点记录
// 返回键码 // 返回键码
var code = function code(x) { const code = x => _keyMap[x.toLowerCase()] || _modifier[x.toLowerCase()] || x.toUpperCase().charCodeAt(0);
return _keyMap[x.toLowerCase()] || _modifier[x.toLowerCase()] || x.toUpperCase().charCodeAt(0); const getKey = x => Object.keys(_keyMap).find(k => _keyMap[k] === x);
}; const getModifier = x => Object.keys(_modifier).find(k => _modifier[k] === x);
var getKey = function getKey(x) {
return Object.keys(_keyMap).find(function (k) {
return _keyMap[k] === x;
});
};
var getModifier = function getModifier(x) {
return Object.keys(_modifier).find(function (k) {
return _modifier[k] === x;
});
};
// 设置获取当前范围(默认为'所有' // 设置获取当前范围(默认为'所有'
function setScope(scope) { function setScope(scope) {
@ -185,25 +178,23 @@ function getPressedKeyCodes() {
return _downKeys.slice(0); return _downKeys.slice(0);
} }
function getPressedKeyString() { function getPressedKeyString() {
return _downKeys.map(function (c) { return _downKeys.map(c => getKey(c) || getModifier(c) || String.fromCharCode(c));
return getKey(c) || getModifier(c) || String.fromCharCode(c);
});
} }
function getAllKeyCodes() { function getAllKeyCodes() {
var result = []; const result = [];
Object.keys(_handlers).forEach(function (k) { Object.keys(_handlers).forEach(k => {
_handlers[k].forEach(function (_ref) { _handlers[k].forEach(_ref => {
var key = _ref.key, let {
scope = _ref.scope, key,
mods = _ref.mods, scope,
shortcut = _ref.shortcut; mods,
shortcut
} = _ref;
result.push({ result.push({
scope: scope, scope,
shortcut: shortcut, shortcut,
mods: mods, mods,
keys: key.split('+').map(function (v) { keys: key.split('+').map(v => code(v))
return code(v);
})
}); });
}); });
}); });
@ -213,9 +204,11 @@ function getAllKeyCodes() {
// 表单控件控件判断 返回 Boolean // 表单控件控件判断 返回 Boolean
// hotkey is effective only when filter return true // hotkey is effective only when filter return true
function filter(event) { function filter(event) {
var target = event.target || event.srcElement; const target = event.target || event.srcElement;
var tagName = target.tagName; const {
var flag = true; tagName
} = target;
let flag = true;
// ignore: isContentEditable === 'true', <input> and <textarea> when readOnly state is false, <select> // ignore: isContentEditable === 'true', <input> and <textarea> when readOnly state is false, <select>
if (target.isContentEditable || (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly) { if (target.isContentEditable || (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly) {
flag = false; flag = false;
@ -228,18 +221,17 @@ function isPressed(keyCode) {
if (typeof keyCode === 'string') { if (typeof keyCode === 'string') {
keyCode = code(keyCode); // 转换成键码 keyCode = code(keyCode); // 转换成键码
} }
return _downKeys.indexOf(keyCode) !== -1; return _downKeys.indexOf(keyCode) !== -1;
} }
// 循环删除handlers中的所有 scope(范围) // 循环删除handlers中的所有 scope(范围)
function deleteScope(scope, newScope) { function deleteScope(scope, newScope) {
var handlers; let handlers;
var i; let i;
// 没有指定scope获取scope // 没有指定scope获取scope
if (!scope) scope = getScope(); if (!scope) scope = getScope();
for (var key in _handlers) { for (const key in _handlers) {
if (Object.prototype.hasOwnProperty.call(_handlers, key)) { if (Object.prototype.hasOwnProperty.call(_handlers, key)) {
handlers = _handlers[key]; handlers = _handlers[key];
for (i = 0; i < handlers.length;) { for (i = 0; i < handlers.length;) {
@ -254,8 +246,8 @@ function deleteScope(scope, newScope) {
// 清除修饰键 // 清除修饰键
function clearModifier(event) { function clearModifier(event) {
var key = event.keyCode || event.which || event.charCode; let key = event.keyCode || event.which || event.charCode;
var i = _downKeys.indexOf(key); const i = _downKeys.indexOf(key);
// 从列表中清除按压过的键 // 从列表中清除按压过的键
if (i >= 0) { if (i >= 0) {
@ -272,18 +264,16 @@ function clearModifier(event) {
_mods[key] = false; _mods[key] = false;
// 将修饰键重置为false // 将修饰键重置为false
for (var k in _modifier) if (_modifier[k] === key) hotkeys[k] = false; for (const k in _modifier) if (_modifier[k] === key) hotkeys[k] = false;
} }
} }
function unbind(keysInfo) { function unbind(keysInfo) {
// unbind(), unbind all keys // unbind(), unbind all keys
if (typeof keysInfo === 'undefined') { if (typeof keysInfo === 'undefined') {
Object.keys(_handlers).forEach(function (key) { Object.keys(_handlers).forEach(key => delete _handlers[key]);
return delete _handlers[key];
});
} else if (Array.isArray(keysInfo)) { } else if (Array.isArray(keysInfo)) {
// support like : unbind([{key: 'ctrl+a', scope: 's1'}, {key: 'ctrl-a', scope: 's2', splitKey: '-'}]) // support like : unbind([{key: 'ctrl+a', scope: 's1'}, {key: 'ctrl-a', scope: 's2', splitKey: '-'}])
keysInfo.forEach(function (info) { keysInfo.forEach(info => {
if (info.key) eachUnbind(info); if (info.key) eachUnbind(info);
}); });
} else if (typeof keysInfo === 'object') { } else if (typeof keysInfo === 'object') {
@ -295,41 +285,41 @@ function unbind(keysInfo) {
} }
// support old method // support old method
// eslint-disable-line // eslint-disable-line
var scope = args[0], let [scope, method] = args;
method = args[1];
if (typeof scope === 'function') { if (typeof scope === 'function') {
method = scope; method = scope;
scope = ''; scope = '';
} }
eachUnbind({ eachUnbind({
key: keysInfo, key: keysInfo,
scope: scope, scope,
method: method, method,
splitKey: '+' splitKey: '+'
}); });
} }
} }
// 解除绑定某个范围的快捷键 // 解除绑定某个范围的快捷键
var eachUnbind = function eachUnbind(_ref2) { const eachUnbind = _ref2 => {
var key = _ref2.key, let {
scope = _ref2.scope, key,
method = _ref2.method, scope,
_ref2$splitKey = _ref2.splitKey, method,
splitKey = _ref2$splitKey === void 0 ? '+' : _ref2$splitKey; splitKey = '+'
var multipleKeys = getKeys(key); } = _ref2;
multipleKeys.forEach(function (originKey) { const multipleKeys = getKeys(key);
var unbindKeys = originKey.split(splitKey); multipleKeys.forEach(originKey => {
var len = unbindKeys.length; const unbindKeys = originKey.split(splitKey);
var lastKey = unbindKeys[len - 1]; const len = unbindKeys.length;
var keyCode = lastKey === '*' ? '*' : code(lastKey); const lastKey = unbindKeys[len - 1];
const keyCode = lastKey === '*' ? '*' : code(lastKey);
if (!_handlers[keyCode]) return; if (!_handlers[keyCode]) return;
// 判断是否传入范围,没有就获取范围 // 判断是否传入范围,没有就获取范围
if (!scope) scope = getScope(); if (!scope) scope = getScope();
var mods = len > 1 ? getMods(_modifier, unbindKeys) : []; const mods = len > 1 ? getMods(_modifier, unbindKeys) : [];
_handlers[keyCode] = _handlers[keyCode].filter(function (record) { _handlers[keyCode] = _handlers[keyCode].filter(record => {
// 通过函数判断,是否解除绑定,函数相等直接返回 // 通过函数判断,是否解除绑定,函数相等直接返回
var isMatchingMethod = method ? record.method === method : true; const isMatchingMethod = method ? record.method === method : true;
return !(isMatchingMethod && record.scope === scope && compareArray(record.mods, mods)); return !(isMatchingMethod && record.scope === scope && compareArray(record.mods, mods));
}); });
}); });
@ -340,13 +330,13 @@ function eventHandler(event, handler, scope, element) {
if (handler.element !== element) { if (handler.element !== element) {
return; return;
} }
var modifiersMatch; let modifiersMatch;
// 看它是否在当前范围 // 看它是否在当前范围
if (handler.scope === scope || handler.scope === 'all') { if (handler.scope === scope || handler.scope === 'all') {
// 检查是否匹配修饰符如果有返回true // 检查是否匹配修饰符如果有返回true
modifiersMatch = handler.mods.length > 0; modifiersMatch = handler.mods.length > 0;
for (var y in _mods) { for (const y in _mods) {
if (Object.prototype.hasOwnProperty.call(_mods, y)) { if (Object.prototype.hasOwnProperty.call(_mods, y)) {
if (!_mods[y] && handler.mods.indexOf(+y) > -1 || _mods[y] && handler.mods.indexOf(+y) === -1) { if (!_mods[y] && handler.mods.indexOf(+y) > -1 || _mods[y] && handler.mods.indexOf(+y) === -1) {
modifiersMatch = false; modifiersMatch = false;
@ -369,8 +359,8 @@ function eventHandler(event, handler, scope, element) {
// 处理keydown事件 // 处理keydown事件
function dispatch(event, element) { function dispatch(event, element) {
var asterisk = _handlers['*']; const asterisk = _handlers['*'];
var key = event.keyCode || event.which || event.charCode; let key = event.keyCode || event.which || event.charCode;
// 表单控件过滤 默认表单控件不触发快捷键 // 表单控件过滤 默认表单控件不触发快捷键
if (!hotkeys.filter.call(this, event)) return; if (!hotkeys.filter.call(this, event)) return;
@ -390,8 +380,8 @@ function dispatch(event, element) {
* Jest test cases are required. * Jest test cases are required.
* =============================== * ===============================
*/ */
['ctrlKey', 'altKey', 'shiftKey', 'metaKey'].forEach(function (keyName) { ['ctrlKey', 'altKey', 'shiftKey', 'metaKey'].forEach(keyName => {
var keyNum = modifierMap[keyName]; const keyNum = modifierMap[keyName];
if (event[keyName] && _downKeys.indexOf(keyNum) === -1) { if (event[keyName] && _downKeys.indexOf(keyNum) === -1) {
_downKeys.push(keyNum); _downKeys.push(keyNum);
} else if (!event[keyName] && _downKeys.indexOf(keyNum) > -1) { } else if (!event[keyName] && _downKeys.indexOf(keyNum) > -1) {
@ -414,14 +404,14 @@ function dispatch(event, element) {
_mods[key] = true; _mods[key] = true;
// 将特殊字符的key注册到 hotkeys 上 // 将特殊字符的key注册到 hotkeys 上
for (var k in _modifier) { for (const k in _modifier) {
if (_modifier[k] === key) hotkeys[k] = true; if (_modifier[k] === key) hotkeys[k] = true;
} }
if (!asterisk) return; if (!asterisk) return;
} }
// 将 modifierMap 里面的修饰键绑定到 event 中 // 将 modifierMap 里面的修饰键绑定到 event 中
for (var e in _mods) { for (const e in _mods) {
if (Object.prototype.hasOwnProperty.call(_mods, e)) { if (Object.prototype.hasOwnProperty.call(_mods, e)) {
_mods[e] = event[modifierMap[e]]; _mods[e] = event[modifierMap[e]];
} }
@ -444,10 +434,10 @@ function dispatch(event, element) {
} }
// 获取范围 默认为 `all` // 获取范围 默认为 `all`
var scope = getScope(); const scope = getScope();
// 对任何快捷键都需要做的处理 // 对任何快捷键都需要做的处理
if (asterisk) { if (asterisk) {
for (var i = 0; i < asterisk.length; i++) { for (let i = 0; i < asterisk.length; i++) {
if (asterisk[i].scope === scope && (event.type === 'keydown' && asterisk[i].keydown || event.type === 'keyup' && asterisk[i].keyup)) { if (asterisk[i].scope === scope && (event.type === 'keydown' && asterisk[i].keydown || event.type === 'keyup' && asterisk[i].keyup)) {
eventHandler(event, asterisk[i], scope, element); eventHandler(event, asterisk[i], scope, element);
} }
@ -455,14 +445,16 @@ function dispatch(event, element) {
} }
// key 不在 _handlers 中返回 // key 不在 _handlers 中返回
if (!(key in _handlers)) return; if (!(key in _handlers)) return;
for (var _i = 0; _i < _handlers[key].length; _i++) { for (let i = 0; i < _handlers[key].length; i++) {
if (event.type === 'keydown' && _handlers[key][_i].keydown || event.type === 'keyup' && _handlers[key][_i].keyup) { if (event.type === 'keydown' && _handlers[key][i].keydown || event.type === 'keyup' && _handlers[key][i].keyup) {
if (_handlers[key][_i].key) { if (_handlers[key][i].key) {
var record = _handlers[key][_i]; const record = _handlers[key][i];
var splitKey = record.splitKey; const {
var keyShortcut = record.key.split(splitKey); splitKey
var _downKeysCurrent = []; // 记录当前按键键值 } = record;
for (var a = 0; a < keyShortcut.length; a++) { const keyShortcut = record.key.split(splitKey);
const _downKeysCurrent = []; // 记录当前按键键值
for (let a = 0; a < keyShortcut.length; a++) {
_downKeysCurrent.push(code(keyShortcut[a])); _downKeysCurrent.push(code(keyShortcut[a]));
} }
if (_downKeysCurrent.sort().join('') === _downKeys.sort().join('')) { if (_downKeysCurrent.sort().join('') === _downKeys.sort().join('')) {
@ -480,15 +472,16 @@ function isElementBind(element) {
} }
function hotkeys(key, option, method) { function hotkeys(key, option, method) {
_downKeys = []; _downKeys = [];
var keys = getKeys(key); // 需要处理的快捷键列表 const keys = getKeys(key); // 需要处理的快捷键列表
var mods = []; let mods = [];
var scope = 'all'; // scope默认为all所有范围都有效 let scope = 'all'; // scope默认为all所有范围都有效
var element = document; // 快捷键事件绑定节点 let element = document; // 快捷键事件绑定节点
var i = 0; let i = 0;
var keyup = false; let keyup = false;
var keydown = true; let keydown = true;
var splitKey = '+'; let splitKey = '+';
var capture = false; let capture = false;
let single = false; // 单个callback
// 对为设定范围的判断 // 对为设定范围的判断
if (method === undefined && typeof option === 'function') { if (method === undefined && typeof option === 'function') {
@ -501,9 +494,8 @@ function hotkeys(key, option, method) {
if (option.keydown !== undefined) keydown = option.keydown; // eslint-disable-line if (option.keydown !== undefined) keydown = option.keydown; // eslint-disable-line
if (option.capture !== undefined) capture = option.capture; // eslint-disable-line if (option.capture !== undefined) capture = option.capture; // eslint-disable-line
if (typeof option.splitKey === 'string') splitKey = option.splitKey; // eslint-disable-line if (typeof option.splitKey === 'string') splitKey = option.splitKey; // eslint-disable-line
if (option.singleton === true) ; // eslint-disable-line if (option.single === true) single = true; // eslint-disable-line
} }
if (typeof option === 'string') scope = option; if (typeof option === 'string') scope = option;
// 对于每个快捷键进行处理 // 对于每个快捷键进行处理
@ -520,72 +512,72 @@ function hotkeys(key, option, method) {
// 判断key是否在_handlers中不在就赋一个空数组 // 判断key是否在_handlers中不在就赋一个空数组
if (!(key in _handlers)) _handlers[key] = []; if (!(key in _handlers)) _handlers[key] = [];
// 如果只允许单个callback重新设置_handlers
if (single) _handlers[key] = [];
_handlers[key].push({ _handlers[key].push({
keyup: keyup, keyup,
keydown: keydown, keydown,
scope: scope, scope,
mods: mods, mods,
shortcut: keys[i], shortcut: keys[i],
method: method, method,
key: keys[i], key: keys[i],
splitKey: splitKey, splitKey,
element: element element
}); });
} }
// 在全局document上设置快捷键 // 在全局document上设置快捷键
if (typeof element !== 'undefined' && !isElementBind(element) && window) { if (typeof element !== 'undefined' && !isElementBind(element) && window) {
elementHasBindEvent.push(element); elementHasBindEvent.push(element);
addEvent(element, 'keydown', function (e) { addEvent(element, 'keydown', e => {
dispatch(e, element); dispatch(e, element);
}, capture); }, capture);
if (!winListendFocus) { if (!winListendFocus) {
winListendFocus = true; winListendFocus = true;
addEvent(window, 'focus', function () { addEvent(window, 'focus', () => {
_downKeys = []; _downKeys = [];
}, capture); }, capture);
} }
addEvent(element, 'keyup', function (e) { addEvent(element, 'keyup', e => {
dispatch(e, element); dispatch(e, element);
clearModifier(e); clearModifier(e);
}, capture); }, capture);
} }
} }
function trigger(shortcut) { function trigger(shortcut) {
var scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'all'; let scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'all';
Object.keys(_handlers).forEach(function (key) { Object.keys(_handlers).forEach(key => {
var dataList = _handlers[key].filter(function (item) { const dataList = _handlers[key].filter(item => item.scope === scope && item.shortcut === shortcut);
return item.scope === scope && item.shortcut === shortcut; dataList.forEach(data => {
});
dataList.forEach(function (data) {
if (data && data.method) { if (data && data.method) {
data.method(); data.method();
} }
}); });
}); });
} }
var _api = { const _api = {
getPressedKeyString: getPressedKeyString, getPressedKeyString,
setScope: setScope, setScope,
getScope: getScope, getScope,
deleteScope: deleteScope, deleteScope,
getPressedKeyCodes: getPressedKeyCodes, getPressedKeyCodes,
getAllKeyCodes: getAllKeyCodes, getAllKeyCodes,
isPressed: isPressed, isPressed,
filter: filter, filter,
trigger: trigger, trigger,
unbind: unbind, unbind,
keyMap: _keyMap, keyMap: _keyMap,
modifier: _modifier, modifier: _modifier,
modifierMap: modifierMap modifierMap
}; };
for (var a in _api) { for (const a in _api) {
if (Object.prototype.hasOwnProperty.call(_api, a)) { if (Object.prototype.hasOwnProperty.call(_api, a)) {
hotkeys[a] = _api[a]; hotkeys[a] = _api[a];
} }
} }
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
var _hotkeys = window.hotkeys; const _hotkeys = window.hotkeys;
hotkeys.noConflict = function (deep) { hotkeys.noConflict = deep => {
if (deep && window.hotkeys === hotkeys) { if (deep && window.hotkeys === hotkeys) {
window.hotkeys = _hotkeys; window.hotkeys = _hotkeys;
} }

File diff suppressed because one or more lines are too long

280
dist/hotkeys.esm.js vendored

@ -1,20 +1,23 @@
/**! /**!
* hotkeys-js v3.12.2 * hotkeys-js v3.13.0
* A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies. * A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies.
* *
* Copyright (c) 2023 kenny wong <wowohoo@qq.com> * Copyright (c) 2023 kenny wong <wowohoo@qq.com>
* https://jaywcjlove.github.io/hotkeys-js * https://github.com/jaywcjlove/hotkeys-js.git
*
* @website: https://jaywcjlove.github.io/hotkeys-js
* Licensed under the MIT license * Licensed under the MIT license
*/ */
var isff = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase().indexOf('firefox') > 0 : false; const isff = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase().indexOf('firefox') > 0 : false;
// 绑定事件 // 绑定事件
function addEvent(object, event, method, useCapture) { function addEvent(object, event, method, useCapture) {
if (object.addEventListener) { if (object.addEventListener) {
object.addEventListener(event, method, useCapture); object.addEventListener(event, method, useCapture);
} else if (object.attachEvent) { } else if (object.attachEvent) {
object.attachEvent("on".concat(event), function () { object.attachEvent("on".concat(event), () => {
method(window.event); method(window.event);
}); });
} }
@ -22,8 +25,8 @@ function addEvent(object, event, method, useCapture) {
// 修饰键转换成对应的键码 // 修饰键转换成对应的键码
function getMods(modifier, key) { function getMods(modifier, key) {
var mods = key.slice(0, key.length - 1); const mods = key.slice(0, key.length - 1);
for (var i = 0; i < mods.length; i++) mods[i] = modifier[mods[i].toLowerCase()]; for (let i = 0; i < mods.length; i++) mods[i] = modifier[mods[i].toLowerCase()];
return mods; return mods;
} }
@ -31,8 +34,8 @@ function getMods(modifier, key) {
function getKeys(key) { function getKeys(key) {
if (typeof key !== 'string') key = ''; if (typeof key !== 'string') key = '';
key = key.replace(/\s/g, ''); // 匹配任何空白字符,包括空格、制表符、换页符等等 key = key.replace(/\s/g, ''); // 匹配任何空白字符,包括空格、制表符、换页符等等
var keys = key.split(','); // 同时设置多个快捷键,以','分割 const keys = key.split(','); // 同时设置多个快捷键,以','分割
var index = keys.lastIndexOf(''); let index = keys.lastIndexOf('');
// 快捷键可能包含',',需特殊处理 // 快捷键可能包含',',需特殊处理
for (; index >= 0;) { for (; index >= 0;) {
@ -45,17 +48,17 @@ function getKeys(key) {
// 比较修饰键的数组 // 比较修饰键的数组
function compareArray(a1, a2) { function compareArray(a1, a2) {
var arr1 = a1.length >= a2.length ? a1 : a2; const arr1 = a1.length >= a2.length ? a1 : a2;
var arr2 = a1.length >= a2.length ? a2 : a1; const arr2 = a1.length >= a2.length ? a2 : a1;
var isIndex = true; let isIndex = true;
for (var i = 0; i < arr1.length; i++) { for (let i = 0; i < arr1.length; i++) {
if (arr2.indexOf(arr1[i]) === -1) isIndex = false; if (arr2.indexOf(arr1[i]) === -1) isIndex = false;
} }
return isIndex; return isIndex;
} }
// Special Keys // Special Keys
var _keyMap = { const _keyMap = {
backspace: 8, backspace: 8,
'⌫': 8, '⌫': 8,
tab: 9, tab: 9,
@ -110,7 +113,7 @@ var _keyMap = {
}; };
// Modifier Keys // Modifier Keys
var _modifier = { const _modifier = {
// shiftKey // shiftKey
'⇧': 16, '⇧': 16,
shift: 16, shift: 16,
@ -127,7 +130,7 @@ var _modifier = {
cmd: 91, cmd: 91,
command: 91 command: 91
}; };
var modifierMap = { const modifierMap = {
16: 'shiftKey', 16: 'shiftKey',
18: 'altKey', 18: 'altKey',
17: 'ctrlKey', 17: 'ctrlKey',
@ -137,38 +140,28 @@ var modifierMap = {
altKey: 18, altKey: 18,
metaKey: 91 metaKey: 91
}; };
var _mods = { const _mods = {
16: false, 16: false,
18: false, 18: false,
17: false, 17: false,
91: false 91: false
}; };
var _handlers = {}; const _handlers = {};
// F1~F12 special key // F1~F12 special key
for (var k = 1; k < 20; k++) { for (let k = 1; k < 20; k++) {
_keyMap["f".concat(k)] = 111 + k; _keyMap["f".concat(k)] = 111 + k;
} }
var _downKeys = []; // 记录摁下的绑定键 let _downKeys = []; // 记录摁下的绑定键
var winListendFocus = false; // window是否已经监听了focus事件 let winListendFocus = false; // window是否已经监听了focus事件
var _scope = 'all'; // 默认热键范围 let _scope = 'all'; // 默认热键范围
var elementHasBindEvent = []; // 已绑定事件的节点记录 const elementHasBindEvent = []; // 已绑定事件的节点记录
// 返回键码 // 返回键码
var code = function code(x) { const code = x => _keyMap[x.toLowerCase()] || _modifier[x.toLowerCase()] || x.toUpperCase().charCodeAt(0);
return _keyMap[x.toLowerCase()] || _modifier[x.toLowerCase()] || x.toUpperCase().charCodeAt(0); const getKey = x => Object.keys(_keyMap).find(k => _keyMap[k] === x);
}; const getModifier = x => Object.keys(_modifier).find(k => _modifier[k] === x);
var getKey = function getKey(x) {
return Object.keys(_keyMap).find(function (k) {
return _keyMap[k] === x;
});
};
var getModifier = function getModifier(x) {
return Object.keys(_modifier).find(function (k) {
return _modifier[k] === x;
});
};
// 设置获取当前范围(默认为'所有' // 设置获取当前范围(默认为'所有'
function setScope(scope) { function setScope(scope) {
@ -183,25 +176,23 @@ function getPressedKeyCodes() {
return _downKeys.slice(0); return _downKeys.slice(0);
} }
function getPressedKeyString() { function getPressedKeyString() {
return _downKeys.map(function (c) { return _downKeys.map(c => getKey(c) || getModifier(c) || String.fromCharCode(c));
return getKey(c) || getModifier(c) || String.fromCharCode(c);
});
} }
function getAllKeyCodes() { function getAllKeyCodes() {
var result = []; const result = [];
Object.keys(_handlers).forEach(function (k) { Object.keys(_handlers).forEach(k => {
_handlers[k].forEach(function (_ref) { _handlers[k].forEach(_ref => {
var key = _ref.key, let {
scope = _ref.scope, key,
mods = _ref.mods, scope,
shortcut = _ref.shortcut; mods,
shortcut
} = _ref;
result.push({ result.push({
scope: scope, scope,
shortcut: shortcut, shortcut,
mods: mods, mods,
keys: key.split('+').map(function (v) { keys: key.split('+').map(v => code(v))
return code(v);
})
}); });
}); });
}); });
@ -211,9 +202,11 @@ function getAllKeyCodes() {
// 表单控件控件判断 返回 Boolean // 表单控件控件判断 返回 Boolean
// hotkey is effective only when filter return true // hotkey is effective only when filter return true
function filter(event) { function filter(event) {
var target = event.target || event.srcElement; const target = event.target || event.srcElement;
var tagName = target.tagName; const {
var flag = true; tagName
} = target;
let flag = true;
// ignore: isContentEditable === 'true', <input> and <textarea> when readOnly state is false, <select> // ignore: isContentEditable === 'true', <input> and <textarea> when readOnly state is false, <select>
if (target.isContentEditable || (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly) { if (target.isContentEditable || (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly) {
flag = false; flag = false;
@ -226,18 +219,17 @@ function isPressed(keyCode) {
if (typeof keyCode === 'string') { if (typeof keyCode === 'string') {
keyCode = code(keyCode); // 转换成键码 keyCode = code(keyCode); // 转换成键码
} }
return _downKeys.indexOf(keyCode) !== -1; return _downKeys.indexOf(keyCode) !== -1;
} }
// 循环删除handlers中的所有 scope(范围) // 循环删除handlers中的所有 scope(范围)
function deleteScope(scope, newScope) { function deleteScope(scope, newScope) {
var handlers; let handlers;
var i; let i;
// 没有指定scope获取scope // 没有指定scope获取scope
if (!scope) scope = getScope(); if (!scope) scope = getScope();
for (var key in _handlers) { for (const key in _handlers) {
if (Object.prototype.hasOwnProperty.call(_handlers, key)) { if (Object.prototype.hasOwnProperty.call(_handlers, key)) {
handlers = _handlers[key]; handlers = _handlers[key];
for (i = 0; i < handlers.length;) { for (i = 0; i < handlers.length;) {
@ -252,8 +244,8 @@ function deleteScope(scope, newScope) {
// 清除修饰键 // 清除修饰键
function clearModifier(event) { function clearModifier(event) {
var key = event.keyCode || event.which || event.charCode; let key = event.keyCode || event.which || event.charCode;
var i = _downKeys.indexOf(key); const i = _downKeys.indexOf(key);
// 从列表中清除按压过的键 // 从列表中清除按压过的键
if (i >= 0) { if (i >= 0) {
@ -270,18 +262,16 @@ function clearModifier(event) {
_mods[key] = false; _mods[key] = false;
// 将修饰键重置为false // 将修饰键重置为false
for (var k in _modifier) if (_modifier[k] === key) hotkeys[k] = false; for (const k in _modifier) if (_modifier[k] === key) hotkeys[k] = false;
} }
} }
function unbind(keysInfo) { function unbind(keysInfo) {
// unbind(), unbind all keys // unbind(), unbind all keys
if (typeof keysInfo === 'undefined') { if (typeof keysInfo === 'undefined') {
Object.keys(_handlers).forEach(function (key) { Object.keys(_handlers).forEach(key => delete _handlers[key]);
return delete _handlers[key];
});
} else if (Array.isArray(keysInfo)) { } else if (Array.isArray(keysInfo)) {
// support like : unbind([{key: 'ctrl+a', scope: 's1'}, {key: 'ctrl-a', scope: 's2', splitKey: '-'}]) // support like : unbind([{key: 'ctrl+a', scope: 's1'}, {key: 'ctrl-a', scope: 's2', splitKey: '-'}])
keysInfo.forEach(function (info) { keysInfo.forEach(info => {
if (info.key) eachUnbind(info); if (info.key) eachUnbind(info);
}); });
} else if (typeof keysInfo === 'object') { } else if (typeof keysInfo === 'object') {
@ -293,41 +283,41 @@ function unbind(keysInfo) {
} }
// support old method // support old method
// eslint-disable-line // eslint-disable-line
var scope = args[0], let [scope, method] = args;
method = args[1];
if (typeof scope === 'function') { if (typeof scope === 'function') {
method = scope; method = scope;
scope = ''; scope = '';
} }
eachUnbind({ eachUnbind({
key: keysInfo, key: keysInfo,
scope: scope, scope,
method: method, method,
splitKey: '+' splitKey: '+'
}); });
} }
} }
// 解除绑定某个范围的快捷键 // 解除绑定某个范围的快捷键
var eachUnbind = function eachUnbind(_ref2) { const eachUnbind = _ref2 => {
var key = _ref2.key, let {
scope = _ref2.scope, key,
method = _ref2.method, scope,
_ref2$splitKey = _ref2.splitKey, method,
splitKey = _ref2$splitKey === void 0 ? '+' : _ref2$splitKey; splitKey = '+'
var multipleKeys = getKeys(key); } = _ref2;
multipleKeys.forEach(function (originKey) { const multipleKeys = getKeys(key);
var unbindKeys = originKey.split(splitKey); multipleKeys.forEach(originKey => {
var len = unbindKeys.length; const unbindKeys = originKey.split(splitKey);
var lastKey = unbindKeys[len - 1]; const len = unbindKeys.length;
var keyCode = lastKey === '*' ? '*' : code(lastKey); const lastKey = unbindKeys[len - 1];
const keyCode = lastKey === '*' ? '*' : code(lastKey);
if (!_handlers[keyCode]) return; if (!_handlers[keyCode]) return;
// 判断是否传入范围,没有就获取范围 // 判断是否传入范围,没有就获取范围
if (!scope) scope = getScope(); if (!scope) scope = getScope();
var mods = len > 1 ? getMods(_modifier, unbindKeys) : []; const mods = len > 1 ? getMods(_modifier, unbindKeys) : [];
_handlers[keyCode] = _handlers[keyCode].filter(function (record) { _handlers[keyCode] = _handlers[keyCode].filter(record => {
// 通过函数判断,是否解除绑定,函数相等直接返回 // 通过函数判断,是否解除绑定,函数相等直接返回
var isMatchingMethod = method ? record.method === method : true; const isMatchingMethod = method ? record.method === method : true;
return !(isMatchingMethod && record.scope === scope && compareArray(record.mods, mods)); return !(isMatchingMethod && record.scope === scope && compareArray(record.mods, mods));
}); });
}); });
@ -338,13 +328,13 @@ function eventHandler(event, handler, scope, element) {
if (handler.element !== element) { if (handler.element !== element) {
return; return;
} }
var modifiersMatch; let modifiersMatch;
// 看它是否在当前范围 // 看它是否在当前范围
if (handler.scope === scope || handler.scope === 'all') { if (handler.scope === scope || handler.scope === 'all') {
// 检查是否匹配修饰符如果有返回true // 检查是否匹配修饰符如果有返回true
modifiersMatch = handler.mods.length > 0; modifiersMatch = handler.mods.length > 0;
for (var y in _mods) { for (const y in _mods) {
if (Object.prototype.hasOwnProperty.call(_mods, y)) { if (Object.prototype.hasOwnProperty.call(_mods, y)) {
if (!_mods[y] && handler.mods.indexOf(+y) > -1 || _mods[y] && handler.mods.indexOf(+y) === -1) { if (!_mods[y] && handler.mods.indexOf(+y) > -1 || _mods[y] && handler.mods.indexOf(+y) === -1) {
modifiersMatch = false; modifiersMatch = false;
@ -367,8 +357,8 @@ function eventHandler(event, handler, scope, element) {
// 处理keydown事件 // 处理keydown事件
function dispatch(event, element) { function dispatch(event, element) {
var asterisk = _handlers['*']; const asterisk = _handlers['*'];
var key = event.keyCode || event.which || event.charCode; let key = event.keyCode || event.which || event.charCode;
// 表单控件过滤 默认表单控件不触发快捷键 // 表单控件过滤 默认表单控件不触发快捷键
if (!hotkeys.filter.call(this, event)) return; if (!hotkeys.filter.call(this, event)) return;
@ -388,8 +378,8 @@ function dispatch(event, element) {
* Jest test cases are required. * Jest test cases are required.
* =============================== * ===============================
*/ */
['ctrlKey', 'altKey', 'shiftKey', 'metaKey'].forEach(function (keyName) { ['ctrlKey', 'altKey', 'shiftKey', 'metaKey'].forEach(keyName => {
var keyNum = modifierMap[keyName]; const keyNum = modifierMap[keyName];
if (event[keyName] && _downKeys.indexOf(keyNum) === -1) { if (event[keyName] && _downKeys.indexOf(keyNum) === -1) {
_downKeys.push(keyNum); _downKeys.push(keyNum);
} else if (!event[keyName] && _downKeys.indexOf(keyNum) > -1) { } else if (!event[keyName] && _downKeys.indexOf(keyNum) > -1) {
@ -412,14 +402,14 @@ function dispatch(event, element) {
_mods[key] = true; _mods[key] = true;
// 将特殊字符的key注册到 hotkeys 上 // 将特殊字符的key注册到 hotkeys 上
for (var k in _modifier) { for (const k in _modifier) {
if (_modifier[k] === key) hotkeys[k] = true; if (_modifier[k] === key) hotkeys[k] = true;
} }
if (!asterisk) return; if (!asterisk) return;
} }
// 将 modifierMap 里面的修饰键绑定到 event 中 // 将 modifierMap 里面的修饰键绑定到 event 中
for (var e in _mods) { for (const e in _mods) {
if (Object.prototype.hasOwnProperty.call(_mods, e)) { if (Object.prototype.hasOwnProperty.call(_mods, e)) {
_mods[e] = event[modifierMap[e]]; _mods[e] = event[modifierMap[e]];
} }
@ -442,10 +432,10 @@ function dispatch(event, element) {
} }
// 获取范围 默认为 `all` // 获取范围 默认为 `all`
var scope = getScope(); const scope = getScope();
// 对任何快捷键都需要做的处理 // 对任何快捷键都需要做的处理
if (asterisk) { if (asterisk) {
for (var i = 0; i < asterisk.length; i++) { for (let i = 0; i < asterisk.length; i++) {
if (asterisk[i].scope === scope && (event.type === 'keydown' && asterisk[i].keydown || event.type === 'keyup' && asterisk[i].keyup)) { if (asterisk[i].scope === scope && (event.type === 'keydown' && asterisk[i].keydown || event.type === 'keyup' && asterisk[i].keyup)) {
eventHandler(event, asterisk[i], scope, element); eventHandler(event, asterisk[i], scope, element);
} }
@ -453,14 +443,16 @@ function dispatch(event, element) {
} }
// key 不在 _handlers 中返回 // key 不在 _handlers 中返回
if (!(key in _handlers)) return; if (!(key in _handlers)) return;
for (var _i = 0; _i < _handlers[key].length; _i++) { for (let i = 0; i < _handlers[key].length; i++) {
if (event.type === 'keydown' && _handlers[key][_i].keydown || event.type === 'keyup' && _handlers[key][_i].keyup) { if (event.type === 'keydown' && _handlers[key][i].keydown || event.type === 'keyup' && _handlers[key][i].keyup) {
if (_handlers[key][_i].key) { if (_handlers[key][i].key) {
var record = _handlers[key][_i]; const record = _handlers[key][i];
var splitKey = record.splitKey; const {
var keyShortcut = record.key.split(splitKey); splitKey
var _downKeysCurrent = []; // 记录当前按键键值 } = record;
for (var a = 0; a < keyShortcut.length; a++) { const keyShortcut = record.key.split(splitKey);
const _downKeysCurrent = []; // 记录当前按键键值
for (let a = 0; a < keyShortcut.length; a++) {
_downKeysCurrent.push(code(keyShortcut[a])); _downKeysCurrent.push(code(keyShortcut[a]));
} }
if (_downKeysCurrent.sort().join('') === _downKeys.sort().join('')) { if (_downKeysCurrent.sort().join('') === _downKeys.sort().join('')) {
@ -478,15 +470,16 @@ function isElementBind(element) {
} }
function hotkeys(key, option, method) { function hotkeys(key, option, method) {
_downKeys = []; _downKeys = [];
var keys = getKeys(key); // 需要处理的快捷键列表 const keys = getKeys(key); // 需要处理的快捷键列表
var mods = []; let mods = [];
var scope = 'all'; // scope默认为all所有范围都有效 let scope = 'all'; // scope默认为all所有范围都有效
var element = document; // 快捷键事件绑定节点 let element = document; // 快捷键事件绑定节点
var i = 0; let i = 0;
var keyup = false; let keyup = false;
var keydown = true; let keydown = true;
var splitKey = '+'; let splitKey = '+';
var capture = false; let capture = false;
let single = false; // 单个callback
// 对为设定范围的判断 // 对为设定范围的判断
if (method === undefined && typeof option === 'function') { if (method === undefined && typeof option === 'function') {
@ -499,9 +492,8 @@ function hotkeys(key, option, method) {
if (option.keydown !== undefined) keydown = option.keydown; // eslint-disable-line if (option.keydown !== undefined) keydown = option.keydown; // eslint-disable-line
if (option.capture !== undefined) capture = option.capture; // eslint-disable-line if (option.capture !== undefined) capture = option.capture; // eslint-disable-line
if (typeof option.splitKey === 'string') splitKey = option.splitKey; // eslint-disable-line if (typeof option.splitKey === 'string') splitKey = option.splitKey; // eslint-disable-line
if (option.singleton === true) ; // eslint-disable-line if (option.single === true) single = true; // eslint-disable-line
} }
if (typeof option === 'string') scope = option; if (typeof option === 'string') scope = option;
// 对于每个快捷键进行处理 // 对于每个快捷键进行处理
@ -518,72 +510,72 @@ function hotkeys(key, option, method) {
// 判断key是否在_handlers中不在就赋一个空数组 // 判断key是否在_handlers中不在就赋一个空数组
if (!(key in _handlers)) _handlers[key] = []; if (!(key in _handlers)) _handlers[key] = [];
// 如果只允许单个callback重新设置_handlers
if (single) _handlers[key] = [];
_handlers[key].push({ _handlers[key].push({
keyup: keyup, keyup,
keydown: keydown, keydown,
scope: scope, scope,
mods: mods, mods,
shortcut: keys[i], shortcut: keys[i],
method: method, method,
key: keys[i], key: keys[i],
splitKey: splitKey, splitKey,
element: element element
}); });
} }
// 在全局document上设置快捷键 // 在全局document上设置快捷键
if (typeof element !== 'undefined' && !isElementBind(element) && window) { if (typeof element !== 'undefined' && !isElementBind(element) && window) {
elementHasBindEvent.push(element); elementHasBindEvent.push(element);
addEvent(element, 'keydown', function (e) { addEvent(element, 'keydown', e => {
dispatch(e, element); dispatch(e, element);
}, capture); }, capture);
if (!winListendFocus) { if (!winListendFocus) {
winListendFocus = true; winListendFocus = true;
addEvent(window, 'focus', function () { addEvent(window, 'focus', () => {
_downKeys = []; _downKeys = [];
}, capture); }, capture);
} }
addEvent(element, 'keyup', function (e) { addEvent(element, 'keyup', e => {
dispatch(e, element); dispatch(e, element);
clearModifier(e); clearModifier(e);
}, capture); }, capture);
} }
} }
function trigger(shortcut) { function trigger(shortcut) {
var scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'all'; let scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'all';
Object.keys(_handlers).forEach(function (key) { Object.keys(_handlers).forEach(key => {
var dataList = _handlers[key].filter(function (item) { const dataList = _handlers[key].filter(item => item.scope === scope && item.shortcut === shortcut);
return item.scope === scope && item.shortcut === shortcut; dataList.forEach(data => {
});
dataList.forEach(function (data) {
if (data && data.method) { if (data && data.method) {
data.method(); data.method();
} }
}); });
}); });
} }
var _api = { const _api = {
getPressedKeyString: getPressedKeyString, getPressedKeyString,
setScope: setScope, setScope,
getScope: getScope, getScope,
deleteScope: deleteScope, deleteScope,
getPressedKeyCodes: getPressedKeyCodes, getPressedKeyCodes,
getAllKeyCodes: getAllKeyCodes, getAllKeyCodes,
isPressed: isPressed, isPressed,
filter: filter, filter,
trigger: trigger, trigger,
unbind: unbind, unbind,
keyMap: _keyMap, keyMap: _keyMap,
modifier: _modifier, modifier: _modifier,
modifierMap: modifierMap modifierMap
}; };
for (var a in _api) { for (const a in _api) {
if (Object.prototype.hasOwnProperty.call(_api, a)) { if (Object.prototype.hasOwnProperty.call(_api, a)) {
hotkeys[a] = _api[a]; hotkeys[a] = _api[a];
} }
} }
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
var _hotkeys = window.hotkeys; const _hotkeys = window.hotkeys;
hotkeys.noConflict = function (deep) { hotkeys.noConflict = deep => {
if (deep && window.hotkeys === hotkeys) { if (deep && window.hotkeys === hotkeys) {
window.hotkeys = _hotkeys; window.hotkeys = _hotkeys;
} }

280
dist/hotkeys.js vendored

@ -1,9 +1,12 @@
/**! /**!
* hotkeys-js v3.12.2 * hotkeys-js v3.13.0
* A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies. * A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies.
* *
* Copyright (c) 2023 kenny wong <wowohoo@qq.com> * Copyright (c) 2023 kenny wong <wowohoo@qq.com>
* https://jaywcjlove.github.io/hotkeys-js * https://github.com/jaywcjlove/hotkeys-js.git
*
* @website: https://jaywcjlove.github.io/hotkeys-js
* Licensed under the MIT license * Licensed under the MIT license
*/ */
@ -13,14 +16,14 @@
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.hotkeys = factory()); (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.hotkeys = factory());
})(this, (function () { 'use strict'; })(this, (function () { 'use strict';
var isff = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase().indexOf('firefox') > 0 : false; const isff = typeof navigator !== 'undefined' ? navigator.userAgent.toLowerCase().indexOf('firefox') > 0 : false;
// 绑定事件 // 绑定事件
function addEvent(object, event, method, useCapture) { function addEvent(object, event, method, useCapture) {
if (object.addEventListener) { if (object.addEventListener) {
object.addEventListener(event, method, useCapture); object.addEventListener(event, method, useCapture);
} else if (object.attachEvent) { } else if (object.attachEvent) {
object.attachEvent("on".concat(event), function () { object.attachEvent("on".concat(event), () => {
method(window.event); method(window.event);
}); });
} }
@ -28,8 +31,8 @@
// 修饰键转换成对应的键码 // 修饰键转换成对应的键码
function getMods(modifier, key) { function getMods(modifier, key) {
var mods = key.slice(0, key.length - 1); const mods = key.slice(0, key.length - 1);
for (var i = 0; i < mods.length; i++) mods[i] = modifier[mods[i].toLowerCase()]; for (let i = 0; i < mods.length; i++) mods[i] = modifier[mods[i].toLowerCase()];
return mods; return mods;
} }
@ -37,8 +40,8 @@
function getKeys(key) { function getKeys(key) {
if (typeof key !== 'string') key = ''; if (typeof key !== 'string') key = '';
key = key.replace(/\s/g, ''); // 匹配任何空白字符,包括空格、制表符、换页符等等 key = key.replace(/\s/g, ''); // 匹配任何空白字符,包括空格、制表符、换页符等等
var keys = key.split(','); // 同时设置多个快捷键,以','分割 const keys = key.split(','); // 同时设置多个快捷键,以','分割
var index = keys.lastIndexOf(''); let index = keys.lastIndexOf('');
// 快捷键可能包含',',需特殊处理 // 快捷键可能包含',',需特殊处理
for (; index >= 0;) { for (; index >= 0;) {
@ -51,17 +54,17 @@
// 比较修饰键的数组 // 比较修饰键的数组
function compareArray(a1, a2) { function compareArray(a1, a2) {
var arr1 = a1.length >= a2.length ? a1 : a2; const arr1 = a1.length >= a2.length ? a1 : a2;
var arr2 = a1.length >= a2.length ? a2 : a1; const arr2 = a1.length >= a2.length ? a2 : a1;
var isIndex = true; let isIndex = true;
for (var i = 0; i < arr1.length; i++) { for (let i = 0; i < arr1.length; i++) {
if (arr2.indexOf(arr1[i]) === -1) isIndex = false; if (arr2.indexOf(arr1[i]) === -1) isIndex = false;
} }
return isIndex; return isIndex;
} }
// Special Keys // Special Keys
var _keyMap = { const _keyMap = {
backspace: 8, backspace: 8,
'⌫': 8, '⌫': 8,
tab: 9, tab: 9,
@ -116,7 +119,7 @@
}; };
// Modifier Keys // Modifier Keys
var _modifier = { const _modifier = {
// shiftKey // shiftKey
'⇧': 16, '⇧': 16,
shift: 16, shift: 16,
@ -133,7 +136,7 @@
cmd: 91, cmd: 91,
command: 91 command: 91
}; };
var modifierMap = { const modifierMap = {
16: 'shiftKey', 16: 'shiftKey',
18: 'altKey', 18: 'altKey',
17: 'ctrlKey', 17: 'ctrlKey',
@ -143,38 +146,28 @@
altKey: 18, altKey: 18,
metaKey: 91 metaKey: 91
}; };
var _mods = { const _mods = {
16: false, 16: false,
18: false, 18: false,
17: false, 17: false,
91: false 91: false
}; };
var _handlers = {}; const _handlers = {};
// F1~F12 special key // F1~F12 special key
for (var k = 1; k < 20; k++) { for (let k = 1; k < 20; k++) {
_keyMap["f".concat(k)] = 111 + k; _keyMap["f".concat(k)] = 111 + k;
} }
var _downKeys = []; // 记录摁下的绑定键 let _downKeys = []; // 记录摁下的绑定键
var winListendFocus = false; // window是否已经监听了focus事件 let winListendFocus = false; // window是否已经监听了focus事件
var _scope = 'all'; // 默认热键范围 let _scope = 'all'; // 默认热键范围
var elementHasBindEvent = []; // 已绑定事件的节点记录 const elementHasBindEvent = []; // 已绑定事件的节点记录
// 返回键码 // 返回键码
var code = function code(x) { const code = x => _keyMap[x.toLowerCase()] || _modifier[x.toLowerCase()] || x.toUpperCase().charCodeAt(0);
return _keyMap[x.toLowerCase()] || _modifier[x.toLowerCase()] || x.toUpperCase().charCodeAt(0); const getKey = x => Object.keys(_keyMap).find(k => _keyMap[k] === x);
}; const getModifier = x => Object.keys(_modifier).find(k => _modifier[k] === x);
var getKey = function getKey(x) {
return Object.keys(_keyMap).find(function (k) {
return _keyMap[k] === x;
});
};
var getModifier = function getModifier(x) {
return Object.keys(_modifier).find(function (k) {
return _modifier[k] === x;
});
};
// 设置获取当前范围(默认为'所有' // 设置获取当前范围(默认为'所有'
function setScope(scope) { function setScope(scope) {
@ -189,25 +182,23 @@
return _downKeys.slice(0); return _downKeys.slice(0);
} }
function getPressedKeyString() { function getPressedKeyString() {
return _downKeys.map(function (c) { return _downKeys.map(c => getKey(c) || getModifier(c) || String.fromCharCode(c));
return getKey(c) || getModifier(c) || String.fromCharCode(c);
});
} }
function getAllKeyCodes() { function getAllKeyCodes() {
var result = []; const result = [];
Object.keys(_handlers).forEach(function (k) { Object.keys(_handlers).forEach(k => {
_handlers[k].forEach(function (_ref) { _handlers[k].forEach(_ref => {
var key = _ref.key, let {
scope = _ref.scope, key,
mods = _ref.mods, scope,
shortcut = _ref.shortcut; mods,
shortcut
} = _ref;
result.push({ result.push({
scope: scope, scope,
shortcut: shortcut, shortcut,
mods: mods, mods,
keys: key.split('+').map(function (v) { keys: key.split('+').map(v => code(v))
return code(v);
})
}); });
}); });
}); });
@ -217,9 +208,11 @@
// 表单控件控件判断 返回 Boolean // 表单控件控件判断 返回 Boolean
// hotkey is effective only when filter return true // hotkey is effective only when filter return true
function filter(event) { function filter(event) {
var target = event.target || event.srcElement; const target = event.target || event.srcElement;
var tagName = target.tagName; const {
var flag = true; tagName
} = target;
let flag = true;
// ignore: isContentEditable === 'true', <input> and <textarea> when readOnly state is false, <select> // ignore: isContentEditable === 'true', <input> and <textarea> when readOnly state is false, <select>
if (target.isContentEditable || (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly) { if (target.isContentEditable || (tagName === 'INPUT' || tagName === 'TEXTAREA' || tagName === 'SELECT') && !target.readOnly) {
flag = false; flag = false;
@ -232,18 +225,17 @@
if (typeof keyCode === 'string') { if (typeof keyCode === 'string') {
keyCode = code(keyCode); // 转换成键码 keyCode = code(keyCode); // 转换成键码
} }
return _downKeys.indexOf(keyCode) !== -1; return _downKeys.indexOf(keyCode) !== -1;
} }
// 循环删除handlers中的所有 scope(范围) // 循环删除handlers中的所有 scope(范围)
function deleteScope(scope, newScope) { function deleteScope(scope, newScope) {
var handlers; let handlers;
var i; let i;
// 没有指定scope获取scope // 没有指定scope获取scope
if (!scope) scope = getScope(); if (!scope) scope = getScope();
for (var key in _handlers) { for (const key in _handlers) {
if (Object.prototype.hasOwnProperty.call(_handlers, key)) { if (Object.prototype.hasOwnProperty.call(_handlers, key)) {
handlers = _handlers[key]; handlers = _handlers[key];
for (i = 0; i < handlers.length;) { for (i = 0; i < handlers.length;) {
@ -258,8 +250,8 @@
// 清除修饰键 // 清除修饰键
function clearModifier(event) { function clearModifier(event) {
var key = event.keyCode || event.which || event.charCode; let key = event.keyCode || event.which || event.charCode;
var i = _downKeys.indexOf(key); const i = _downKeys.indexOf(key);
// 从列表中清除按压过的键 // 从列表中清除按压过的键
if (i >= 0) { if (i >= 0) {
@ -276,18 +268,16 @@
_mods[key] = false; _mods[key] = false;
// 将修饰键重置为false // 将修饰键重置为false
for (var k in _modifier) if (_modifier[k] === key) hotkeys[k] = false; for (const k in _modifier) if (_modifier[k] === key) hotkeys[k] = false;
} }
} }
function unbind(keysInfo) { function unbind(keysInfo) {
// unbind(), unbind all keys // unbind(), unbind all keys
if (typeof keysInfo === 'undefined') { if (typeof keysInfo === 'undefined') {
Object.keys(_handlers).forEach(function (key) { Object.keys(_handlers).forEach(key => delete _handlers[key]);
return delete _handlers[key];
});
} else if (Array.isArray(keysInfo)) { } else if (Array.isArray(keysInfo)) {
// support like : unbind([{key: 'ctrl+a', scope: 's1'}, {key: 'ctrl-a', scope: 's2', splitKey: '-'}]) // support like : unbind([{key: 'ctrl+a', scope: 's1'}, {key: 'ctrl-a', scope: 's2', splitKey: '-'}])
keysInfo.forEach(function (info) { keysInfo.forEach(info => {
if (info.key) eachUnbind(info); if (info.key) eachUnbind(info);
}); });
} else if (typeof keysInfo === 'object') { } else if (typeof keysInfo === 'object') {
@ -299,41 +289,41 @@
} }
// support old method // support old method
// eslint-disable-line // eslint-disable-line
var scope = args[0], let [scope, method] = args;
method = args[1];
if (typeof scope === 'function') { if (typeof scope === 'function') {
method = scope; method = scope;
scope = ''; scope = '';
} }
eachUnbind({ eachUnbind({
key: keysInfo, key: keysInfo,
scope: scope, scope,
method: method, method,
splitKey: '+' splitKey: '+'
}); });
} }
} }
// 解除绑定某个范围的快捷键 // 解除绑定某个范围的快捷键
var eachUnbind = function eachUnbind(_ref2) { const eachUnbind = _ref2 => {
var key = _ref2.key, let {
scope = _ref2.scope, key,
method = _ref2.method, scope,
_ref2$splitKey = _ref2.splitKey, method,
splitKey = _ref2$splitKey === void 0 ? '+' : _ref2$splitKey; splitKey = '+'
var multipleKeys = getKeys(key); } = _ref2;
multipleKeys.forEach(function (originKey) { const multipleKeys = getKeys(key);
var unbindKeys = originKey.split(splitKey); multipleKeys.forEach(originKey => {
var len = unbindKeys.length; const unbindKeys = originKey.split(splitKey);
var lastKey = unbindKeys[len - 1]; const len = unbindKeys.length;
var keyCode = lastKey === '*' ? '*' : code(lastKey); const lastKey = unbindKeys[len - 1];
const keyCode = lastKey === '*' ? '*' : code(lastKey);
if (!_handlers[keyCode]) return; if (!_handlers[keyCode]) return;
// 判断是否传入范围,没有就获取范围 // 判断是否传入范围,没有就获取范围
if (!scope) scope = getScope(); if (!scope) scope = getScope();
var mods = len > 1 ? getMods(_modifier, unbindKeys) : []; const mods = len > 1 ? getMods(_modifier, unbindKeys) : [];
_handlers[keyCode] = _handlers[keyCode].filter(function (record) { _handlers[keyCode] = _handlers[keyCode].filter(record => {
// 通过函数判断,是否解除绑定,函数相等直接返回 // 通过函数判断,是否解除绑定,函数相等直接返回
var isMatchingMethod = method ? record.method === method : true; const isMatchingMethod = method ? record.method === method : true;
return !(isMatchingMethod && record.scope === scope && compareArray(record.mods, mods)); return !(isMatchingMethod && record.scope === scope && compareArray(record.mods, mods));
}); });
}); });
@ -344,13 +334,13 @@
if (handler.element !== element) { if (handler.element !== element) {
return; return;
} }
var modifiersMatch; let modifiersMatch;
// 看它是否在当前范围 // 看它是否在当前范围
if (handler.scope === scope || handler.scope === 'all') { if (handler.scope === scope || handler.scope === 'all') {
// 检查是否匹配修饰符如果有返回true // 检查是否匹配修饰符如果有返回true
modifiersMatch = handler.mods.length > 0; modifiersMatch = handler.mods.length > 0;
for (var y in _mods) { for (const y in _mods) {
if (Object.prototype.hasOwnProperty.call(_mods, y)) { if (Object.prototype.hasOwnProperty.call(_mods, y)) {
if (!_mods[y] && handler.mods.indexOf(+y) > -1 || _mods[y] && handler.mods.indexOf(+y) === -1) { if (!_mods[y] && handler.mods.indexOf(+y) > -1 || _mods[y] && handler.mods.indexOf(+y) === -1) {
modifiersMatch = false; modifiersMatch = false;
@ -373,8 +363,8 @@
// 处理keydown事件 // 处理keydown事件
function dispatch(event, element) { function dispatch(event, element) {
var asterisk = _handlers['*']; const asterisk = _handlers['*'];
var key = event.keyCode || event.which || event.charCode; let key = event.keyCode || event.which || event.charCode;
// 表单控件过滤 默认表单控件不触发快捷键 // 表单控件过滤 默认表单控件不触发快捷键
if (!hotkeys.filter.call(this, event)) return; if (!hotkeys.filter.call(this, event)) return;
@ -394,8 +384,8 @@
* Jest test cases are required. * Jest test cases are required.
* =============================== * ===============================
*/ */
['ctrlKey', 'altKey', 'shiftKey', 'metaKey'].forEach(function (keyName) { ['ctrlKey', 'altKey', 'shiftKey', 'metaKey'].forEach(keyName => {
var keyNum = modifierMap[keyName]; const keyNum = modifierMap[keyName];
if (event[keyName] && _downKeys.indexOf(keyNum) === -1) { if (event[keyName] && _downKeys.indexOf(keyNum) === -1) {
_downKeys.push(keyNum); _downKeys.push(keyNum);
} else if (!event[keyName] && _downKeys.indexOf(keyNum) > -1) { } else if (!event[keyName] && _downKeys.indexOf(keyNum) > -1) {
@ -418,14 +408,14 @@
_mods[key] = true; _mods[key] = true;
// 将特殊字符的key注册到 hotkeys 上 // 将特殊字符的key注册到 hotkeys 上
for (var k in _modifier) { for (const k in _modifier) {
if (_modifier[k] === key) hotkeys[k] = true; if (_modifier[k] === key) hotkeys[k] = true;
} }
if (!asterisk) return; if (!asterisk) return;
} }
// 将 modifierMap 里面的修饰键绑定到 event 中 // 将 modifierMap 里面的修饰键绑定到 event 中
for (var e in _mods) { for (const e in _mods) {
if (Object.prototype.hasOwnProperty.call(_mods, e)) { if (Object.prototype.hasOwnProperty.call(_mods, e)) {
_mods[e] = event[modifierMap[e]]; _mods[e] = event[modifierMap[e]];
} }
@ -448,10 +438,10 @@
} }
// 获取范围 默认为 `all` // 获取范围 默认为 `all`
var scope = getScope(); const scope = getScope();
// 对任何快捷键都需要做的处理 // 对任何快捷键都需要做的处理
if (asterisk) { if (asterisk) {
for (var i = 0; i < asterisk.length; i++) { for (let i = 0; i < asterisk.length; i++) {
if (asterisk[i].scope === scope && (event.type === 'keydown' && asterisk[i].keydown || event.type === 'keyup' && asterisk[i].keyup)) { if (asterisk[i].scope === scope && (event.type === 'keydown' && asterisk[i].keydown || event.type === 'keyup' && asterisk[i].keyup)) {
eventHandler(event, asterisk[i], scope, element); eventHandler(event, asterisk[i], scope, element);
} }
@ -459,14 +449,16 @@
} }
// key 不在 _handlers 中返回 // key 不在 _handlers 中返回
if (!(key in _handlers)) return; if (!(key in _handlers)) return;
for (var _i = 0; _i < _handlers[key].length; _i++) { for (let i = 0; i < _handlers[key].length; i++) {
if (event.type === 'keydown' && _handlers[key][_i].keydown || event.type === 'keyup' && _handlers[key][_i].keyup) { if (event.type === 'keydown' && _handlers[key][i].keydown || event.type === 'keyup' && _handlers[key][i].keyup) {
if (_handlers[key][_i].key) { if (_handlers[key][i].key) {
var record = _handlers[key][_i]; const record = _handlers[key][i];
var splitKey = record.splitKey; const {
var keyShortcut = record.key.split(splitKey); splitKey
var _downKeysCurrent = []; // 记录当前按键键值 } = record;
for (var a = 0; a < keyShortcut.length; a++) { const keyShortcut = record.key.split(splitKey);
const _downKeysCurrent = []; // 记录当前按键键值
for (let a = 0; a < keyShortcut.length; a++) {
_downKeysCurrent.push(code(keyShortcut[a])); _downKeysCurrent.push(code(keyShortcut[a]));
} }
if (_downKeysCurrent.sort().join('') === _downKeys.sort().join('')) { if (_downKeysCurrent.sort().join('') === _downKeys.sort().join('')) {
@ -484,15 +476,16 @@
} }
function hotkeys(key, option, method) { function hotkeys(key, option, method) {
_downKeys = []; _downKeys = [];
var keys = getKeys(key); // 需要处理的快捷键列表 const keys = getKeys(key); // 需要处理的快捷键列表
var mods = []; let mods = [];
var scope = 'all'; // scope默认为all所有范围都有效 let scope = 'all'; // scope默认为all所有范围都有效
var element = document; // 快捷键事件绑定节点 let element = document; // 快捷键事件绑定节点
var i = 0; let i = 0;
var keyup = false; let keyup = false;
var keydown = true; let keydown = true;
var splitKey = '+'; let splitKey = '+';
var capture = false; let capture = false;
let single = false; // 单个callback
// 对为设定范围的判断 // 对为设定范围的判断
if (method === undefined && typeof option === 'function') { if (method === undefined && typeof option === 'function') {
@ -505,9 +498,8 @@
if (option.keydown !== undefined) keydown = option.keydown; // eslint-disable-line if (option.keydown !== undefined) keydown = option.keydown; // eslint-disable-line
if (option.capture !== undefined) capture = option.capture; // eslint-disable-line if (option.capture !== undefined) capture = option.capture; // eslint-disable-line
if (typeof option.splitKey === 'string') splitKey = option.splitKey; // eslint-disable-line if (typeof option.splitKey === 'string') splitKey = option.splitKey; // eslint-disable-line
if (option.singleton === true) ; // eslint-disable-line if (option.single === true) single = true; // eslint-disable-line
} }
if (typeof option === 'string') scope = option; if (typeof option === 'string') scope = option;
// 对于每个快捷键进行处理 // 对于每个快捷键进行处理
@ -524,72 +516,72 @@
// 判断key是否在_handlers中不在就赋一个空数组 // 判断key是否在_handlers中不在就赋一个空数组
if (!(key in _handlers)) _handlers[key] = []; if (!(key in _handlers)) _handlers[key] = [];
// 如果只允许单个callback重新设置_handlers
if (single) _handlers[key] = [];
_handlers[key].push({ _handlers[key].push({
keyup: keyup, keyup,
keydown: keydown, keydown,
scope: scope, scope,
mods: mods, mods,
shortcut: keys[i], shortcut: keys[i],
method: method, method,
key: keys[i], key: keys[i],
splitKey: splitKey, splitKey,
element: element element
}); });
} }
// 在全局document上设置快捷键 // 在全局document上设置快捷键
if (typeof element !== 'undefined' && !isElementBind(element) && window) { if (typeof element !== 'undefined' && !isElementBind(element) && window) {
elementHasBindEvent.push(element); elementHasBindEvent.push(element);
addEvent(element, 'keydown', function (e) { addEvent(element, 'keydown', e => {
dispatch(e, element); dispatch(e, element);
}, capture); }, capture);
if (!winListendFocus) { if (!winListendFocus) {
winListendFocus = true; winListendFocus = true;
addEvent(window, 'focus', function () { addEvent(window, 'focus', () => {
_downKeys = []; _downKeys = [];
}, capture); }, capture);
} }
addEvent(element, 'keyup', function (e) { addEvent(element, 'keyup', e => {
dispatch(e, element); dispatch(e, element);
clearModifier(e); clearModifier(e);
}, capture); }, capture);
} }
} }
function trigger(shortcut) { function trigger(shortcut) {
var scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'all'; let scope = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'all';
Object.keys(_handlers).forEach(function (key) { Object.keys(_handlers).forEach(key => {
var dataList = _handlers[key].filter(function (item) { const dataList = _handlers[key].filter(item => item.scope === scope && item.shortcut === shortcut);
return item.scope === scope && item.shortcut === shortcut; dataList.forEach(data => {
});
dataList.forEach(function (data) {
if (data && data.method) { if (data && data.method) {
data.method(); data.method();
} }
}); });
}); });
} }
var _api = { const _api = {
getPressedKeyString: getPressedKeyString, getPressedKeyString,
setScope: setScope, setScope,
getScope: getScope, getScope,
deleteScope: deleteScope, deleteScope,
getPressedKeyCodes: getPressedKeyCodes, getPressedKeyCodes,
getAllKeyCodes: getAllKeyCodes, getAllKeyCodes,
isPressed: isPressed, isPressed,
filter: filter, filter,
trigger: trigger, trigger,
unbind: unbind, unbind,
keyMap: _keyMap, keyMap: _keyMap,
modifier: _modifier, modifier: _modifier,
modifierMap: modifierMap modifierMap
}; };
for (var a in _api) { for (const a in _api) {
if (Object.prototype.hasOwnProperty.call(_api, a)) { if (Object.prototype.hasOwnProperty.call(_api, a)) {
hotkeys[a] = _api[a]; hotkeys[a] = _api[a];
} }
} }
if (typeof window !== 'undefined') { if (typeof window !== 'undefined') {
var _hotkeys = window.hotkeys; const _hotkeys = window.hotkeys;
hotkeys.noConflict = function (deep) { hotkeys.noConflict = deep => {
if (deep && window.hotkeys === hotkeys) { if (deep && window.hotkeys === hotkeys) {
window.hotkeys = _hotkeys; window.hotkeys = _hotkeys;
} }

File diff suppressed because one or more lines are too long

@ -1,7 +1,7 @@
{ {
"name": "hotkeys-js", "name": "hotkeys-js",
"description": "A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies.", "description": "A simple micro-library for defining and dispatching keyboard shortcuts. It has no dependencies.",
"version": "3.12.2", "version": "3.13.0",
"main": "index.js", "main": "index.js",
"types": "index.d.ts", "types": "index.d.ts",
"module": "dist/hotkeys.esm.js", "module": "dist/hotkeys.esm.js",

Loading…
Cancel
Save