import { Directive , Input , ElementRef } from '@angular/core' ; import { StoreModel } from "../../models/StoreModel" ; @ Directive ( { selector : '[makeDraggable]' } ) export class MakeDraggable { @ Input ( 'makeDraggable' ) data : StoreModel ; constructor ( private _elementRef ) { } ngOnInit ( ) { let el = this . _elementRef . nativeElement . querySelector ( 'div' ) ; if ( ! el ) return ; el . draggable = 'true' ; el . addEventListener ( 'dragstart' , ( e ) => { console . log ( 'Start' ) ; el . classList . add ( 'drag-src' ) ; e . dataTransfer . effectAllowed = 'move' ; e . dataTransfer . setData ( 'text' , this . data . getKey ( 'modelId' ) ) ; } ) ; el . addEventListener ( 'dragend' , ( e ) => { e . preventDefault ( ) ; el . classList . remove ( 'drag-src' ) ; } ) ; } }