X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/1fc994177f92ade173d43c30be735cf11cb40f88..refs/pull/3875/head:/resources/js/components/shortcuts.js diff --git a/resources/js/components/shortcuts.js b/resources/js/components/shortcuts.js index a3cca5ddc..a87213b2e 100644 --- a/resources/js/components/shortcuts.js +++ b/resources/js/components/shortcuts.js @@ -1,34 +1,4 @@ -/** - * The default mapping of unique id to shortcut key. - * @type {Object} - */ -const defaultMap = { - // Header actions - "home": "1", - "shelves_view": "2", - "books_view": "3", - "settings_view": "4", - "favorites_view": "5", - "profile_view": "6", - "global_search": "/", - "logout": "0", - - // Generic actions - "edit": "e", - "new": "n", - "copy": "c", - "delete": "d", - "favorite": "f", - "export": "x", - "sort": "s", - "permissions": "p", - "move": "m", - "revisions": "r", - - // Navigation - "next": "ArrowRight", - "prev": "ArrowLeft", -}; +import {Component} from "./component"; function reverseMap(map) { const reversed = {}; @@ -38,21 +8,17 @@ function reverseMap(map) { return reversed; } -/** - * @extends {Component} - */ -class Shortcuts { + +export class Shortcuts extends Component { setup() { this.container = this.$el; - this.mapById = defaultMap; + this.mapById = JSON.parse(this.$opts.keyMap); this.mapByShortcut = reverseMap(this.mapById); this.hintsShowing = false; this.hideHints = this.hideHints.bind(this); - // TODO - Allow custom key maps - // TODO - Allow turning off shortcuts this.setupListeners(); } @@ -64,13 +30,7 @@ class Shortcuts { return; } - const shortcutId = this.mapByShortcut[event.key]; - if (shortcutId) { - const wasHandled = this.runShortcut(shortcutId); - if (wasHandled) { - event.preventDefault(); - } - } + this.handleShortcutPress(event); }); window.addEventListener('keydown', event => { @@ -80,6 +40,28 @@ class Shortcuts { }); } + /** + * @param {KeyboardEvent} event + */ + handleShortcutPress(event) { + + const keys = [ + event.ctrlKey ? 'Ctrl' : '', + event.metaKey ? 'Cmd' : '', + event.key, + ]; + + const combo = keys.filter(s => Boolean(s)).join(' + '); + + const shortcutId = this.mapByShortcut[combo]; + if (shortcutId) { + const wasHandled = this.runShortcut(shortcutId); + if (wasHandled) { + event.preventDefault(); + } + } + } + /** * Run the given shortcut, and return a boolean to indicate if the event * was successfully handled by a shortcut action. @@ -88,7 +70,6 @@ class Shortcuts { */ runShortcut(id) { const el = this.container.querySelector(`[data-shortcut="${id}"]`); - console.info('Shortcut run', el); if (!el) { return false; } @@ -178,6 +159,4 @@ class Shortcuts { this.hintsShowing = false; } -} - -export default Shortcuts; \ No newline at end of file +} \ No newline at end of file