import {Directive, Input, Output, HostListener, OnInit, ElementRef, OnDestroy} from '@angular/core'
import NavContextMenu from "@common/modules/manage/modals/navContextMenu";
import ContextMenuService from "@common/modules/manage/services/contextMenu";

@Directive({
    selector: '[contextMenu]'
})
export default class ContextMenu implements OnInit, OnDestroy {
    @Input('contextMenu') item: any = {};
    private bindThisClick: any;
    private element: any;

    constructor(private el: ElementRef, private contextMenuService: ContextMenuService) {
        this.element = el.nativeElement;
        this.bindThisClick = this.clickHandler.bind(this);
    }

    ngOnInit(): void {
        this.element.addEventListener('contextmenu', this.bindThisClick)
    }

    ngOnDestroy(): void {
        this.element.removeEventListener('contextmenu', this.bindThisClick);
    }

    clickHandler(ev) {
        ev.preventDefault();
        this.contextMenuService.show(NavContextMenu, {
            item: this.item,
            position: {
                top: ev.pageY,
                left: ev.pageX
            }
        });
    }
}