cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/imports-tab/imports-tab.component.ts

   1 import {Component, OnInit} from '@angular/core';
   2 import {FileSystemFileEntry, NgxFileDropEntry} from 'ngx-file-drop';
   3 import {PackageCreationStore} from '../package-creation.store';
   4 import {PackageCreationUtils} from '../package-creation.utils';
   5
   6
   7 @Component({
   8     selector: 'app-imports-tab',
   9     templateUrl: './imports-tab.component.html',
  10     styleUrls: ['./imports-tab.component.css']
  11 })
  12 export class ImportsTabComponent implements OnInit {
  13
  14     public definitionFiles: Map<string, string> = new Map<string, string>();
  15     public uploadedFiles: FileSystemFileEntry[] = [];
  16     private fileNames: Set<string> = new Set();
  17
  18     public files: NgxFileDropEntry[] = [];
  19
  20     constructor(private packageCreationStore: PackageCreationStore, private packageCreationUtils: PackageCreationUtils) {
  21         this.packageCreationStore.state$.subscribe(cbaPackage => {
  22             if (cbaPackage.definitions && cbaPackage.definitions.imports && cbaPackage.definitions.imports.size > 0) {
  23                 this.definitionFiles = cbaPackage.definitions.imports;
  24             }
  25         });
  26     }
  27
  28     ngOnInit(): void {
  29         // TODO
  30     }
  31
  32     public dropped(files: NgxFileDropEntry[]) {
  33         this.files = files;
  34         for (const droppedFile of files) {
  35             // Is it a file? & Not added before
  36             if (droppedFile.fileEntry.isFile && !this.fileNames.has(droppedFile.fileEntry.name)) {
  37                 const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
  38                 this.uploadedFiles.push(fileEntry);
  39                 console.log(fileEntry.name);
  40                 this.fileNames.add(fileEntry.name);
  41
  42             } /*else {
  43                 const directorEntry = droppedFile.fileEntry as FileSystemDirectoryEntry;
  44                 this.filesUnderDirectory = directorEntry.getFile('');
  45                // const fileEntry = droppedFile.fileEntry as FileSystemDirectoryEntry;
  46                /* this.uploadedFile.push(droppedFile);
  47                 const formData = new FormData()
  48                 formData.append('logo', fileEntry, droppedFile.relativePath);
  49                 console.log(formData);*/
  50             /* // It was a directory (empty directories are added, otherwise only files)
  51              const fileEntry = droppedFile.fileEntry as FileSystemDirectoryEntry;
  52              console.log(droppedFile.relativePath, fileEntry);
  53
  54
  55               const formData = new FormData();
  56               formData.append('logo', droppedFile, droppedFile.relativePath);
  57               console.log(formData);
  58
  59              //this.packageCreationStore.addDefinition(droppedFile.relativePath, this.getContent(droppedFile.relativePath));
  60 */
  61             /* }*/
  62         }
  63     }
  64
  65     removeFile(fileIndex: number) {
  66         console.log(this.uploadedFiles[fileIndex]);
  67         console.log(this.uploadedFiles);
  68         this.packageCreationStore.removeFileFromDefinition(this.uploadedFiles[fileIndex].name);
  69         this.uploadedFiles.splice(fileIndex, 1);
  70     }
  71
  72     public fileOver(event) {
  73         console.log(event);
  74     }
  75
  76     public fileLeave(event) {
  77         console.log(event);
  78     }
  79
  80     /* readFileContent(file: File): string | ArrayBuffer {
  81          const fileReader = new FileReader();
  82         // let content: string | ArrayBuffer = '';
  83          fileReader.onload = (e) => {
  84              content = fileReader.result;
  85          };
  86          fileReader.readAsText(file);
  87          return content;
  88      }
  89  */
  90     setFilesToStore() {
  91         for (const droppedFile of this.uploadedFiles) {
  92             droppedFile.file((file: File) => {
  93                 const fileReader = new FileReader();
  94                 fileReader.onload = (e) => {
  95                     this.packageCreationStore.addDefinition('Definitions/' + droppedFile.name,
  96                             fileReader.result.toString());
  97                 };
  98                 fileReader.readAsText(file);
  99             });
 100
 101         }
 102     }
 103
 104     resetTheUploadedFiles() {
 105         this.uploadedFiles = [];
 106     }
 107 }