1 files changed, 60 insertions, 7 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
index 3a938c5ae..752bd510b 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts
@@ -1,15 +1,68 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, EventEmitter, OnInit, Output} from '@angular/core';
+import {FileSystemFileEntry, NgxFileDropEntry} from 'ngx-file-drop';
+import {PackageCreationStore} from '../../package-creation.store';
 
 @Component({
-  selector: 'app-templ-mapp-creation',
-  templateUrl: './templ-mapp-creation.component.html',
-  styleUrls: ['./templ-mapp-creation.component.css']
+    selector: 'app-templ-mapp-creation',
+    templateUrl: './templ-mapp-creation.component.html',
+    styleUrls: ['./templ-mapp-creation.component.css']
 })
 export class TemplMappCreationComponent implements OnInit {
 
-  constructor() { }
+    public uploadedFiles: FileSystemFileEntry[] = [];
+    private fileNames: Set<string> = new Set();
 
-  ngOnInit() {
-  }
+    public files: NgxFileDropEntry[] = [];
+    fileName: any;
 
+    constructor(private packageCreationStore: PackageCreationStore) {
+    }
+
+    ngOnInit() {
+    }
+
+    public dropped(files: NgxFileDropEntry[]) {
+        this.files = files;
+        for (const droppedFile of files) {
+            // Is it a file? & Not added before
+            if (droppedFile.fileEntry.isFile && !this.fileNames.has(droppedFile.fileEntry.name)) {
+                const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
+                this.uploadedFiles.push(fileEntry);
+                this.fileNames.add(fileEntry.name);
+
+            }
+        }
+    }
+
+    removeFile(fileIndex: number) {
+        /*const filename = 'Definitions/' + this.uploadedFiles[fileIndex].name;
+        this.packageCreationStore.removeFileFromDefinition(filename);
+        this.uploadedFiles.splice(fileIndex, 1);*/
+    }
+
+    setFilesToStore() {
+        for (const droppedFile of this.uploadedFiles) {
+            droppedFile.file((file: File) => {
+                const fileReader = new FileReader();
+                fileReader.onload = (e) => {
+                    this.packageCreationStore.addTemplate('Templates/' + this.fileName,
+                        fileReader.result.toString());
+                };
+                fileReader.readAsText(file);
+            });
+
+        }
+    }
+
+    public fileOver(event) {
+        console.log(event);
+    }
+
+    public fileLeave(event) {
+        console.log(event);
+    }
+
+    resetTheUploadedFiles() {
+        this.uploadedFiles = [];
+    }
 }