ngx-explorer-dnd
Version:
## _Drag & Drop in Angular like in a desktop explorer!_
86 lines • 9.73 kB
JavaScript
import { Directive, HostListener, Inject, Input, Optional, SkipSelf, } from '@angular/core';
import { Subscription } from 'rxjs';
import { EXPLORER_DND_CONTAINER, } from './ngx-explorer-container.directive';
import * as i0 from "@angular/core";
import * as i1 from "../services/dnd.service";
import * as i2 from "../core/file-folder";
import * as i3 from "./ngx-explorer-container.directive";
export class NgxExplorerTargetDirective {
constructor(element, renderer, dndService, _parentDrag, host) {
this.element = element;
this.renderer = renderer;
this.dndService = dndService;
this._parentDrag = _parentDrag;
this.host = host;
this.dragElementSubscription = Subscription.EMPTY;
}
ngOnInit() {
if (this._parentDrag) {
this.dragElementSubscription = this.dndService
.getDragElementSubject()
.subscribe((element) => {
this.currentDragElement = element;
});
}
}
ngOnDestroy() {
this.dragElementSubscription.unsubscribe();
}
onMouseEnter(ev) {
if (!this.currentDragElement) {
ev.preventDefault();
return;
}
const htmlElement = this._parentDrag?.getTargetHandleFromHTMLElement(this.currentDragElement);
if (htmlElement) {
this.renderer.addClass(this.element.nativeElement, 'dnd-target-highlight');
}
this._parentDrag?.setCurrentTarget(this);
}
onMouseLeave(ev) {
this.renderer.removeClass(this.element.nativeElement, 'dnd-target-highlight');
this._parentDrag?.setCurrentTarget(null);
}
/** Return the host component. */
getHostComponent() {
return this.host;
}
}
NgxExplorerTargetDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.1", ngImport: i0, type: NgxExplorerTargetDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1.DndService }, { token: EXPLORER_DND_CONTAINER, optional: true, skipSelf: true }, { token: i2.FileFolder, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
NgxExplorerTargetDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.0.1", type: NgxExplorerTargetDirective, selector: "[ngxExplorerDndTarget]", inputs: { data: ["dndTargetData", "data"] }, host: { listeners: { "mouseenter": "onMouseEnter($event)", "mouseleave": "onMouseLeave($event)" } }, providers: [
{
provide: EXPLORER_DND_CONTAINER,
useExisting: NgxExplorerTargetDirective,
},
], ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.1", ngImport: i0, type: NgxExplorerTargetDirective, decorators: [{
type: Directive,
args: [{
selector: '[ngxExplorerDndTarget]',
providers: [
{
provide: EXPLORER_DND_CONTAINER,
useExisting: NgxExplorerTargetDirective,
},
],
}]
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1.DndService }, { type: i3.NgxExplorerContainerDirective, decorators: [{
type: Optional
}, {
type: SkipSelf
}, {
type: Inject,
args: [EXPLORER_DND_CONTAINER]
}] }, { type: i2.FileFolder, decorators: [{
type: Optional
}] }]; }, propDecorators: { data: [{
type: Input,
args: ['dndTargetData']
}], onMouseEnter: [{
type: HostListener,
args: ['mouseenter', ['$event']]
}], onMouseLeave: [{
type: HostListener,
args: ['mouseleave', ['$event']]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmd4LWV4cGxvcmVyLXRhcmdldC5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtZXhwbG9yZXItZG5kL3NyYy9saWIvZGlyZWN0aXZlcy9uZ3gtZXhwbG9yZXItdGFyZ2V0LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUVULFlBQVksRUFDWixNQUFNLEVBQ04sS0FBSyxFQUdMLFFBQVEsRUFFUixRQUFRLEdBQ1QsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUdwQyxPQUFPLEVBQ0wsc0JBQXNCLEdBRXZCLE1BQU0sb0NBQW9DLENBQUM7Ozs7O0FBVzVDLE1BQU0sT0FBTywwQkFBMEI7SUFNckMsWUFDVSxPQUFtQixFQUNuQixRQUFtQixFQUNuQixVQUFzQixFQUl0QixXQUEyQyxFQUUzQyxJQUFpQjtRQVJqQixZQUFPLEdBQVAsT0FBTyxDQUFZO1FBQ25CLGFBQVEsR0FBUixRQUFRLENBQVc7UUFDbkIsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQUl0QixnQkFBVyxHQUFYLFdBQVcsQ0FBZ0M7UUFFM0MsU0FBSSxHQUFKLElBQUksQ0FBYTtRQWRuQiw0QkFBdUIsR0FBaUIsWUFBWSxDQUFDLEtBQUssQ0FBQztJQWVoRSxDQUFDO0lBRUosUUFBUTtRQUNOLElBQUksSUFBSSxDQUFDLFdBQVcsRUFBRTtZQUNwQixJQUFJLENBQUMsdUJBQXVCLEdBQUcsSUFBSSxDQUFDLFVBQVU7aUJBQzNDLHFCQUFxQixFQUFFO2lCQUN2QixTQUFTLENBQUMsQ0FBQyxPQUFPLEVBQUUsRUFBRTtnQkFDckIsSUFBSSxDQUFDLGtCQUFrQixHQUFHLE9BQU8sQ0FBQztZQUNwQyxDQUFDLENBQUMsQ0FBQztTQUNOO0lBQ0gsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMsdUJBQXVCLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDN0MsQ0FBQztJQUdELFlBQVksQ0FBQyxFQUFPO1FBQ2xCLElBQUksQ0FBQyxJQUFJLENBQUMsa0JBQWtCLEVBQUU7WUFDNUIsRUFBRSxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3BCLE9BQU87U0FDUjtRQUNELE1BQU0sV0FBVyxHQUFHLElBQUksQ0FBQyxXQUFXLEVBQUUsOEJBQThCLENBQ2xFLElBQUksQ0FBQyxrQkFBa0IsQ0FDeEIsQ0FBQztRQUNGLElBQUksV0FBVyxFQUFFO1lBQ2YsSUFBSSxDQUFDLFFBQVEsQ0FBQyxRQUFRLENBQ3BCLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxFQUMxQixzQkFBc0IsQ0FDdkIsQ0FBQztTQUNIO1FBRUQsSUFBSSxDQUFDLFdBQVcsRUFBRSxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUMzQyxDQUFDO0lBR0QsWUFBWSxDQUFDLEVBQU87UUFDbEIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQ3ZCLElBQUksQ0FBQyxPQUFPLENBQUMsYUFBYSxFQUMxQixzQkFBc0IsQ0FDdkIsQ0FBQztRQUNGLElBQUksQ0FBQyxXQUFXLEVBQUUsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDM0MsQ0FBQztJQUVELGlDQUFpQztJQUNqQyxnQkFBZ0I7UUFDZCxPQUFPLElBQUksQ0FBQyxJQUFJLENBQUM7SUFDbkIsQ0FBQzs7dUhBL0RVLDBCQUEwQiwrRkFZM0Isc0JBQXNCOzJHQVpyQiwwQkFBMEIsbU1BUDFCO1FBQ1Q7WUFDRSxPQUFPLEVBQUUsc0JBQXNCO1lBQy9CLFdBQVcsRUFBRSwwQkFBMEI7U0FDeEM7S0FDRjsyRkFFVSwwQkFBMEI7a0JBVHRDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLHdCQUF3QjtvQkFDbEMsU0FBUyxFQUFFO3dCQUNUOzRCQUNFLE9BQU8sRUFBRSxzQkFBc0I7NEJBQy9CLFdBQVcsNEJBQTRCO3lCQUN4QztxQkFDRjtpQkFDRjs7MEJBV0ksUUFBUTs7MEJBQ1IsUUFBUTs7MEJBQ1IsTUFBTTsyQkFBQyxzQkFBc0I7OzBCQUU3QixRQUFROzRDQVZhLElBQUk7c0JBQTNCLEtBQUs7dUJBQUMsZUFBZTtnQkE2QnRCLFlBQVk7c0JBRFgsWUFBWTt1QkFBQyxZQUFZLEVBQUUsQ0FBQyxRQUFRLENBQUM7Z0JBb0J0QyxZQUFZO3NCQURYLFlBQVk7dUJBQUMsWUFBWSxFQUFFLENBQUMsUUFBUSxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgRGlyZWN0aXZlLFxuICBFbGVtZW50UmVmLFxuICBIb3N0TGlzdGVuZXIsXG4gIEluamVjdCxcbiAgSW5wdXQsXG4gIE9uRGVzdHJveSxcbiAgT25Jbml0LFxuICBPcHRpb25hbCxcbiAgUmVuZGVyZXIyLFxuICBTa2lwU2VsZixcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IEZpbGVGb2xkZXIgfSBmcm9tICcuLi9jb3JlL2ZpbGUtZm9sZGVyJztcbmltcG9ydCB7IERuZFNlcnZpY2UgfSBmcm9tICcuLi9zZXJ2aWNlcy9kbmQuc2VydmljZSc7XG5pbXBvcnQge1xuICBFWFBMT1JFUl9ETkRfQ09OVEFJTkVSLFxuICBOZ3hFeHBsb3JlckNvbnRhaW5lckRpcmVjdGl2ZSxcbn0gZnJvbSAnLi9uZ3gtZXhwbG9yZXItY29udGFpbmVyLmRpcmVjdGl2ZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1tuZ3hFeHBsb3JlckRuZFRhcmdldF0nLFxuICBwcm92aWRlcnM6IFtcbiAgICB7XG4gICAgICBwcm92aWRlOiBFWFBMT1JFUl9ETkRfQ09OVEFJTkVSLFxuICAgICAgdXNlRXhpc3Rpbmc6IE5neEV4cGxvcmVyVGFyZ2V0RGlyZWN0aXZlLFxuICAgIH0sXG4gIF0sXG59KVxuZXhwb3J0IGNsYXNzIE5neEV4cGxvcmVyVGFyZ2V0RGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0LCBPbkRlc3Ryb3kge1xuICBwcml2YXRlIGRyYWdFbGVtZW50U3Vic2NyaXB0aW9uOiBTdWJzY3JpcHRpb24gPSBTdWJzY3JpcHRpb24uRU1QVFk7XG4gIHByaXZhdGUgY3VycmVudERyYWdFbGVtZW50ITogSFRNTEVsZW1lbnQgfCBudWxsO1xuXG4gIEBJbnB1dCgnZG5kVGFyZ2V0RGF0YScpIGRhdGEhOiBhbnk7XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSBlbGVtZW50OiBFbGVtZW50UmVmLFxuICAgIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMixcbiAgICBwcml2YXRlIGRuZFNlcnZpY2U6IERuZFNlcnZpY2UsXG4gICAgQE9wdGlvbmFsKClcbiAgICBAU2tpcFNlbGYoKVxuICAgIEBJbmplY3QoRVhQTE9SRVJfRE5EX0NPTlRBSU5FUilcbiAgICBwcml2YXRlIF9wYXJlbnREcmFnPzogTmd4RXhwbG9yZXJDb250YWluZXJEaXJlY3RpdmUsXG4gICAgQE9wdGlvbmFsKClcbiAgICBwcml2YXRlIGhvc3Q/OiBGaWxlRm9sZGVyXG4gICkge31cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5fcGFyZW50RHJhZykge1xuICAgICAgdGhpcy5kcmFnRWxlbWVudFN1YnNjcmlwdGlvbiA9IHRoaXMuZG5kU2VydmljZVxuICAgICAgICAuZ2V0RHJhZ0VsZW1lbnRTdWJqZWN0KClcbiAgICAgICAgLnN1YnNjcmliZSgoZWxlbWVudCkgPT4ge1xuICAgICAgICAgIHRoaXMuY3VycmVudERyYWdFbGVtZW50ID0gZWxlbWVudDtcbiAgICAgICAgfSk7XG4gICAgfVxuICB9XG5cbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgdGhpcy5kcmFnRWxlbWVudFN1YnNjcmlwdGlvbi51bnN1YnNjcmliZSgpO1xuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignbW91c2VlbnRlcicsIFsnJGV2ZW50J10pXG4gIG9uTW91c2VFbnRlcihldjogYW55KSB7XG4gICAgaWYgKCF0aGlzLmN1cnJlbnREcmFnRWxlbWVudCkge1xuICAgICAgZXYucHJldmVudERlZmF1bHQoKTtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgY29uc3QgaHRtbEVsZW1lbnQgPSB0aGlzLl9wYXJlbnREcmFnPy5nZXRUYXJnZXRIYW5kbGVGcm9tSFRNTEVsZW1lbnQoXG4gICAgICB0aGlzLmN1cnJlbnREcmFnRWxlbWVudFxuICAgICk7XG4gICAgaWYgKGh0bWxFbGVtZW50KSB7XG4gICAgICB0aGlzLnJlbmRlcmVyLmFkZENsYXNzKFxuICAgICAgICB0aGlzLmVsZW1lbnQubmF0aXZlRWxlbWVudCxcbiAgICAgICAgJ2RuZC10YXJnZXQtaGlnaGxpZ2h0J1xuICAgICAgKTtcbiAgICB9XG5cbiAgICB0aGlzLl9wYXJlbnREcmFnPy5zZXRDdXJyZW50VGFyZ2V0KHRoaXMpO1xuICB9XG5cbiAgQEhvc3RMaXN0ZW5lcignbW91c2VsZWF2ZScsIFsnJGV2ZW50J10pXG4gIG9uTW91c2VMZWF2ZShldjogYW55KSB7XG4gICAgdGhpcy5yZW5kZXJlci5yZW1vdmVDbGFzcyhcbiAgICAgIHRoaXMuZWxlbWVudC5uYXRpdmVFbGVtZW50LFxuICAgICAgJ2RuZC10YXJnZXQtaGlnaGxpZ2h0J1xuICAgICk7XG4gICAgdGhpcy5fcGFyZW50RHJhZz8uc2V0Q3VycmVudFRhcmdldChudWxsKTtcbiAgfVxuXG4gIC8qKiBSZXR1cm4gdGhlIGhvc3QgY29tcG9uZW50LiAqL1xuICBnZXRIb3N0Q29tcG9uZW50KCkge1xuICAgIHJldHVybiB0aGlzLmhvc3Q7XG4gIH1cbn1cbiJdfQ==