mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-14 03:07:57 +01:00
Revert "Revert "Revert "Clean up keyboard handle code."""
This reverts commit 2220839bba
.
This commit is contained in:
parent
2220839bba
commit
cbc4196231
112
libraries/jquery.hotkeys.js
Normal file
112
libraries/jquery.hotkeys.js
Normal file
@ -0,0 +1,112 @@
|
|||||||
|
/*
|
||||||
|
* jQuery Hotkeys Plugin
|
||||||
|
* Copyright 2010, John Resig
|
||||||
|
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||||
|
*
|
||||||
|
* Based upon the plugin by Tzury Bar Yochay:
|
||||||
|
* http://github.com/tzuryby/hotkeys
|
||||||
|
*
|
||||||
|
* Original idea by:
|
||||||
|
* Binny V A, http://www.openjs.com/scripts/events/keyboard_shortcuts/
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
* One small change is: now keys are passed by object { keys: '...' }
|
||||||
|
* Might be useful, when you want to pass some other data to your handler
|
||||||
|
*/
|
||||||
|
|
||||||
|
function initHotKeyPluggin(jQuery){
|
||||||
|
|
||||||
|
jQuery.hotkeys = {
|
||||||
|
version: "0.8",
|
||||||
|
|
||||||
|
specialKeys: {
|
||||||
|
8: "backspace", 9: "tab", 10: "return", 13: "enter", 16: "shift", 17: "ctrl", 18: "alt", 19: "pause",
|
||||||
|
20: "capslock", 27: "esc", 32: "space", 33: "pageup", 34: "pagedown", 35: "end", 36: "home",
|
||||||
|
37: "left", 38: "up", 39: "right", 40: "down", 45: "insert", 46: "del",
|
||||||
|
96: "0", 97: "1", 98: "2", 99: "3", 100: "4", 101: "5", 102: "6", 103: "7",
|
||||||
|
104: "8", 105: "9", 106: "*", 107: "+", 109: "-", 110: ".", 111 : "/",
|
||||||
|
112: "f1", 113: "f2", 114: "f3", 115: "f4", 116: "f5", 117: "f6", 118: "f7", 119: "f8",
|
||||||
|
120: "f9", 121: "f10", 122: "f11", 123: "f12", 144: "numlock", 145: "scroll", 186: ";", 191: "/",
|
||||||
|
220: "\\", 222: "'", 224: "meta"
|
||||||
|
},
|
||||||
|
|
||||||
|
shiftNums: {
|
||||||
|
"`": "~", "1": "!", "2": "@", "3": "#", "4": "$", "5": "%", "6": "^", "7": "&",
|
||||||
|
"8": "*", "9": "(", "0": ")", "-": "_", "=": "+", ";": ": ", "'": "\"", ",": "<",
|
||||||
|
".": ">", "/": "?", "\\": "|"
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
function keyHandler( handleObj ) {
|
||||||
|
if ( typeof handleObj.data === "string" ) {
|
||||||
|
handleObj.data = { keys: handleObj.data };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Only care when a possible input has been specified
|
||||||
|
if ( !handleObj.data || !handleObj.data.keys || typeof handleObj.data.keys !== "string" ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var origHandler = handleObj.handler,
|
||||||
|
keys = handleObj.data.keys.toLowerCase().split(" "),
|
||||||
|
textAcceptingInputTypes = ["text", "password", "number", "email", "url", "range", "date", "month", "week", "time", "datetime", "datetime-local", "search", "color", "tel"];
|
||||||
|
|
||||||
|
handleObj.handler = function( event ) {
|
||||||
|
// Don't fire in text-accepting inputs that we didn't directly bind to
|
||||||
|
if ( this !== event.target && (/textarea|select/i.test( event.target.nodeName ) ||
|
||||||
|
jQuery.inArray(event.target.type, textAcceptingInputTypes) > -1 ) ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var special = jQuery.hotkeys.specialKeys[ event.keyCode ],
|
||||||
|
character = String.fromCharCode( event.which ).toLowerCase(),
|
||||||
|
modif = "", possible = {};
|
||||||
|
|
||||||
|
// check combinations (alt|ctrl|shift+anything)
|
||||||
|
if ( event.altKey && special !== "alt" ) {
|
||||||
|
modif += "alt+";
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( event.ctrlKey && special !== "ctrl" ) {
|
||||||
|
modif += "ctrl+";
|
||||||
|
}
|
||||||
|
|
||||||
|
// TODO: Need to make sure this works consistently across platforms
|
||||||
|
if ( event.metaKey && !event.ctrlKey && special !== "meta" ) {
|
||||||
|
modif += "meta+";
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( event.shiftKey && special !== "shift" ) {
|
||||||
|
modif += "shift+";
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( special ) {
|
||||||
|
possible[ modif + special ] = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( character ) {
|
||||||
|
possible[ modif + character ] = true;
|
||||||
|
possible[ modif + jQuery.hotkeys.shiftNums[ character ] ] = true;
|
||||||
|
|
||||||
|
// "$" can be triggered as "Shift+4" or "Shift+$" or just "$"
|
||||||
|
if ( modif === "shift+" ) {
|
||||||
|
possible[ jQuery.hotkeys.shiftNums[ character ] ] = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for ( var i = 0, l = keys.length; i < l; i++ ) {
|
||||||
|
if ( possible[ keys[i] ] ) {
|
||||||
|
return origHandler.apply( this, arguments );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
jQuery.each([ "keydown", "keyup", "keypress" ], function() {
|
||||||
|
jQuery.event.special[ this ] = { add: keyHandler };
|
||||||
|
});
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
export default initHotKeyPluggin;
|
@ -28,8 +28,6 @@ class DesignerKeyboard extends Keyboard {
|
|||||||
|
|
||||||
static _disabled: boolean;
|
static _disabled: boolean;
|
||||||
|
|
||||||
private static inputExcludeKeys = ['Escape', 'F1', 'F3', 'F4', 'F5', 'F6', 'F7', 'F8', 'F9', 'F10', 'F11', 'F12'];
|
|
||||||
|
|
||||||
constructor(designer: Designer) {
|
constructor(designer: Designer) {
|
||||||
super();
|
super();
|
||||||
$assert(designer, 'designer can not be null');
|
$assert(designer, 'designer can not be null');
|
||||||
@ -270,13 +268,18 @@ class DesignerKeyboard extends Keyboard {
|
|||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
const excludes = ['Escape', 'F1', 'F3', 'F4', 'F5', 'F6', 'F7', 'F8', 'F9', 'F10', 'F11', 'F12'];
|
||||||
|
|
||||||
$(document).on('keypress', (event) => {
|
$(document).on('keypress', (event) => {
|
||||||
if (DesignerKeyboard.isDisabled() || DesignerKeyboard.inputExcludeKeys.includes(event.code)) {
|
if (DesignerKeyboard.isDisabled()) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
// Firefox doesn't skip special keys for keypress event...
|
||||||
if (['Enter', 'CapsLock'].includes(event.code)) {
|
if (excludes.includes(event.code)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||||
|
if (['Enter', 'Capslock'].indexOf(event.code) === -1) {
|
||||||
const nodes = designer.getModel().filterSelectedTopics();
|
const nodes = designer.getModel().filterSelectedTopics();
|
||||||
if (nodes.length > 0) {
|
if (nodes.length > 0) {
|
||||||
// If a modifier is press, the key selected must be ignored.
|
// If a modifier is press, the key selected must be ignored.
|
||||||
@ -290,7 +293,7 @@ class DesignerKeyboard extends Keyboard {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
private _goToBrother(designer: Designer, node: Topic, direction: 'DOWN' | 'UP' | 'LEFT' | 'RIGHT') {
|
private _goToBrother(designer: Designer, node: Topic, direction) {
|
||||||
const parent = node.getParent();
|
const parent = node.getParent();
|
||||||
if (parent) {
|
if (parent) {
|
||||||
const brothers = parent.getChildren();
|
const brothers = parent.getChildren();
|
||||||
@ -403,6 +406,64 @@ class DesignerKeyboard extends Keyboard {
|
|||||||
return this._disabled;
|
return this._disabled;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
static specialKeys = {
|
||||||
|
8: 'backspace',
|
||||||
|
9: 'tab',
|
||||||
|
10: 'return',
|
||||||
|
13: 'enter',
|
||||||
|
16: 'shift',
|
||||||
|
17: 'ctrl',
|
||||||
|
18: 'alt',
|
||||||
|
19: 'pause',
|
||||||
|
20: 'capslock',
|
||||||
|
27: 'esc',
|
||||||
|
32: 'space',
|
||||||
|
33: 'pageup',
|
||||||
|
34: 'pagedown',
|
||||||
|
35: 'end',
|
||||||
|
36: 'home',
|
||||||
|
37: 'left',
|
||||||
|
38: 'up',
|
||||||
|
39: 'right',
|
||||||
|
40: 'down',
|
||||||
|
45: 'insert',
|
||||||
|
46: 'del',
|
||||||
|
96: '0',
|
||||||
|
97: '1',
|
||||||
|
98: '2',
|
||||||
|
99: '3',
|
||||||
|
100: '4',
|
||||||
|
101: '5',
|
||||||
|
102: '6',
|
||||||
|
103: '7',
|
||||||
|
104: '8',
|
||||||
|
105: '9',
|
||||||
|
106: '*',
|
||||||
|
107: '+',
|
||||||
|
109: '-',
|
||||||
|
110: '.',
|
||||||
|
111: '/',
|
||||||
|
112: 'f1',
|
||||||
|
113: 'f2',
|
||||||
|
114: 'f3',
|
||||||
|
115: 'f4',
|
||||||
|
116: 'f5',
|
||||||
|
117: 'f6',
|
||||||
|
118: 'f7',
|
||||||
|
119: 'f8',
|
||||||
|
120: 'f9',
|
||||||
|
121: 'f10',
|
||||||
|
122: 'f11',
|
||||||
|
123: 'f12',
|
||||||
|
144: 'numlock',
|
||||||
|
145: 'scroll',
|
||||||
|
186: ';',
|
||||||
|
191: '/',
|
||||||
|
220: '\\',
|
||||||
|
222: "'",
|
||||||
|
224: 'meta',
|
||||||
|
};
|
||||||
|
|
||||||
static getInstance() {
|
static getInstance() {
|
||||||
return this._instance;
|
return this._instance;
|
||||||
}
|
}
|
||||||
|
@ -18,10 +18,13 @@
|
|||||||
import { $defined } from '@wisemapping/core-js';
|
import { $defined } from '@wisemapping/core-js';
|
||||||
import $ from 'jquery';
|
import $ from 'jquery';
|
||||||
|
|
||||||
|
import initHotKeyPluggin from '../../../../libraries/jquery.hotkeys';
|
||||||
import Events from './Events';
|
import Events from './Events';
|
||||||
import ActionDispatcher from './ActionDispatcher';
|
import ActionDispatcher from './ActionDispatcher';
|
||||||
import Topic from './Topic';
|
import Topic from './Topic';
|
||||||
|
|
||||||
|
initHotKeyPluggin($);
|
||||||
|
|
||||||
class MultilineTextEditor extends Events {
|
class MultilineTextEditor extends Events {
|
||||||
private _topic: Topic;
|
private _topic: Topic;
|
||||||
|
|
||||||
@ -58,11 +61,12 @@ class MultilineTextEditor extends Events {
|
|||||||
private _registerEvents(containerElem: JQuery) {
|
private _registerEvents(containerElem: JQuery) {
|
||||||
const textareaElem = this._getTextareaElem();
|
const textareaElem = this._getTextareaElem();
|
||||||
textareaElem.on('keydown', (event) => {
|
textareaElem.on('keydown', (event) => {
|
||||||
switch (event.code) {
|
const j: any = $;
|
||||||
case 'Escape':
|
switch (j.hotkeys.specialKeys[event.keyCode]) {
|
||||||
|
case 'esc':
|
||||||
this.close(false);
|
this.close(false);
|
||||||
break;
|
break;
|
||||||
case 'Enter': {
|
case 'enter': {
|
||||||
if (event.metaKey || event.ctrlKey) {
|
if (event.metaKey || event.ctrlKey) {
|
||||||
// Add return ...
|
// Add return ...
|
||||||
const text = this._getTextAreaText();
|
const text = this._getTextAreaText();
|
||||||
|
Loading…
Reference in New Issue
Block a user