ajout du drag and drop pour ajouter une image

src/app/advertiser/drag-and-drop/drag-and-drop.component.ts

@@ -0,0 +1,90 @@
+import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
+
+@Component({
+  selector: 'app-drag-and-drop',
+  templateUrl: './drag-and-drop.component.html',
+  styleUrls: ['./drag-and-drop.component.scss']
+})
+export class DragAndDropComponent
+{
+    @ViewChild("fileDropRef", { static: false }) fileDropEl: ElementRef;
+    files: any[] = [];
+    info_image = "Vos annonces seront affichées dans un rectangle de rapport 1/5 avec: \n • 1 la largeur durectangle \n • 5 la hauteur du rectangle" ;
+
+
+    /**
+     * on file drop handler
+     */
+    onFileDropped($event) {
+        this.prepareFilesList($event);
+    }
+
+    /**
+     * handle file from browsing
+     */
+    fileBrowseHandler(files) {
+        this.prepareFilesList(files);
+    }
+
+    /**
+     * Delete file from files list
+     * @param index (File index)
+     */
+    deleteFile(index: number) {
+        if (this.files[index].progress < 100) {
+            console.log("Upload in progress.");
+            return;
+        }
+        this.files.splice(index, 1);
+    }
+
+    /**
+     * Simulate the upload process
+     */
+    uploadFilesSimulator(index: number) {
+        setTimeout(() => {
+            if (index === this.files.length) {
+                return;
+            } else {
+                const progressInterval = setInterval(() => {
+                    if (this.files[index].progress === 100) {
+                        clearInterval(progressInterval);
+                        this.uploadFilesSimulator(index + 1);
+                    } else {
+                        this.files[index].progress += 5;
+                    }
+                }, 200);
+            }
+        }, 1000);
+    }
+
+    /**
+     * Convert Files list to normal array list
+     * @param files (Files List)
+     */
+    prepareFilesList(files: Array<any>) {
+        for (const item of files) {
+            item.progress = 0;
+            this.files.push(item);
+        }
+        this.fileDropEl.nativeElement.value = "";
+        this.uploadFilesSimulator(0);
+    }
+
+    /**
+     * format bytes
+     * @param bytes (File size in bytes)
+     * @param decimals (Decimals point)
+     */
+    formatBytes(bytes, decimals = 2) {
+        if (bytes === 0) {
+            return "0 Bytes";
+        }
+        const k = 1024;
+        const dm = decimals <= 0 ? 0 : decimals;
+        const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
+        const i = Math.floor(Math.log(bytes) / Math.log(k));
+        return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + " " + sizes[i];
+    }
+
+}