ng-reorder
Version:
Sort elements within a list by using drag-n-drop interface without any restrictions by direction
68 lines • 7.94 kB
JavaScript
import { Directive, ContentChildren, EventEmitter, NgZone, Output, Input, Self, } from '@angular/core';
import { DragUnitDirective as DragUnit, DRAG_COLLECTION } from './drag-unit.directive';
import { SortService } from './sort.service';
import { EventService } from './event.service';
export class DragCollectionDirective {
constructor(_zone, sortService) {
this._zone = _zone;
this.sortService = sortService;
this.dropCompleted = new EventEmitter();
this._activeItem = null;
}
get inAction() {
return this._activeItem !== null;
}
get disabled() {
return this._disabled;
}
ngAfterViewInit() {
this.sortService.initService(this);
}
clearChildren() {
this._zone.run(() => {
this.units.toArray().forEach(unit => unit.reset());
});
}
moveUnitTo(unit, point) {
this.sortService.moveUnits(unit, point);
}
start(unit, point) {
const units = this.units.toArray();
const from = units.indexOf(unit);
this.sortService.start(units, point, from);
this._activeItem = unit;
}
stop(unit) {
this.clearChildren();
this.sortService.stop(unit).then((e) => {
if (e.currentIndex !== null)
this.dropCompleted.emit(e);
});
this._activeItem = null;
}
}
DragCollectionDirective.decorators = [
{ type: Directive, args: [{
selector: '[dragCollection]',
providers: [
{ provide: DRAG_COLLECTION, useExisting: DragCollectionDirective },
EventService,
SortService
],
host: {
'[class.collection]': 'true',
'[class.in-action]': 'inAction',
'[class.disabled]': 'disabled'
}
},] }
];
DragCollectionDirective.ctorParameters = () => [
{ type: NgZone },
{ type: SortService, decorators: [{ type: Self }] }
];
DragCollectionDirective.propDecorators = {
_disabled: [{ type: Input, args: ['disabled',] }],
dropCompleted: [{ type: Output }],
units: [{ type: ContentChildren, args: [DragUnit,] }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sbGVjdGlvbi5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9wcm9qZWN0cy9uZy1yZW9yZGVyL3NyYy9saWIvY29sbGVjdGlvbi5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNOLFNBQVMsRUFDVCxlQUFlLEVBR2YsWUFBWSxFQUNaLE1BQU0sRUFDTixNQUFNLEVBQ04sS0FBSyxFQUNMLElBQUksR0FDSixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsaUJBQWlCLElBQUksUUFBUSxFQUFFLGVBQWUsRUFBRSxNQUFNLHVCQUF1QixDQUFDO0FBQ3ZGLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUM3QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFtQi9DLE1BQU0sT0FBTyx1QkFBdUI7SUFrQm5DLFlBQ1MsS0FBYSxFQUNMLFdBQXdCO1FBRGhDLFVBQUssR0FBTCxLQUFLLENBQVE7UUFDTCxnQkFBVyxHQUFYLFdBQVcsQ0FBYTtRQWhCdkIsa0JBQWEsR0FBbUMsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQWtCcEYsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7SUFDekIsQ0FBQztJQWJELElBQUksUUFBUTtRQUNYLE9BQU8sSUFBSSxDQUFDLFdBQVcsS0FBSyxJQUFJLENBQUM7SUFDbEMsQ0FBQztJQUVELElBQUksUUFBUTtRQUNYLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQztJQUN2QixDQUFDO0lBU0QsZUFBZTtRQUNkLElBQUksQ0FBQyxXQUFXLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ3BDLENBQUM7SUFFTyxhQUFhO1FBQ3BCLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLEdBQUcsRUFBRTtZQUNuQixJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxDQUFDO1FBQ3BELENBQUMsQ0FBQyxDQUFDO0lBQ0osQ0FBQztJQUVNLFVBQVUsQ0FBQyxJQUFjLEVBQUUsS0FBWTtRQUM3QyxJQUFJLENBQUMsV0FBVyxDQUFDLFNBQVMsQ0FBQyxJQUFJLEVBQUUsS0FBSyxDQUFDLENBQUM7SUFDekMsQ0FBQztJQUVNLEtBQUssQ0FBQyxJQUFjLEVBQUUsS0FBWTtRQUN4QyxNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxDQUFDO1FBQ25DLE1BQU0sSUFBSSxHQUFHLEtBQUssQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDakMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxLQUFLLENBQUMsS0FBSyxFQUFFLEtBQUssRUFBRSxJQUFJLENBQUMsQ0FBQztRQUMzQyxJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQztJQUN6QixDQUFDO0lBRU0sSUFBSSxDQUFDLElBQWM7UUFDekIsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1FBQ3JCLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsRUFBRSxFQUFFO1lBQ3RDLElBQUksQ0FBQyxDQUFDLFlBQVksS0FBSyxJQUFJO2dCQUFFLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLENBQUMsQ0FBQyxDQUFDO1FBQ3pELENBQUMsQ0FBQyxDQUFDO1FBQ0gsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7SUFDekIsQ0FBQzs7O1lBakVELFNBQVMsU0FBQztnQkFDVixRQUFRLEVBQUUsa0JBQWtCO2dCQUM1QixTQUFTLEVBQUU7b0JBQ1YsRUFBRSxPQUFPLEVBQUUsZUFBZSxFQUFFLFdBQVcsRUFBRSx1QkFBdUIsRUFBRTtvQkFDbEUsWUFBWTtvQkFDWixXQUFXO2lCQUNYO2dCQUNELElBQUksRUFBRTtvQkFDTCxvQkFBb0IsRUFBRSxNQUFNO29CQUM1QixtQkFBbUIsRUFBRSxVQUFVO29CQUMvQixrQkFBa0IsRUFBRSxVQUFVO2lCQUM5QjthQUNEOzs7WUF6QkEsTUFBTTtZQU1FLFdBQVcsdUJBd0NqQixJQUFJOzs7d0JBbEJMLEtBQUssU0FBQyxVQUFVOzRCQUVoQixNQUFNO29CQUVOLGVBQWUsU0FBQyxRQUFRIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcblx0RGlyZWN0aXZlLFxuXHRDb250ZW50Q2hpbGRyZW4sXG5cdFF1ZXJ5TGlzdCxcblx0QWZ0ZXJWaWV3SW5pdCxcblx0RXZlbnRFbWl0dGVyLFxuXHROZ1pvbmUsXG5cdE91dHB1dCxcblx0SW5wdXQsXG5cdFNlbGYsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgRHJhZ1VuaXREaXJlY3RpdmUgYXMgRHJhZ1VuaXQsIERSQUdfQ09MTEVDVElPTiB9IGZyb20gJy4vZHJhZy11bml0LmRpcmVjdGl2ZSc7XG5pbXBvcnQgeyBTb3J0U2VydmljZSB9IGZyb20gJy4vc29ydC5zZXJ2aWNlJztcbmltcG9ydCB7IEV2ZW50U2VydmljZSB9IGZyb20gJy4vZXZlbnQuc2VydmljZSc7XG5pbXBvcnQgeyBQb2ludCwgQ29sbGVjdGlvblNvcnRlZCB9IGZyb20gJy4vaW50ZXJmYWNlcyc7XG5cbi8qKiBFeHBvcnRlZCBhbiBlbXB0eSBpbnRlcmZhY2Ugb2YgRHJhZ0NvbGxlY3Rpb25EaXJlY3RpdmUgdG8gcHJldmVudCBjaXJjdWxhciBkZXBlbmRlbmN5ICovXG5leHBvcnQgaW50ZXJmYWNlIERyYWdDb2xsZWN0aW9uSW50ZXJmYWNlIGV4dGVuZHMgRHJhZ0NvbGxlY3Rpb25EaXJlY3RpdmUgeyB9XG5cbkBEaXJlY3RpdmUoe1xuXHRzZWxlY3RvcjogJ1tkcmFnQ29sbGVjdGlvbl0nLFxuXHRwcm92aWRlcnM6IFtcblx0XHR7IHByb3ZpZGU6IERSQUdfQ09MTEVDVElPTiwgdXNlRXhpc3Rpbmc6IERyYWdDb2xsZWN0aW9uRGlyZWN0aXZlIH0sXG5cdFx0RXZlbnRTZXJ2aWNlLFxuXHRcdFNvcnRTZXJ2aWNlXG5cdF0sXG5cdGhvc3Q6IHtcblx0XHQnW2NsYXNzLmNvbGxlY3Rpb25dJzogJ3RydWUnLFxuXHRcdCdbY2xhc3MuaW4tYWN0aW9uXSc6ICdpbkFjdGlvbicsXG5cdFx0J1tjbGFzcy5kaXNhYmxlZF0nOiAnZGlzYWJsZWQnXG5cdH1cbn0pXG5leHBvcnQgY2xhc3MgRHJhZ0NvbGxlY3Rpb25EaXJlY3RpdmUgaW1wbGVtZW50cyBBZnRlclZpZXdJbml0IHtcblxuXHRASW5wdXQoJ2Rpc2FibGVkJykgcHJpdmF0ZSBfZGlzYWJsZWQ/OiBib29sZWFuO1xuXG5cdEBPdXRwdXQoKSBwcml2YXRlIGRyb3BDb21wbGV0ZWQ6IEV2ZW50RW1pdHRlcjxDb2xsZWN0aW9uU29ydGVkPiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuXHRAQ29udGVudENoaWxkcmVuKERyYWdVbml0KSB1bml0czogUXVlcnlMaXN0PERyYWdVbml0PjtcblxuXHRwcml2YXRlIF9hY3RpdmVJdGVtOiBEcmFnVW5pdCB8IG51bGw7XG5cblx0Z2V0IGluQWN0aW9uKCkge1xuXHRcdHJldHVybiB0aGlzLl9hY3RpdmVJdGVtICE9PSBudWxsO1xuXHR9XG5cblx0Z2V0IGRpc2FibGVkKCkge1xuXHRcdHJldHVybiB0aGlzLl9kaXNhYmxlZDtcblx0fVxuXG5cdGNvbnN0cnVjdG9yKFxuXHRcdHByaXZhdGUgX3pvbmU6IE5nWm9uZSxcblx0XHRAU2VsZigpIHByaXZhdGUgc29ydFNlcnZpY2U6IFNvcnRTZXJ2aWNlLFxuXHQpIHtcblx0XHR0aGlzLl9hY3RpdmVJdGVtID0gbnVsbDtcblx0fVxuXG5cdG5nQWZ0ZXJWaWV3SW5pdCgpIHtcblx0XHR0aGlzLnNvcnRTZXJ2aWNlLmluaXRTZXJ2aWNlKHRoaXMpO1xuXHR9XG5cblx0cHJpdmF0ZSBjbGVhckNoaWxkcmVuKCkge1xuXHRcdHRoaXMuX3pvbmUucnVuKCgpID0+IHtcblx0XHRcdHRoaXMudW5pdHMudG9BcnJheSgpLmZvckVhY2godW5pdCA9PiB1bml0LnJlc2V0KCkpO1xuXHRcdH0pO1xuXHR9XG5cblx0cHVibGljIG1vdmVVbml0VG8odW5pdDogRHJhZ1VuaXQsIHBvaW50OiBQb2ludCkge1xuXHRcdHRoaXMuc29ydFNlcnZpY2UubW92ZVVuaXRzKHVuaXQsIHBvaW50KTtcblx0fVxuXG5cdHB1YmxpYyBzdGFydCh1bml0OiBEcmFnVW5pdCwgcG9pbnQ6IFBvaW50KSB7XG5cdFx0Y29uc3QgdW5pdHMgPSB0aGlzLnVuaXRzLnRvQXJyYXkoKTtcblx0XHRjb25zdCBmcm9tID0gdW5pdHMuaW5kZXhPZih1bml0KTtcblx0XHR0aGlzLnNvcnRTZXJ2aWNlLnN0YXJ0KHVuaXRzLCBwb2ludCwgZnJvbSk7XG5cdFx0dGhpcy5fYWN0aXZlSXRlbSA9IHVuaXQ7XG5cdH1cblxuXHRwdWJsaWMgc3RvcCh1bml0OiBEcmFnVW5pdCkge1xuXHRcdHRoaXMuY2xlYXJDaGlsZHJlbigpO1xuXHRcdHRoaXMuc29ydFNlcnZpY2Uuc3RvcCh1bml0KS50aGVuKChlKSA9PiB7XG5cdFx0XHRpZiAoZS5jdXJyZW50SW5kZXggIT09IG51bGwpIHRoaXMuZHJvcENvbXBsZXRlZC5lbWl0KGUpO1xuXHRcdH0pO1xuXHRcdHRoaXMuX2FjdGl2ZUl0ZW0gPSBudWxsO1xuXHR9XG59XG4iXX0=