cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/template-mapping/templ-mapp-creation/templ-mapp-creation.component.ts

   1 import {Component, EventEmitter, OnInit, Output} from '@angular/core';
   2 import {FileSystemFileEntry, NgxFileDropEntry} from 'ngx-file-drop';
   3 import {PackageCreationStore} from '../../package-creation.store';
   4 import {TemplateInfo, TemplateStore} from '../../template.store';
   5
   6 @Component({
   7     selector: 'app-templ-mapp-creation',
   8     templateUrl: './templ-mapp-creation.component.html',
   9     styleUrls: ['./templ-mapp-creation.component.css']
  10 })
  11 export class TemplMappCreationComponent implements OnInit {
  12     @Output() showListViewParent = new EventEmitter<any>();
  13
  14     public uploadedFiles: FileSystemFileEntry[] = [];
  15     private fileNames: Set<string> = new Set();
  16
  17     public files: NgxFileDropEntry[] = [];
  18     fileName: any;
  19     templateInfo = new TemplateInfo();
  20     private variables: string[] = [];
  21
  22
  23     constructor(private packageCreationStore: PackageCreationStore, private templateStore: TemplateStore) {
  24     }
  25
  26     ngOnInit() {
  27         this.templateStore.state$.subscribe(templateInfo => {
  28             this.templateInfo = templateInfo;
  29             this.fileName = templateInfo.fileName.split('/')[1];
  30             this.variables = this.getTemplateVariable(templateInfo.fileContent);
  31         });
  32     }
  33
  34     public getTemplateVariable(fileContent: string) {
  35         const variables: string[] = [];
  36         const stringsSlittedByBraces = fileContent.split('${');
  37         const stringsDefaultByDollarSignOnly = fileContent.split('"$');
  38
  39         for (let i = 1; i < stringsSlittedByBraces.length; i++) {
  40             const element = stringsSlittedByBraces[i];
  41             if (element) {
  42                 const firstElement = element.split('}')[0];
  43                 if (!variables.includes(firstElement)) {
  44                     variables.push(firstElement);
  45                 } else {
  46                     console.log(firstElement);
  47                 }
  48             }
  49         }
  50
  51         for (let i = 1; i < stringsDefaultByDollarSignOnly.length; i++) {
  52             const element = stringsDefaultByDollarSignOnly[i];
  53             if (element && !element.includes('$')) {
  54                 const firstElement = element.split('"')[0]
  55                     .replace('{', '')
  56                     .replace('}', '').trim();
  57                 if (!variables.includes(firstElement)) {
  58                     variables.push(firstElement);
  59                 }
  60             }
  61         }
  62         return variables;
  63     }
  64
  65     public dropped(files: NgxFileDropEntry[]) {
  66         this.files = files;
  67         for (const droppedFile of files) {
  68             // Is it a file? & Not added before
  69             if (droppedFile.fileEntry.isFile && !this.fileNames.has(droppedFile.fileEntry.name)) {
  70                 const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
  71                 this.uploadedFiles.push(fileEntry);
  72                 this.fileNames.add(fileEntry.name);
  73
  74             }
  75         }
  76     }
  77
  78     removeFile(fileIndex: number) {
  79         /*const filename = 'Definitions/' + this.uploadedFiles[fileIndex].name;
  80         this.packageCreationStore.removeFileFromDefinition(filename);
  81         this.uploadedFiles.splice(fileIndex, 1);*/
  82     }
  83
  84     setFilesToStore() {
  85         for (const droppedFile of this.uploadedFiles) {
  86             droppedFile.file((file: File) => {
  87                 const fileReader = new FileReader();
  88                 fileReader.onload = (e) => {
  89                     this.packageCreationStore.addTemplate('Templates/' + this.fileName,
  90                         fileReader.result.toString());
  91                 };
  92                 fileReader.readAsText(file);
  93             });
  94
  95         }
  96         this.uploadedFiles = [];
  97     }
  98
  99     public fileOver(event) {
 100         console.log(event);
 101     }
 102
 103     public fileLeave(event) {
 104         console.log(event);
 105     }
 106
 107     resetTheUploadedFiles() {
 108         this.uploadedFiles = [];
 109     }
 110
 111     openListView() {
 112         this.showListViewParent.emit('tell parent to open create views');
 113     }
 114
 115     initTemplateMappingTableFromCurrentTemplate() {
 116         if (this.variables && this.variables.length > 0) {
 117             this.packageCreationStore.getTemplateAndMapping(this.variables);
 118         }
 119     }
 120 }