+import {Component} from './component';
+
function reverseMap(map) {
const reversed = {};
for (const [key, value] of Object.entries(map)) {
return reversed;
}
-/**
- * @extends {Component}
- */
-class Shortcuts {
+export class Shortcuts extends Component {
setup() {
this.container = this.$el;
setupListeners() {
window.addEventListener('keydown', event => {
-
if (event.target.closest('input, select, textarea')) {
return;
}
window.addEventListener('keydown', event => {
if (event.key === '?') {
- this.hintsShowing ? this.hideHints() : this.showHints();
+ const action = this.hintsShowing ? this.hideHints : this.showHints;
+ action();
}
});
}
* @param {KeyboardEvent} event
*/
handleShortcutPress(event) {
-
const keys = [
event.ctrlKey ? 'Ctrl' : '',
event.metaKey ? 'Cmd' : '',
*/
runShortcut(id) {
const el = this.container.querySelector(`[data-shortcut="${id}"]`);
- console.info('Shortcut run', el);
if (!el) {
return false;
}
return true;
}
- console.error(`Shortcut attempted to be ran for element type that does not have handling setup`, el);
+ console.error('Shortcut attempted to be ran for element type that does not have handling setup', el);
return false;
}
const linkage = document.createElement('div');
linkage.classList.add('shortcut-linkage');
- linkage.style.left = targetBounds.x + 'px';
- linkage.style.top = targetBounds.y + 'px';
- linkage.style.width = targetBounds.width + 'px';
- linkage.style.height = targetBounds.height + 'px';
+ linkage.style.left = `${targetBounds.x}px`;
+ linkage.style.top = `${targetBounds.y}px`;
+ linkage.style.width = `${targetBounds.width}px`;
+ linkage.style.height = `${targetBounds.height}px`;
wrapper.append(label, linkage);
this.hintsShowing = false;
}
-}
-export default Shortcuts;
\ No newline at end of file
+}