UNPKG

ng-reorder

Version:

Sort elements within a list by using drag-n-drop interface without any restrictions by direction

68 lines 7.94 kB
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=