2023-04-04 15:43:43 +03:00
|
|
|
import Component from '@glimmer/component';
|
|
|
|
import {action} from '@ember/object';
|
|
|
|
import {tracked} from '@glimmer/tracking';
|
|
|
|
|
|
|
|
export default class ListComponent extends Component {
|
|
|
|
@tracked ctrlPressed = false;
|
|
|
|
@tracked metaPressed = false;
|
|
|
|
@tracked shiftPressed = false;
|
|
|
|
|
|
|
|
get selectionList() {
|
|
|
|
return this.args.model;
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Required for shift behaviour
|
|
|
|
*/
|
|
|
|
get allIds() {
|
|
|
|
return this.args.all.map(a => a.id);
|
|
|
|
}
|
|
|
|
|
|
|
|
get actionKeyPressed() {
|
|
|
|
return this.ctrlPressed || this.metaPressed || this.shiftPressed;
|
|
|
|
}
|
|
|
|
|
|
|
|
willDestroy() {
|
|
|
|
super.willDestroy(...arguments);
|
2023-04-11 16:53:01 +03:00
|
|
|
window.removeEventListener('keydown', this.onKeyDown, {passive: true});
|
2023-04-04 15:43:43 +03:00
|
|
|
window.removeEventListener('keyup', this.onKeyUp, {passive: true});
|
|
|
|
window.removeEventListener('click', this.onWindowClicked, {passive: true});
|
2023-04-11 16:35:27 +03:00
|
|
|
window.removeEventListener('blur', this.onWindowBlur, {passive: true});
|
2023-04-04 15:43:43 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
@action
|
|
|
|
setup() {
|
|
|
|
window.addEventListener('keydown', this.onKeyDown, {passive: false});
|
|
|
|
window.addEventListener('keyup', this.onKeyUp, {passive: true});
|
|
|
|
window.addEventListener('click', this.onWindowClicked, {passive: true});
|
2023-04-11 16:35:27 +03:00
|
|
|
window.addEventListener('blur', this.onWindowBlur, {passive: true});
|
2023-04-04 15:43:43 +03:00
|
|
|
}
|
|
|
|
|
|
|
|
@action
|
|
|
|
onWindowClicked(event) {
|
|
|
|
// Clear selection if no ctrl/meta key is pressed
|
|
|
|
if (!event.metaKey && !event.ctrlKey) {
|
|
|
|
this.selectionList.clearSelection();
|
|
|
|
}
|
2023-04-14 10:44:06 +03:00
|
|
|
|
|
|
|
// Update the status (in case we didn't receive an keyup event)
|
|
|
|
this.shiftPressed = !!event.shiftKey;
|
|
|
|
this.metaPressed = !!event.metaKey;
|
|
|
|
this.ctrlPressed = !!event.ctrlKey;
|
2023-04-04 15:43:43 +03:00
|
|
|
}
|
|
|
|
|
2023-04-11 16:35:27 +03:00
|
|
|
@action
|
|
|
|
onWindowBlur() {
|
|
|
|
// This is required because the keyup event won't be fired again
|
|
|
|
this.ctrlPressed = false;
|
|
|
|
this.metaPressed = false;
|
|
|
|
this.shiftPressed = false;
|
|
|
|
}
|
|
|
|
|
2023-04-04 15:43:43 +03:00
|
|
|
@action
|
|
|
|
onKeyDown(event) {
|
|
|
|
if (event.key === 'Control') {
|
|
|
|
this.ctrlPressed = true;
|
|
|
|
}
|
|
|
|
if (event.key === 'Meta') {
|
|
|
|
this.metaPressed = true;
|
|
|
|
}
|
|
|
|
if (event.key === 'Shift') {
|
|
|
|
this.shiftPressed = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
if ((event.ctrlKey || event.metaKey) && !event.shiftKey) {
|
|
|
|
if (event.key === 'a') {
|
|
|
|
this.selectionList.selectAll();
|
|
|
|
event.preventDefault();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if (event.key === 'Escape') {
|
|
|
|
this.selectionList.clearSelection();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@action
|
|
|
|
onKeyUp(event) {
|
|
|
|
if (event.key === 'Control') {
|
|
|
|
this.ctrlPressed = false;
|
|
|
|
}
|
|
|
|
if (event.key === 'Meta') {
|
|
|
|
this.metaPressed = false;
|
|
|
|
}
|
|
|
|
if (event.key === 'Shift') {
|
|
|
|
this.shiftPressed = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|