ngx-tree-dnd
Version:
Angular 7 support tree with drag-and-drop sortable data tree. It`s fast and smart.
137 lines • 9.31 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/*
Copyright (C) 2018 Yaroslav Kikot
This project is licensed under the terms of the MIT license.
https://github.com/Zicrael/ngx-tree-dnd
*/
import { Directive, ElementRef, HostListener, Input, Output, EventEmitter } from '@angular/core';
import { NgxTreeService } from '../ngx-tree-dnd.service';
export class DropElementsDirective {
/**
* @param {?} el
* @param {?} treeService
*/
constructor(el, treeService) {
this.el = el;
this.treeService = treeService;
this.drop = new EventEmitter();
}
/*
Event: onallowdrop;
Call onDragOver() from tree service.
Emit onAllowDrop on tree service.
*/
/**
* @param {?} event
* @return {?}
*/
onDragOver(event) {
/** @type {?} */
const eventObj = {
event,
target: this.item
};
this.treeService.onDragOver(eventObj);
event.preventDefault();
}
/*
Event: ondrop;
Call onDropItem() from tree service.
Emit OnDrop on tree service.
*/
/**
* @param {?} event
* @return {?}
*/
onDrop(event) {
/** @type {?} */
const dragItem = this.treeService.isDragging;
/** @type {?} */
const eventObj = {
event,
target: this.item
};
dragItem.options.hideChildrens = this.treeService.lastExpandState;
dragItem.options.currentlyDragging = false;
if (dragItem !== eventObj.target) {
this.treeService.onDropItem(eventObj);
}
event.preventDefault();
}
/*s
Event: ondragenter;
Detect event where draggable element enter in drop zone.
Call enterDropZone() from tree service.
Emit onDragEnter.
*/
/**
* @param {?} event
* @return {?}
*/
onDragEnter(event) {
/** @type {?} */
const eventObj = {
event,
target: this.item
};
this.treeService.enterDropZone(eventObj);
}
/*
Event: ondragleave;
Detect event where draggable element leave drop zone.
Call leaveDropZone() from tree service.
Emit onDragLeave.
*/
/**
* @param {?} event
* @return {?}
*/
onDragLeave(event) {
// emit events
/** @type {?} */
const eventObj = {
event,
target: this.item
};
// code
this.treeService.leaveDropZone(eventObj);
}
}
DropElementsDirective.decorators = [
{ type: Directive, args: [{
selector: '[libDropElement]'
},] },
];
/** @nocollapse */
DropElementsDirective.ctorParameters = () => [
{ type: ElementRef },
{ type: NgxTreeService }
];
DropElementsDirective.propDecorators = {
item: [{ type: Input }],
drop: [{ type: Output }],
onDragOver: [{ type: HostListener, args: ['dragover', ['$event'],] }],
onDrop: [{ type: HostListener, args: ['drop', ['$event'],] }],
onDragEnter: [{ type: HostListener, args: ['dragenter', ['$event'],] }],
onDragLeave: [{ type: HostListener, args: ['dragleave', ['$event'],] }]
};
if (false) {
/** @type {?} */
DropElementsDirective.prototype.item;
/** @type {?} */
DropElementsDirective.prototype.drop;
/**
* @type {?}
* @private
*/
DropElementsDirective.prototype.el;
/**
* @type {?}
* @private
*/
DropElementsDirective.prototype.treeService;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LXRyZWUtZG5kLWRyb3AuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vbmd4LXRyZWUtZG5kLyIsInNvdXJjZXMiOlsibGliL2RpcmVjdGl2ZXMvbmd4LXRyZWUtZG5kLWRyb3AuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7OztBQUtBLE9BQU8sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQWUsTUFBTSxFQUFFLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUU5RyxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFJekQsTUFBTSxPQUFPLHFCQUFxQjs7Ozs7SUFDOUIsWUFBb0IsRUFBYyxFQUFXLFdBQTJCO1FBQXBELE9BQUUsR0FBRixFQUFFLENBQVk7UUFBVyxnQkFBVyxHQUFYLFdBQVcsQ0FBZ0I7UUFFOUQsU0FBSSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7SUFGdUMsQ0FBQzs7Ozs7Ozs7OztJQVU1RSxVQUFVLENBQUMsS0FBWTs7Y0FDYixRQUFRLEdBQUc7WUFDYixLQUFLO1lBQ0wsTUFBTSxFQUFFLElBQUksQ0FBQyxJQUFJO1NBQ3BCO1FBQ0QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxVQUFVLENBQUMsUUFBUSxDQUFDLENBQUM7UUFDdEMsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO0lBQzNCLENBQUM7Ozs7Ozs7Ozs7SUFPRCxNQUFNLENBQUMsS0FBWTs7Y0FDVCxRQUFRLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxVQUFVOztjQUN0QyxRQUFRLEdBQUc7WUFDYixLQUFLO1lBQ0wsTUFBTSxFQUFFLElBQUksQ0FBQyxJQUFJO1NBQ3BCO1FBQ0QsUUFBUSxDQUFDLE9BQU8sQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDLFdBQVcsQ0FBQyxlQUFlLENBQUM7UUFDbEUsUUFBUSxDQUFDLE9BQU8sQ0FBQyxpQkFBaUIsR0FBRyxLQUFLLENBQUM7UUFDM0MsSUFBSSxRQUFRLEtBQUssUUFBUSxDQUFDLE1BQU0sRUFBRTtZQUM5QixJQUFJLENBQUMsV0FBVyxDQUFDLFVBQVUsQ0FBQyxRQUFRLENBQUMsQ0FBQztTQUN6QztRQUNELEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztJQUMzQixDQUFDOzs7Ozs7Ozs7OztJQVNELFdBQVcsQ0FBQyxLQUFZOztjQUNkLFFBQVEsR0FBRztZQUNqQixLQUFLO1lBQ0wsTUFBTSxFQUFFLElBQUksQ0FBQyxJQUFJO1NBQ2hCO1FBQ0QsSUFBSSxDQUFDLFdBQVcsQ0FBQyxhQUFhLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDN0MsQ0FBQzs7Ozs7Ozs7Ozs7SUFTRCxXQUFXLENBQUMsS0FBWTs7O2NBRWQsUUFBUSxHQUFHO1lBQ2pCLEtBQUs7WUFDTCxNQUFNLEVBQUUsSUFBSSxDQUFDLElBQUk7U0FDaEI7UUFDRCxPQUFPO1FBQ1AsSUFBSSxDQUFDLFdBQVcsQ0FBQyxhQUFhLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDN0MsQ0FBQzs7O1lBeEVKLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsa0JBQWtCO2FBQzdCOzs7O1lBTG1CLFVBQVU7WUFFckIsY0FBYzs7O21CQU1sQixLQUFLO21CQUNMLE1BQU07eUJBT04sWUFBWSxTQUFDLFVBQVUsRUFBRSxDQUFDLFFBQVEsQ0FBQztxQkFjbkMsWUFBWSxTQUFDLE1BQU0sRUFBRSxDQUFDLFFBQVEsQ0FBQzswQkFxQi9CLFlBQVksU0FBQyxXQUFXLEVBQUUsQ0FBQyxRQUFRLENBQUM7MEJBZXBDLFlBQVksU0FBQyxXQUFXLEVBQUUsQ0FBQyxRQUFRLENBQUM7Ozs7SUExRHJDLHFDQUF5Qjs7SUFDekIscUNBQW9DOzs7OztJQUZ4QixtQ0FBc0I7Ozs7O0lBQUUsNENBQW9DIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiBDb3B5cmlnaHQgKEMpIDIwMTggWWFyb3NsYXYgS2lrb3RcbiBUaGlzIHByb2plY3QgaXMgbGljZW5zZWQgdW5kZXIgdGhlIHRlcm1zIG9mIHRoZSBNSVQgbGljZW5zZS5cbiBodHRwczovL2dpdGh1Yi5jb20vWmljcmFlbC9uZ3gtdHJlZS1kbmRcbiovXG5pbXBvcnQgeyBEaXJlY3RpdmUsIEVsZW1lbnRSZWYsIEhvc3RMaXN0ZW5lciwgSW5wdXQsIEhvc3RCaW5kaW5nLCBPdXRwdXQsIEV2ZW50RW1pdHRlciB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVHJlZU1vZGVsIH0gZnJvbSAnLi4vbW9kZWxzL3RyZWUtdmlldy5tb2RlbCc7XG5pbXBvcnQgeyBOZ3hUcmVlU2VydmljZSB9IGZyb20gJy4uL25neC10cmVlLWRuZC5zZXJ2aWNlJztcbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tsaWJEcm9wRWxlbWVudF0nXG59KVxuZXhwb3J0IGNsYXNzIERyb3BFbGVtZW50c0RpcmVjdGl2ZSB7XG4gICAgY29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZiwgcHJpdmF0ZSAgdHJlZVNlcnZpY2U6IE5neFRyZWVTZXJ2aWNlKSB7fVxuICAgIEBJbnB1dCgpIGl0ZW06IFRyZWVNb2RlbDtcbiAgICBAT3V0cHV0KCkgZHJvcCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcblxuICAgIC8qXG4gICAgICAgIEV2ZW50OiBvbmFsbG93ZHJvcDtcbiAgICAgICAgQ2FsbCBvbkRyYWdPdmVyKCkgZnJvbSB0cmVlIHNlcnZpY2UuXG4gICAgICAgIEVtaXQgb25BbGxvd0Ryb3Agb24gdHJlZSBzZXJ2aWNlLlxuICAgICovXG4gICAgQEhvc3RMaXN0ZW5lcignZHJhZ292ZXInLCBbJyRldmVudCddKVxuICAgIG9uRHJhZ092ZXIoZXZlbnQ6IEV2ZW50KSB7XG4gICAgICAgIGNvbnN0IGV2ZW50T2JqID0ge1xuICAgICAgICAgICAgZXZlbnQsXG4gICAgICAgICAgICB0YXJnZXQ6IHRoaXMuaXRlbVxuICAgICAgICB9O1xuICAgICAgICB0aGlzLnRyZWVTZXJ2aWNlLm9uRHJhZ092ZXIoZXZlbnRPYmopO1xuICAgICAgICBldmVudC5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIH1cbiAgICAvKlxuICAgICAgICBFdmVudDogb25kcm9wO1xuICAgICAgICBDYWxsIG9uRHJvcEl0ZW0oKSBmcm9tIHRyZWUgc2VydmljZS5cbiAgICAgICAgRW1pdCBPbkRyb3Agb24gdHJlZSBzZXJ2aWNlLlxuICAgICovXG4gICAgQEhvc3RMaXN0ZW5lcignZHJvcCcsIFsnJGV2ZW50J10pXG4gICAgb25Ecm9wKGV2ZW50OiBFdmVudCkge1xuICAgICAgICBjb25zdCBkcmFnSXRlbSA9IHRoaXMudHJlZVNlcnZpY2UuaXNEcmFnZ2luZztcbiAgICAgICAgY29uc3QgZXZlbnRPYmogPSB7XG4gICAgICAgICAgICBldmVudCxcbiAgICAgICAgICAgIHRhcmdldDogdGhpcy5pdGVtXG4gICAgICAgIH07XG4gICAgICAgIGRyYWdJdGVtLm9wdGlvbnMuaGlkZUNoaWxkcmVucyA9IHRoaXMudHJlZVNlcnZpY2UubGFzdEV4cGFuZFN0YXRlO1xuICAgICAgICBkcmFnSXRlbS5vcHRpb25zLmN1cnJlbnRseURyYWdnaW5nID0gZmFsc2U7XG4gICAgICAgIGlmIChkcmFnSXRlbSAhPT0gZXZlbnRPYmoudGFyZ2V0KSB7XG4gICAgICAgICAgICB0aGlzLnRyZWVTZXJ2aWNlLm9uRHJvcEl0ZW0oZXZlbnRPYmopO1xuICAgICAgICB9XG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XG4gICAgfVxuXG4gICAgLypzXG4gICAgRXZlbnQ6IG9uZHJhZ2VudGVyO1xuICAgIERldGVjdCBldmVudCB3aGVyZSBkcmFnZ2FibGUgZWxlbWVudCBlbnRlciBpbiBkcm9wIHpvbmUuXG4gICAgQ2FsbCBlbnRlckRyb3Bab25lKCkgZnJvbSB0cmVlIHNlcnZpY2UuXG4gICAgRW1pdCBvbkRyYWdFbnRlci5cbiAgICAqL1xuICAgIEBIb3N0TGlzdGVuZXIoJ2RyYWdlbnRlcicsIFsnJGV2ZW50J10pXG4gICAgb25EcmFnRW50ZXIoZXZlbnQ6IEV2ZW50KSB7XG4gICAgICAgIGNvbnN0IGV2ZW50T2JqID0ge1xuICAgICAgICBldmVudCxcbiAgICAgICAgdGFyZ2V0OiB0aGlzLml0ZW1cbiAgICAgICAgfTtcbiAgICAgICAgdGhpcy50cmVlU2VydmljZS5lbnRlckRyb3Bab25lKGV2ZW50T2JqKTtcbiAgICB9XG5cbiAgICAvKlxuICAgICAgICBFdmVudDogb25kcmFnbGVhdmU7XG4gICAgICAgIERldGVjdCBldmVudCB3aGVyZSBkcmFnZ2FibGUgZWxlbWVudCBsZWF2ZSBkcm9wIHpvbmUuXG4gICAgICAgIENhbGwgbGVhdmVEcm9wWm9uZSgpIGZyb20gdHJlZSBzZXJ2aWNlLlxuICAgICAgICBFbWl0IG9uRHJhZ0xlYXZlLlxuICAgICovXG4gICAgQEhvc3RMaXN0ZW5lcignZHJhZ2xlYXZlJywgWyckZXZlbnQnXSlcbiAgICBvbkRyYWdMZWF2ZShldmVudDogRXZlbnQpIHtcbiAgICAgICAgLy8gZW1pdCBldmVudHNcbiAgICAgICAgY29uc3QgZXZlbnRPYmogPSB7XG4gICAgICAgIGV2ZW50LFxuICAgICAgICB0YXJnZXQ6IHRoaXMuaXRlbVxuICAgICAgICB9O1xuICAgICAgICAvLyBjb2RlXG4gICAgICAgIHRoaXMudHJlZVNlcnZpY2UubGVhdmVEcm9wWm9uZShldmVudE9iaik7XG4gICAgfVxufVxuIl19