import { Directive, ElementRef, Input } from '@angular/core';
import { Subscription } from 'rxjs';
import { DragActiveService } from '../../services';
import * as i0 from "@angular/core";
import * as i1 from "../../services";
/**
 * Directive that adds special changes for designer dropzone
 */
export class DesignerDropzoneSADirective {
    //######################### constructor #########################
    constructor(draggingSvc, element) {
        this.draggingSvc = draggingSvc;
        this.element = element;
        //######################### protected properties #########################
        /**
         * Subscriptions created during initialization
         */
        this.initSubscriptions = new Subscription();
        //######################### public properties - inputs #########################
        /**
         * Indication whether is this enabled drop zone
         */
        this.isDropZone = false;
    }
    //######################### public methods - implementation of OnInit #########################
    /**
     * Initialize component
     */
    ngOnInit() {
        this.initSubscriptions.add(this.draggingSvc.draggingChange.subscribe(() => this.processDragValue()));
    }
    //######################### public methods - implementation of OnDestroy #########################
    /**
     * Called when component is destroyed
     */
    ngOnDestroy() {
        this.initSubscriptions.unsubscribe();
    }
    //######################### protected methods #########################
    /**
     * Process drag current value and sets css classes
     */
    processDragValue() {
        //relate to https://stackoverflow.com/a/20734159
        //Need to wait before manipulating with DOM because browser can trigger dragend if dragged node is out of mouse position
        setTimeout(() => {
            if (this.draggingSvc.dragging && this.isDropZone) {
                this.element.nativeElement.classList.add('drag-active');
            }
            else {
                this.element.nativeElement.classList.remove('drag-active');
            }
        });
    }
}
DesignerDropzoneSADirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: DesignerDropzoneSADirective, deps: [{ token: i1.DragActiveService }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
DesignerDropzoneSADirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.4", type: DesignerDropzoneSADirective, isStandalone: true, selector: ".designer-dropzone", inputs: { isDropZone: "isDropZone" }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: DesignerDropzoneSADirective, decorators: [{
            type: Directive,
            args: [{
                    selector: '.designer-dropzone',
                    standalone: true,
                }]
        }], ctorParameters: () => [{ type: i1.DragActiveService }, { type: i0.ElementRef }], propDecorators: { isDropZone: [{
                type: Input
            }] } });
//# sourceMappingURL=designerDropzone.directive.js.map