initial push

src/app/common/directives/dnd.directive.ts

@@ -0,0 +1,46 @@
+import {
+    Directive,
+    Output,
+    Input,
+    EventEmitter,
+    HostBinding,
+    HostListener
+} from '@angular/core';
+
+import { NewtonFile } from '../types/file.type';
+
+
+@Directive({
+    selector: '[dropzone]'
+})
+export class DndDirective {
+    @HostBinding('class.fileover') fileOver!: boolean;
+    @Output() fileDropped = new EventEmitter<any>();
+
+    @HostListener('dragover', ['$event']) onDragOver(evt: any) {
+        evt.preventDefault();
+        evt.stopPropagation();
+
+        this.fileOver = true;
+    }
+
+    @HostListener('dragleave', ['$event']) public onDragLeave(evt: any) {
+        evt.preventDefault();
+        evt.stopPropagation();
+
+        this.fileOver = false;
+    }
+
+    @HostListener('drop', ['$event']) public ondrop(evt: any) {
+        evt.preventDefault();
+        evt.stopPropagation();
+
+        this.fileOver                = false;
+        let files: Array<NewtonFile> = evt.dataTransfer.files;
+
+        if (files.length == 0) return;
+
+        this.fileDropped.emit(files);
+    }
+
+}