cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-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 'ace-builds/src-noconflict/ace';
   5 import 'ace-builds/webpack-resolver';
   6 import {ToastrService} from 'ngx-toastr';
   7
   8 declare var $: any;
   9
  10 @Component({
  11     selector: 'app-scripts-tab',
  12     templateUrl: './scripts-tab.component.html',
  13     styleUrls: ['./scripts-tab.component.css']
  14 })
  15 export class ScriptsTabComponent implements OnInit {
  16
  17     public scriptsFiles: Map<string, string> = new Map<string, string>();
  18     public uploadedFiles: FileSystemFileEntry[] = [];
  19     public files: NgxFileDropEntry[] = [];
  20     private fileNames: Set<string> = new Set();
  21     fileToDelete: any = {};
  22
  23     constructor(
  24         private packageCreationStore: PackageCreationStore,
  25         private toastService: ToastrService
  26     ) {
  27     }
  28
  29
  30     ngOnInit() {
  31
  32         this.packageCreationStore.state$.subscribe(cbaPackage => {
  33             if (cbaPackage.scripts && cbaPackage.scripts.files && cbaPackage.scripts.files.size > 0) {
  34                 this.scriptsFiles = cbaPackage.scripts.files;
  35             }
  36         });
  37     }
  38
  39     public dropped(files: NgxFileDropEntry[]) {
  40         this.files = files;
  41         for (const droppedFile of files) {
  42             // Is it a file & Not added before ?
  43             if (droppedFile.fileEntry.isFile) {
  44                 const fileEntry = droppedFile.fileEntry as FileSystemFileEntry;
  45                 this.uploadedFiles.push(fileEntry);
  46                 console.log(fileEntry.name);
  47                 this.fileNames.add(fileEntry.name);
  48
  49             }
  50         }
  51     }
  52
  53     removeInitFile(index) {
  54         this.uploadedFiles.splice(index, 1);
  55     }
  56
  57     initDelete(file) {
  58         this.fileToDelete = file;
  59     }
  60
  61     removeFile(filePath: string, FileIndex: number) {
  62         const filename = filePath.split('/')[2] || '';
  63         //  const filename = 'Scripts/' + this.getFileType(this.uploadedFiles[fileIndex].name) + '/' + this.uploadedFiles[fileIndex].name;
  64         this.packageCreationStore.removeFileFromState(filePath);
  65         // remove from upload files array
  66         // tslint:disable-next-line: prefer-for-of
  67         for (let i = 0; i < this.uploadedFiles.length; i++) {
  68             if (this.uploadedFiles[i].name === filename) {
  69                 this.uploadedFiles.splice(i, 1);
  70                 break;
  71             }
  72         }
  73     }
  74
  75     public fileOver(event) {
  76         console.log(event);
  77     }
  78
  79     public fileLeave(event) {
  80         console.log(event);
  81     }
  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.addScripts('Scripts/' + this.getFileType(droppedFile.name) + '/' + droppedFile.name,
  90                         fileReader.result.toString());
  91                 };
  92                 fileReader.readAsText(file);
  93             });
  94
  95         }
  96     }
  97
  98     getFileType(filename: string): string {
  99         let fileType = '';
 100         const fileExtension = filename.substring(filename.lastIndexOf('.') + 1);
 101         if (fileExtension === 'py') {
 102             fileType = 'python';
 103         } else if (fileExtension === 'kt') {
 104             fileType = 'kotlin';
 105         }
 106         return fileType;
 107     }
 108
 109     resetTheUploadedFiles() {
 110         this.uploadedFiles = [];
 111     }
 112
 113     textChanges(code: any, key: string) {
 114         this.packageCreationStore.addScripts(key, code);
 115         this.toastService.success(key + ' is updated successfully');
 116     }
 117
 118     changeDivShow(mapIndex: number) {
 119         const divElement = document.getElementById('id-script-' + mapIndex) as HTMLElement;
 120         if (divElement.getAttribute('class').includes('show')) {
 121             divElement.setAttribute('class', 'collapse');
 122         } else {
 123             divElement.setAttribute('class', 'collapse show');
 124         }
 125     }
 126 }