Fixed broken shortcut hint overlay

Also updated event handler usage to use abort controller while there.
This commit is contained in:
Dan Brown 2023-04-26 01:42:12 +01:00
parent 55af22b487
commit dff45e2c5d
No known key found for this signature in database
GPG Key ID: 46D9F943C24A2EF9

View File

@ -18,6 +18,7 @@ export class Shortcuts extends Component {
this.hintsShowing = false; this.hintsShowing = false;
this.hideHints = this.hideHints.bind(this); this.hideHints = this.hideHints.bind(this);
this.hintAbortController = null;
this.setupListeners(); this.setupListeners();
} }
@ -33,8 +34,11 @@ export class Shortcuts extends Component {
window.addEventListener('keydown', event => { window.addEventListener('keydown', event => {
if (event.key === '?') { if (event.key === '?') {
const action = this.hintsShowing ? this.hideHints : this.showHints; if (this.hintsShowing) {
action(); this.hideHints();
} else {
this.showHints();
}
} }
}); });
} }
@ -111,10 +115,12 @@ export class Shortcuts extends Component {
displayedIds.add(id); displayedIds.add(id);
} }
window.addEventListener('scroll', this.hideHints); this.hintAbortController = new AbortController();
window.addEventListener('focus', this.hideHints); const signal = this.hintAbortController.signal;
window.addEventListener('blur', this.hideHints); window.addEventListener('scroll', this.hideHints, {signal});
window.addEventListener('click', this.hideHints); window.addEventListener('focus', this.hideHints, {signal});
window.addEventListener('blur', this.hideHints, {signal});
window.addEventListener('click', this.hideHints, {signal});
this.hintsShowing = true; this.hintsShowing = true;
} }
@ -149,12 +155,7 @@ export class Shortcuts extends Component {
hideHints() { hideHints() {
const wrapper = this.container.querySelector('.shortcut-container'); const wrapper = this.container.querySelector('.shortcut-container');
wrapper.remove(); wrapper.remove();
this.hintAbortController?.abort();
window.removeEventListener('scroll', this.hideHints);
window.removeEventListener('focus', this.hideHints);
window.removeEventListener('blur', this.hideHints);
window.removeEventListener('click', this.hideHints);
this.hintsShowing = false; this.hintsShowing = false;
} }