@ux-aspects/ux-aspects
Version:
Open source user interface framework for building modern, responsive, mobile big data applications
75 lines • 10.4 kB
JavaScript
import { DOWN_ARROW, ENTER, SPACE, UP_ARROW } from '@angular/cdk/keycodes';
import { SelectionStrategy } from '../../../directives/selection/index';
export class MultipleSelectListStrategy extends SelectionStrategy {
/** Prevent the browser from highlighting text on shift click */
mousedown(event) {
event.preventDefault();
}
click(event, data) {
// activate the clicked item
this.selectionService.activate(data);
// if the shift key is pressed we want to perform a multiple selection
if (event.shiftKey) {
return this.multipleSelect(data);
}
// otherwise perform a single toggle selection
if (this.selectionService.isSelected(data)) {
this.deselect(data);
this._lastSelection = null;
}
else {
this.select(data);
this._lastSelection = data;
}
}
keydown(event, data) {
switch (event.which) {
case UP_ARROW: {
event.preventDefault();
const sibling = this.selectionService.activateSibling(true);
if (event.shiftKey) {
this.select(data, sibling);
this._lastSelection = sibling;
}
break;
}
case DOWN_ARROW: {
event.preventDefault();
const sibling = this.selectionService.activateSibling(false);
if (event.shiftKey) {
this.select(data, sibling);
this._lastSelection = sibling;
}
break;
}
case SPACE:
case ENTER:
event.preventDefault();
this.toggle(data);
this._lastSelection = this.selectionService.isSelected(data) ? data : null;
break;
}
}
multipleSelect(data) {
// if there is no start item selected
if (!this._lastSelection) {
this.select(data);
this._lastSelection = data;
return;
}
// if there already is a start item then find the items in the range
this.select(...this.getSelectedItems(this._lastSelection, data));
// store the selection end point
this._lastSelection = data;
}
getSelectedItems(start, end) {
// get the latest dataset
const { dataset } = this.selectionService;
// get the indexes of the start and end point
const startIdx = dataset.indexOf(start);
const endIdx = dataset.indexOf(end);
// get the region of the array that is selected - note the endIdx may be before the startIdx so account for this
return dataset.slice(Math.min(startIdx, endIdx), Math.max(startIdx, endIdx) + 1);
}
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibXVsdGlwbGUtc2VsZWN0LWxpc3Quc3RyYXRlZ3kuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvY29tcG9uZW50cy9zZWxlY3QtbGlzdC9zdHJhdGVnaWVzL211bHRpcGxlLXNlbGVjdC1saXN0LnN0cmF0ZWd5LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxRQUFRLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUMzRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxxQ0FBcUMsQ0FBQztBQUV4RSxNQUFNLE9BQU8sMEJBQThCLFNBQVEsaUJBQW9CO0lBSW5FLGdFQUFnRTtJQUNoRSxTQUFTLENBQUMsS0FBaUI7UUFDdkIsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQzNCLENBQUM7SUFFRCxLQUFLLENBQUMsS0FBaUIsRUFBRSxJQUFPO1FBRTVCLDRCQUE0QjtRQUM1QixJQUFJLENBQUMsZ0JBQWdCLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBRXJDLHNFQUFzRTtRQUN0RSxJQUFJLEtBQUssQ0FBQyxRQUFRLEVBQUUsQ0FBQztZQUNqQixPQUFPLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDckMsQ0FBQztRQUVELDhDQUE4QztRQUM5QyxJQUFJLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLEVBQUUsQ0FBQztZQUN6QyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1lBQ3BCLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDO1FBQy9CLENBQUM7YUFBTSxDQUFDO1lBQ0osSUFBSSxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsQ0FBQztZQUNsQixJQUFJLENBQUMsY0FBYyxHQUFHLElBQUksQ0FBQztRQUMvQixDQUFDO0lBQ0wsQ0FBQztJQUVELE9BQU8sQ0FBQyxLQUFvQixFQUFFLElBQU87UUFFakMsUUFBUSxLQUFLLENBQUMsS0FBSyxFQUFFLENBQUM7WUFFbEIsS0FBSyxRQUFRLENBQUMsQ0FBQyxDQUFDO2dCQUNaLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztnQkFDdkIsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsQ0FBQztnQkFFNUQsSUFBSSxLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7b0JBQ2pCLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxFQUFFLE9BQU8sQ0FBQyxDQUFDO29CQUMzQixJQUFJLENBQUMsY0FBYyxHQUFHLE9BQU8sQ0FBQztnQkFDbEMsQ0FBQztnQkFDRCxNQUFNO1lBQ1YsQ0FBQztZQUVELEtBQUssVUFBVSxDQUFDLENBQUMsQ0FBQztnQkFDZCxLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7Z0JBQ3ZCLE1BQU0sT0FBTyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxlQUFlLENBQUMsS0FBSyxDQUFDLENBQUM7Z0JBRTdELElBQUksS0FBSyxDQUFDLFFBQVEsRUFBRSxDQUFDO29CQUNqQixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxPQUFPLENBQUMsQ0FBQztvQkFDM0IsSUFBSSxDQUFDLGNBQWMsR0FBRyxPQUFPLENBQUM7Z0JBQ2xDLENBQUM7Z0JBQ0QsTUFBTTtZQUNWLENBQUM7WUFFRCxLQUFLLEtBQUssQ0FBQztZQUNYLEtBQUssS0FBSztnQkFDTixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7Z0JBQ3ZCLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUM7Z0JBQ2xCLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFVBQVUsQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7Z0JBQzNFLE1BQU07UUFDZCxDQUFDO0lBQ0wsQ0FBQztJQUVELGNBQWMsQ0FBQyxJQUFPO1FBRWxCLHFDQUFxQztRQUNyQyxJQUFJLENBQUMsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3ZCLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUM7WUFDbEIsSUFBSSxDQUFDLGNBQWMsR0FBRyxJQUFJLENBQUM7WUFDM0IsT0FBTztRQUNYLENBQUM7UUFFRCxvRUFBb0U7UUFDcEUsSUFBSSxDQUFDLE1BQU0sQ0FBQyxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsY0FBYyxFQUFFLElBQUksQ0FBQyxDQUFDLENBQUM7UUFFakUsZ0NBQWdDO1FBQ2hDLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDO0lBQy9CLENBQUM7SUFFTyxnQkFBZ0IsQ0FBQyxLQUFRLEVBQUUsR0FBTTtRQUVyQyx5QkFBeUI7UUFDekIsTUFBTSxFQUFFLE9BQU8sRUFBRSxHQUFHLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQztRQUUxQyw2Q0FBNkM7UUFDN0MsTUFBTSxRQUFRLEdBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUN4QyxNQUFNLE1BQU0sR0FBRyxPQUFPLENBQUMsT0FBTyxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBRXBDLGdIQUFnSDtRQUNoSCxPQUFPLE9BQU8sQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsTUFBTSxDQUFDLEVBQUUsSUFBSSxDQUFDLEdBQUcsQ0FBQyxRQUFRLEVBQUUsTUFBTSxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUM7SUFDckYsQ0FBQztDQUVKIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRE9XTl9BUlJPVywgRU5URVIsIFNQQUNFLCBVUF9BUlJPVyB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9rZXljb2Rlcyc7XG5pbXBvcnQgeyBTZWxlY3Rpb25TdHJhdGVneSB9IGZyb20gJy4uLy4uLy4uL2RpcmVjdGl2ZXMvc2VsZWN0aW9uL2luZGV4JztcblxuZXhwb3J0IGNsYXNzIE11bHRpcGxlU2VsZWN0TGlzdFN0cmF0ZWd5PFQ+IGV4dGVuZHMgU2VsZWN0aW9uU3RyYXRlZ3k8VD4ge1xuXG4gICAgcHJpdmF0ZSBfbGFzdFNlbGVjdGlvbjogVDtcblxuICAgIC8qKiBQcmV2ZW50IHRoZSBicm93c2VyIGZyb20gaGlnaGxpZ2h0aW5nIHRleHQgb24gc2hpZnQgY2xpY2sgKi9cbiAgICBtb3VzZWRvd24oZXZlbnQ6IE1vdXNlRXZlbnQpOiB2b2lkIHtcbiAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICB9XG5cbiAgICBjbGljayhldmVudDogTW91c2VFdmVudCwgZGF0YTogVCk6IHZvaWQge1xuXG4gICAgICAgIC8vIGFjdGl2YXRlIHRoZSBjbGlja2VkIGl0ZW1cbiAgICAgICAgdGhpcy5zZWxlY3Rpb25TZXJ2aWNlLmFjdGl2YXRlKGRhdGEpO1xuXG4gICAgICAgIC8vIGlmIHRoZSBzaGlmdCBrZXkgaXMgcHJlc3NlZCB3ZSB3YW50IHRvIHBlcmZvcm0gYSBtdWx0aXBsZSBzZWxlY3Rpb25cbiAgICAgICAgaWYgKGV2ZW50LnNoaWZ0S2V5KSB7XG4gICAgICAgICAgICByZXR1cm4gdGhpcy5tdWx0aXBsZVNlbGVjdChkYXRhKTtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIG90aGVyd2lzZSBwZXJmb3JtIGEgc2luZ2xlIHRvZ2dsZSBzZWxlY3Rpb25cbiAgICAgICAgaWYgKHRoaXMuc2VsZWN0aW9uU2VydmljZS5pc1NlbGVjdGVkKGRhdGEpKSB7XG4gICAgICAgICAgICB0aGlzLmRlc2VsZWN0KGRhdGEpO1xuICAgICAgICAgICAgdGhpcy5fbGFzdFNlbGVjdGlvbiA9IG51bGw7XG4gICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICB0aGlzLnNlbGVjdChkYXRhKTtcbiAgICAgICAgICAgIHRoaXMuX2xhc3RTZWxlY3Rpb24gPSBkYXRhO1xuICAgICAgICB9XG4gICAgfVxuXG4gICAga2V5ZG93bihldmVudDogS2V5Ym9hcmRFdmVudCwgZGF0YTogVCk6IHZvaWQge1xuXG4gICAgICAgIHN3aXRjaCAoZXZlbnQud2hpY2gpIHtcblxuICAgICAgICAgICAgY2FzZSBVUF9BUlJPVzoge1xuICAgICAgICAgICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgICAgICAgICAgICAgY29uc3Qgc2libGluZyA9IHRoaXMuc2VsZWN0aW9uU2VydmljZS5hY3RpdmF0ZVNpYmxpbmcodHJ1ZSk7XG5cbiAgICAgICAgICAgICAgICBpZiAoZXZlbnQuc2hpZnRLZXkpIHtcbiAgICAgICAgICAgICAgICAgICAgdGhpcy5zZWxlY3QoZGF0YSwgc2libGluZyk7XG4gICAgICAgICAgICAgICAgICAgIHRoaXMuX2xhc3RTZWxlY3Rpb24gPSBzaWJsaW5nO1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICBicmVhaztcbiAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgY2FzZSBET1dOX0FSUk9XOiB7XG4gICAgICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICAgICAgICBjb25zdCBzaWJsaW5nID0gdGhpcy5zZWxlY3Rpb25TZXJ2aWNlLmFjdGl2YXRlU2libGluZyhmYWxzZSk7XG5cbiAgICAgICAgICAgICAgICBpZiAoZXZlbnQuc2hpZnRLZXkpIHtcbiAgICAgICAgICAgICAgICAgICAgdGhpcy5zZWxlY3QoZGF0YSwgc2libGluZyk7XG4gICAgICAgICAgICAgICAgICAgIHRoaXMuX2xhc3RTZWxlY3Rpb24gPSBzaWJsaW5nO1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICBicmVhaztcbiAgICAgICAgICAgIH1cblxuICAgICAgICAgICAgY2FzZSBTUEFDRTpcbiAgICAgICAgICAgIGNhc2UgRU5URVI6XG4gICAgICAgICAgICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgICAgICAgICAgICB0aGlzLnRvZ2dsZShkYXRhKTtcbiAgICAgICAgICAgICAgICB0aGlzLl9sYXN0U2VsZWN0aW9uID0gdGhpcy5zZWxlY3Rpb25TZXJ2aWNlLmlzU2VsZWN0ZWQoZGF0YSkgPyBkYXRhIDogbnVsbDtcbiAgICAgICAgICAgICAgICBicmVhaztcbiAgICAgICAgfVxuICAgIH1cblxuICAgIG11bHRpcGxlU2VsZWN0KGRhdGE6IFQpOiB2b2lkIHtcblxuICAgICAgICAvLyBpZiB0aGVyZSBpcyBubyBzdGFydCBpdGVtIHNlbGVjdGVkXG4gICAgICAgIGlmICghdGhpcy5fbGFzdFNlbGVjdGlvbikge1xuICAgICAgICAgICAgdGhpcy5zZWxlY3QoZGF0YSk7XG4gICAgICAgICAgICB0aGlzLl9sYXN0U2VsZWN0aW9uID0gZGF0YTtcbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfVxuXG4gICAgICAgIC8vIGlmIHRoZXJlIGFscmVhZHkgaXMgYSBzdGFydCBpdGVtIHRoZW4gZmluZCB0aGUgaXRlbXMgaW4gdGhlIHJhbmdlXG4gICAgICAgIHRoaXMuc2VsZWN0KC4uLnRoaXMuZ2V0U2VsZWN0ZWRJdGVtcyh0aGlzLl9sYXN0U2VsZWN0aW9uLCBkYXRhKSk7XG5cbiAgICAgICAgLy8gc3RvcmUgdGhlIHNlbGVjdGlvbiBlbmQgcG9pbnRcbiAgICAgICAgdGhpcy5fbGFzdFNlbGVjdGlvbiA9IGRhdGE7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBnZXRTZWxlY3RlZEl0ZW1zKHN0YXJ0OiBULCBlbmQ6IFQpOiBUW10ge1xuXG4gICAgICAgIC8vIGdldCB0aGUgbGF0ZXN0IGRhdGFzZXRcbiAgICAgICAgY29uc3QgeyBkYXRhc2V0IH0gPSB0aGlzLnNlbGVjdGlvblNlcnZpY2U7XG5cbiAgICAgICAgLy8gZ2V0IHRoZSBpbmRleGVzIG9mIHRoZSBzdGFydCBhbmQgZW5kIHBvaW50XG4gICAgICAgIGNvbnN0IHN0YXJ0SWR4ID0gZGF0YXNldC5pbmRleE9mKHN0YXJ0KTtcbiAgICAgICAgY29uc3QgZW5kSWR4ID0gZGF0YXNldC5pbmRleE9mKGVuZCk7XG5cbiAgICAgICAgLy8gZ2V0IHRoZSByZWdpb24gb2YgdGhlIGFycmF5IHRoYXQgaXMgc2VsZWN0ZWQgLSBub3RlIHRoZSBlbmRJZHggbWF5IGJlIGJlZm9yZSB0aGUgc3RhcnRJZHggc28gYWNjb3VudCBmb3IgdGhpc1xuICAgICAgICByZXR1cm4gZGF0YXNldC5zbGljZShNYXRoLm1pbihzdGFydElkeCwgZW5kSWR4KSwgTWF0aC5tYXgoc3RhcnRJZHgsIGVuZElkeCkgKyAxKTtcbiAgICB9XG5cbn0iXX0=