perf: improved keypress detector

This commit is contained in:
Fabio Di Stasio 2022-08-12 12:40:35 +02:00
parent 75c5a34095
commit 0f219cf9b7
4 changed files with 46 additions and 11 deletions

View File

@ -1,8 +1,8 @@
export const shortcutEvents: { [key: string]: { l18n: string; l18nParam?: string | number }} = {
'open-new-tab': { l18n: 'message.openNewTab' },
'close-tab': { l18n: 'message.closeTab' },
'next-tab': { l18n: 'message.nextTab' },
'prev-tab': { l18n: 'message.previousTab' },
export const shortcutEvents: { [key: string]: { l18n: string; l18nParam?: string | number; context?: 'tab' }} = {
'open-new-tab': { l18n: 'message.openNewTab', context: 'tab' },
'close-tab': { l18n: 'message.closeTab', context: 'tab' },
'next-tab': { l18n: 'message.nextTab', context: 'tab' },
'prev-tab': { l18n: 'message.previousTab', context: 'tab' },
'open-connections-modal': { l18n: 'message.allConnections' },
'toggle-console': { l18n: 'message.toggleConsole' }
};

View File

@ -33,6 +33,9 @@ const keyboardEvent: Ref<KeyboardEvent> = ref(null);
const pressedKeys = computed(() => {
const keys: string[] = [];
const singleKeysToIgnore = ['Dead', 'Backspace', 'ArrotLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown'];
const specialKeys = ['Control', 'Alt', 'AltGraph', 'Shift', 'Meta', 'CapsLock', 'ContextMenu', 'Escape'];
const keysFromCode = ['Space', 'Minus', 'Equal', 'Slash', 'Quote', 'Semicolon', 'Comma', 'Period', 'Backslash'];
if (keyboardEvent.value) {
if (keyboardEvent.value.altKey)
@ -40,12 +43,43 @@ const pressedKeys = computed(() => {
if (keyboardEvent.value.ctrlKey)
keys.push('Control');
if (keyboardEvent.value.metaKey && isMacOS)
keys.push('Meta');
if (keyboardEvent.value.shiftKey)
keys.push('Command');
if (keyboardEvent.value.shiftKey && keys.length)
keys.push('Shift');
if (keyboardEvent.value.code) {
if (!['Control', 'Alt', 'AltGraph', 'Shift', 'Meta', 'CapsLock', 'ContextMenu'].includes(keyboardEvent.value.key))
keys.push(keyboardEvent.value.code.replace('Digit', '').replace('Key', ''));
if (keys.length === 0 && (keyboardEvent.value.key.length === 1 || singleKeysToIgnore.includes(keyboardEvent.value.key)))
return t('message.invalidShortcutMessage');
else if (!specialKeys.includes(keyboardEvent.value.key)) {
if (keyboardEvent.value.key === 'Dead') {
keys.push(keyboardEvent.value.code
.replace('Digit', '')
.replace('Key', '')
.replace('Quote', '\'')
.replace('Backquote', '`'));
}
else if (keysFromCode.includes(keyboardEvent.value.code) || keyboardEvent.value.code.includes('Digit')) {
keys.push(keyboardEvent.value.code
.replace('Quote', '\'')
.replace('Semicolon', ';')
.replace('Slash', '/')
.replace('Backslash', '\\')
.replace('Comma', ',')
.replace('Period', '.')
.replace('Minus', '-')
.replace('Equal', '=')
.replace('Digit', '')
.replace('Key', ''));
}
else {
keys.push(keyboardEvent.value.key.length === 1
? keyboardEvent.value.key.toUpperCase()
: keyboardEvent.value.key
.replace('Arrow', '')
);
}
}
else
return t('message.invalidShortcutMessage');
}
}

View File

@ -118,7 +118,7 @@ const parseKeys = (keys: {[key: number]: string}[]) => {
`<code class="text-bold">${sk}</code>`
)))
.join('+')
.replaceAll('CommandOrControl', isMacOS ? 'CMD' : 'CTRL')
.replaceAll('CommandOrControl', isMacOS ? '`Command' : 'Control')
).join(', ');
};

View File

@ -308,7 +308,8 @@ export const enUS = {
restoreDefaults: 'Restore defaults',
restoreDefaultsQuestion: 'Do you confirm to restore default values?',
registerAShortcut: 'Register a shortcut',
deleteShortcut: 'Delete shortcut'
deleteShortcut: 'Delete shortcut',
invalidShortcutMessage: 'Invalid combination, continue to type'
},
faker: {
address: 'Address',