gerrit.onap Code Review - appc/cdt.git/blob

   1 /*
   2 ============LICENSE_START==========================================
   3 ===================================================================
   4 Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
   5 ===================================================================
   6 Copyright (C) 2018 IBM.
   7 ===================================================================
   8
   9 Unless otherwise specified, all software contained herein is licensed
  10 under the Apache License, Version 2.0 (the License);
  11 you may not use this software except in compliance with the License.
  12 You may obtain a copy of the License at
  13
  14     http://www.apache.org/licenses/LICENSE-2.0
  15
  16 Unless required by applicable law or agreed to in writing, software
  17 distributed under the License is distributed on an "AS IS" BASIS,
  18 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  19 See the License for the specific language governing permissions and
  20 limitations under the License.
  21
  22 ============LICENSE_END============================================
  23 */
  24
  25 import { Component, Input, OnInit, ViewChild } from '@angular/core';
  26 import { HttpUtilService } from '../../../../shared/services/httpUtil/http-util.service';
  27 import { MappingEditorService } from '../../../../shared/services/mapping-editor.service';
  28 import { ArtifactRequest } from '../../../../shared/models/index';
  29 import { ActivatedRoute, Router } from '@angular/router';
  30 import { saveAs } from 'file-saver';
  31 import { NotificationService } from '../../../../shared/services/notification.service';
  32 import { NotificationsService } from 'angular2-notifications';
  33 import { ParamShareService } from '../../../../shared/services/paramShare.service';
  34 import { DialogService } from 'ng2-bootstrap-modal';
  35 import { ConfirmComponent } from '../../../../shared/confirmModal/confirm.component';
  36 import { BuildDesignComponent } from '../../build-artifacts.component';
  37 import { environment } from '../../../../../environments/environment';
  38 import { ModalComponent } from 'ng2-bs3-modal/ng2-bs3-modal';
  39 import { NgProgress } from 'ngx-progressbar';
  40 import { NgxSpinnerService } from 'ngx-spinner';
  41 import { UtilityService } from '../../../../shared/services/utilityService/utility.service';
  42 declare var $: any
  43
  44 @Component({ selector: 'app-golden-configuration', templateUrl: './template-configuration.component.html', styleUrls: ['./template-configuration.component.css'] })
  45 export class GoldenConfigurationComponent implements OnInit {
  46   @ViewChild('templateeditor') templateeditor;
  47   @Input() configMappingEditorContent: string;
  48   @Input() isMappingComp: boolean;
  49   @ViewChild('myInput') myInputVariable: any;
  50   @ViewChild('myModal') modal: ModalComponent;
  51   aceText: string = ""
  52   fileName: string = ""
  53   showTemplateVersionDiv: any;
  54   downloadedTemplateFileName: any;
  55   downloadedParamFileName: any;
  56   templateVersionNo: any = '0.0.1';
  57   saveToGuiCacheFlag = 'false';
  58   initialAction: any;
  59   public referenceData: Array<Object> = [];
  60   public scopeName: any;
  61   public subscription: any;
  62   public item: any = {};
  63   public goldenActions: Array<string> = [];
  64   public refNameObj = {};
  65   public action = '';
  66   public artifactName = '';
  67   public type;
  68   public showError: boolean = false;
  69   public tempretrieveFlag: boolean = false;
  70   public fileNameForTempSave;
  71   initialData: any;
  72   showDownloadDiv: boolean = false;
  73   downloadType: any;
  74   enableBrowse: boolean = true;
  75   enableMerge: boolean = false;
  76   uploadValidationSuccess: boolean = false;
  77   fileExtension: any = "xml";
  78   apiToken = localStorage['apiToken'];
  79   public appDataObject: any;
  80   public downloadDataObject: any;
  81   public checkNameEntered: boolean = true;
  82   public selectedWord: any = this.mappingEditorService.getSelectedWord();
  83   public Actions = [
  84     { action: "ConfigBackup", value: "ConfigBackup" },
  85     { action: "ConfigModify", value: "ConfigModify" },
  86     { action: "ConfigRestore", value: "ConfigRestore" },
  87     { action: "Configure", value: "Configure" },
  88     { action: "GetRunningConfig", value: "GetRunningConfig" },
  89     { action: "HealthCheck", value: "HealthCheck" },
  90     { action: "StartApplication", value: "StartApplication" },
  91     { action: "StopApplication", value: "StopApplication" }
  92   ];
  93   options = {
  94     timeOut: 1000,
  95     showProgressBar: true,
  96     pauseOnHover: true,
  97     clickToClose: true,
  98     maxLength: 200
  99   }
 100   public replaceWord;
 101   public enableDownloadButtons: boolean = false;
 102   constructor(
 103     private buildDesignComponent: BuildDesignComponent,
 104     private paramShareService: ParamShareService,
 105     private dialogService: DialogService,
 106     private notificationService: NotificationService,
 107     private httpUtil: HttpUtilService,
 108     private mappingEditorService: MappingEditorService,
 109     private activeRoutes: ActivatedRoute,
 110     private router: Router,
 111     private nService: NotificationsService,
 112     private ngProgress: NgProgress,
 113     private spinner: NgxSpinnerService,
 114     private utilityService: UtilityService) {
 115     this.artifactRequest.action = '';
 116     this.artifactRequest.version = '';
 117     this.artifactRequest.paramsContent = '{}';
 118     this.artifactRequest.paramKeysContent = '';
 119   }
 120   public templateEditor: any;
 121   public fileType: any = '';
 122   public actionType: any;
 123   public myfileName: any;
 124   userId = localStorage['userId'];
 125   public artifactRequest: ArtifactRequest = new ArtifactRequest();
 126   public showUploadStatus: boolean = false;
 127   public uploadStatus: boolean = false;
 128   public uploadTypes = [
 129     {
 130       value: 'Generated Template',
 131       display: 'Sample Json Param File'
 132     },
 133     {
 134       value: 'Mapping Data',
 135       display: 'Sample Json Param File'
 136     }
 137   ];
 138   vnfType: any = '';
 139   vnfcType: any = '';
 140   protocol: any = '';
 141   refObj: any;
 142   editor: any;
 143   editorContent: any;
 144   tempName: any;
 145   enableValidateTemplate: boolean = false;;
 146   public selectedUploadType: string = this.uploadTypes[0].value;
 147   identifier: any;
 148   public tempRetrievalResponse: any;
 149   public mergeStatus: boolean = false;
 150
 151   //======================================Start of ngOnInit() Method============================================
 152   ngOnInit() {
 153     var refObj = this.refObj = this.prepareFileName();
 154     if (refObj && refObj != undefined) {
 155       this.item = refObj;
 156
 157       this.vnfType = this.item.scope["vnf-type"];
 158       this.vnfcType = this.item.scope["vnfc-type"];
 159       this.protocol = this.item['device-protocol'];
 160       this.action = this.item.action;
 161       this.artifactRequest.action = this.item.action;
 162       this.artifactRequest.vnfType = this.vnfType;
 163       if (this.vnfcType != undefined && this.vnfcType.length != 0) {
 164         this.scopeName = this.vnfcType;
 165       }
 166       else {
 167         this.scopeName = this.vnfType;
 168       }
 169     }
 170     else {
 171       this.item = { "action": "", "scope": { "vnf-type": "", "vnfc-type": "" }, "vm": [], "protocol": "", "download-dg-reference": "", "user-name": "", "port-number": "", "artifact-list": [], "deviceTemplate": "", "scopeType": "" };
 172     }
 173     this.initialAction = this.item.action;
 174     this.activeRoutes.url.subscribe(UrlSegment => {
 175       this.actionType = UrlSegment[0].path
 176     })
 177     this.mappingEditorService.fromScreen = 'MappingScreen';
 178     this.identifier = this.mappingEditorService.identifier;
 179   }
 180   //========================== End of ngOnInit() Method============================================
 181   ngOnDestroy() {
 182     if (this.refObj && this.refObj != undefined) {
 183       if (this.configMappingEditorContent && this.configMappingEditorContent != undefined) {
 184         this.saveTemplate();
 185         this.prepareAppData();
 186         this.prepareDownloadData();
 187         this.mappingEditorService.changeNavAppData(this.appDataObject);
 188         this.mappingEditorService.changeNavDownloadData(this.downloadDataObject);
 189       }
 190     }
 191   }
 192   //========================== End of ngOnDestroy() Method============================================
 193   ngAfterViewInit() {
 194     if (this.mappingEditorService.latestAction) {
 195       this.refNameObj = this.mappingEditorService.latestAction;
 196       if (this.vnfcType !== 'null') {
 197         this.type = this.vnfcType;
 198       }
 199       else {
 200         this.type = this.vnfType;
 201       }
 202       for (let i = 0; i < this.refNameObj['artifact-list'].length; i++) {
 203         let artifactList = this.refNameObj['artifact-list'];
 204         if (artifactList[i]['artifact-type'] === 'config_template') {
 205           var artifactName = artifactList[i]['artifact-name'];
 206           var artifactNameWithoutExtension = '';
 207                     if (artifactName) {
 208             artifactNameWithoutExtension = artifactName.substring(0, artifactName.lastIndexOf("."));
 209           }
 210           if(this.mappingEditorService.identifier) {
 211             if(artifactNameWithoutExtension.endsWith(this.mappingEditorService.identifier)) {
 212                 this.artifactName = artifactName;
 213             }
 214           }
 215           else {
 216             this.artifactName = artifactName;
 217           }
 218
 219         }
 220       }
 221     }
 222     let self = this;
 223     this.templateEditor = self.templateeditor.getEditor();
 224     this.templateeditor.getEditor().commands.addCommand({
 225       name: 'annotateCommandAlternate',
 226       bindKey: { win: 'CTRL-4', mac: 'Command-4' },
 227       exec: (editor: any) => {
 228         this.handleAnnotation(this.modal);
 229       }
 230     });
 231     this.templateeditor.getEditor().$enableBlockSelect = false;
 232     this.templateeditor.getEditor().$enableMultiselect = false;
 233     if (this.mappingEditorService.fromScreen === 'MappingScreen') {
 234       this.configMappingEditorContent = this.mappingEditorService.getTemplateMappingDataFromStore();
 235       this.fileType = sessionStorage.getItem('fileType');
 236     }
 237     if (this.configMappingEditorContent) {
 238       this.artifactRequest.templateContent = this.configMappingEditorContent;
 239       this.mappingEditorService.initialise(this.templateeditor.getEditor(), this.artifactRequest.templateContent, this.modal);
 240     }
 241     if (this.refObj) {
 242       if (this.mappingEditorService.getTemplateMappingDataFromStore() && this.mappingEditorService.getTemplateMappingDataFromStore() != undefined) {
 243         this.configMappingEditorContent = this.mappingEditorService.getTemplateMappingDataFromStore();
 244       }
 245       else {
 246         if (this.artifactName) this.retrieveTemplateFromAppc();
 247       }
 248     }
 249     else {
 250       this.Actions = [];
 251       this.enableBrowse = false;
 252       this.nService.error("Error", "Please enter Action and VNF type in Reference Data screen");
 253     }
 254   }
 255
 256   //========================== End of ngAfterViewInit() Method============================================
 257   browseOption() {
 258     $("#inputFile").trigger('click');
 259   }
 260   //========================== End of browseOption() Method============================================
 261   //save to GUI
 262   public saveTemplate() {
 263     this.saveToGuiCacheFlag = 'true';
 264     this.mappingEditorService.paramData = [];
 265     if (this.configMappingEditorContent) {
 266       this.initialData = this.configMappingEditorContent;
 267       this.mappingEditorService.refreshEditor();
 268       let paramArr: any = []
 269       if (this.mappingEditorService.paramData && this.mappingEditorService.paramData != undefined) {
 270         if (this.mappingEditorService.paramData.length === 0 && this.mappingEditorService.hasErrorCode === true) {
 271           this.nService.error("Error", 'Special characters error', 'Error')
 272           return;
 273         }
 274         else {
 275           this.showError = false;
 276         }
 277       }
 278       this.showTemplateVersionDiv = true;
 279
 280       if (this.mappingEditorService.fromScreen === 'MappingScreen') {
 281         this.mappingEditorService.setTemplateMappingDataFromStore(this.configMappingEditorContent);
 282       }
 283       if (this.fileType === 'text/xml') {
 284         sessionStorage.setItem('fileType', 'text/xml');
 285       }
 286       if (this.fileType === '') {
 287         sessionStorage.setItem('fileType', '');
 288       }
 289     }
 290   }
 291   //========================== End of saveTemplate() Method============================================
 292   retrieveTemplateFromAppc() {
 293     let refObj = this.refObj;
 294     if (refObj && refObj != undefined) {
 295
 296       let fileName = this.artifactName;
 297       let input = this.utilityService.createPayloadForRetrieve(false, this.item.action, this.vnfType, fileName);
 298       let artifactContent: any;
 299       this.ngProgress.start();
 300       this.httpUtil.post({
 301         url: environment.getDesigns,
 302         data: input
 303       }).subscribe(resp => {
 304         if (resp.output.status.code === '400' && resp.output.status.message === "success") {
 305           this.nService.success("Success", "Template retrieved successfully from APPC");
 306           this.tempRetrievalResponse = resp;
 307           let result = JSON.parse(resp.output.data.block).artifactInfo[0];
 308           result = result['artifact-content'];
 309           if ('Generated Template' === this.selectedUploadType) {
 310             this.configMappingEditorContent = result
 311             this.artifactRequest.templateContent = this.configMappingEditorContent;
 312             this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
 313             if (this.artifactRequest.templateContent) {
 314               this.mappingEditorService.initialise(this.templateeditor.getEditor(), this.artifactRequest.templateContent, this.modal);
 315             }
 316           }
 317           this.tempretrieveFlag = true;
 318           this.fileNameForTempSave = fileName;
 319           this.enableDownloadButtons = true;
 320           this.initialData = result;
 321           this.saveTemplate();
 322         }
 323         else {
 324           this.nService.info("Information", "There is no template saved in APPC for the selected action!");
 325         }
 326         this.ngProgress.done();
 327       },
 328         error => this.nService.error("Error", "Error in connecting to APPC Server"));
 329       setTimeout(() => {
 330         this.ngProgress.done();
 331       }, 3500);
 332     }
 333   }
 334   //========================== End of retrieveTemplateFromAppc() Method============================================
 335   prepareAppData() {
 336     let refObj = this.refObj;
 337     if (refObj && refObj != undefined) {
 338       let paramsKeyValueFromEditor: JSON;
 339       try {
 340         paramsKeyValueFromEditor = JSON.parse(localStorage["paramsContent"]);
 341       }
 342       catch (error) {
 343         console.log("Could not parse name value pairs==" + error);
 344       }
 345       if (paramsKeyValueFromEditor) {
 346         this.showTemplateVersionDiv = true;
 347         let action = this.item.action;
 348         var scopeName = this.scopeName.replace(/ /g, '').replace(new RegExp('/', "g"), '_').replace(/ /g, '');
 349         var fileName = '';
 350         let id = this.mappingEditorService.identifier;
 351         if (id) fileName = this.updateFileNameForConfigScaleOut(this.item.action, scopeName, this.templateVersionNo, id);
 352         else fileName = this.updateParamFileName(this.item.action, scopeName, this.templateVersionNo);
 353
 354         let vnfType = this.vnfType;
 355         let Json = [paramsKeyValueFromEditor];
 356         let slashedPayload = this.appendSlashes(JSON.stringify(Json));
 357         let newPayload =
 358           {
 359             "userID": this.userId,
 360             "vnf-type": this.vnfType,
 361             "action": action,
 362             "artifact-name": fileName,
 363             "artifact-type": "APPC-CONFIG",
 364             "artifact-version": this.templateVersionNo,
 365             "artifact-contents": slashedPayload
 366           }
 367         let data =
 368           {
 369             "input": {
 370               "design-request": {
 371                 "request-id": this.apiToken,
 372                 "action": "uploadArtifact",
 373                 "payload": JSON.stringify(newPayload)
 374
 375               }
 376             }
 377           }
 378         this.appDataObject.template.nameValueData = data;
 379       }
 380       if (this.configMappingEditorContent) {
 381         let actualContent = this.configMappingEditorContent;
 382         this.mappingEditorService.generateTemplate(this.templateEditor);
 383         this.showTemplateVersionDiv = true;
 384         let action = this.item.action;
 385         let versionandFileType: any;
 386         if (this.fileType === "text/xml") {
 387
 388           versionandFileType = this.templateVersionNo + 'V.xml'
 389         } else {
 390
 391           versionandFileType = this.templateVersionNo + 'V.json'
 392         }
 393         let fileName: any;
 394         if (this.tempretrieveFlag) {
 395           fileName = this.fileNameForTempSave;
 396         }
 397         else {
 398           fileName = this.artifactName;
 399         }
 400         let vnfType = this.vnfType;
 401         let newPayload =
 402           {
 403             "userID": this.userId,
 404             "vnf-type": this.vnfType,
 405             "action": action,
 406             "artifact-name": fileName,
 407             "artifact-type": "APPC-CONFIG",
 408             "artifact-version": this.templateVersionNo,
 409             "artifact-contents": this.configMappingEditorContent.replace(/\(([^()]|(R))*\)=\(/g, '').replace(/\)}/g, '}')
 410
 411           }
 412         let data =
 413           {
 414             "input": {
 415               "design-request": {
 416                 "request-id": this.apiToken,
 417                 "action": "uploadArtifact",
 418                 "payload": JSON.stringify(newPayload)
 419
 420               }
 421             }
 422           }
 423         this.appDataObject.template.templateData = data;
 424         this.mappingEditorService.initialise(this.templateeditor.getEditor(), actualContent, this.modal);
 425       }
 426     }
 427   }
 428   //========================== End of prepareAppData() Method============================================
 429   prepareFileName(): any {
 430     let fileNameObject: any = this.mappingEditorService.latestAction;
 431     this.appDataObject = this.mappingEditorService.appDataObject;
 432     this.downloadDataObject = this.mappingEditorService.downloadDataObject;
 433     this.referenceData = fileNameObject;
 434     return fileNameObject;
 435   }
 436   //========================== End of prepareFileName() Method============================================
 437   onDownloadParameter() {
 438     let refObj = this.refObj;
 439     if (refObj) {
 440       let paramsKeyValueFromEditor: JSON;
 441       try {
 442         paramsKeyValueFromEditor = JSON.parse(localStorage["paramsContent"]);
 443       }
 444       catch (error) {
 445         console.log("Could not parse name value pairs==" + error);
 446       }
 447       let theJSON = JSON.stringify(paramsKeyValueFromEditor, null, "\t")
 448       var blob = new Blob([theJSON], {
 449         type: "text/json"
 450       });
 451       this.showTemplateVersionDiv = true;
 452       let fileName: any;
 453       var scopeName = this.scopeName.replace(/ /g, '').replace(new RegExp('/', "g"), '_').replace(/ /g, '');
 454       let id = this.mappingEditorService.identifier;
 455       if (id) fileName = this.updateFileNameForConfigScaleOut(this.item.action, scopeName, this.templateVersionNo, id);
 456       else fileName = this.updateParamFileName(this.item.action, scopeName, this.templateVersionNo);
 457
 458       this.downloadDataObject.template.nameValueData = theJSON;
 459       this.downloadDataObject.template.nameValueFileName = fileName;
 460     }
 461     else {
 462       this.nService.error("Error", "Please enter Action and VNF type in Reference Data screen");
 463     }
 464
 465   }
 466   //========================== End of onDownloadParameter() Method============================================
 467   updateParamFileName(action: any, scopeName: any, versionNo: any) {
 468     let fileName = 'param_' + action + '_' + scopeName + '_' + versionNo + 'V.json';
 469     this.downloadedParamFileName = fileName;
 470     return fileName;
 471   }
 472   //========================== End of updateParamFileName() Method============================================
 473   updateFileNameForConfigScaleOut(action: any, scopeName: any, versionNo: any, id: any) {
 474     let fileName = 'param_' + action + '_' + scopeName + '_' + versionNo + 'V_' + id + '.json';
 475     this.downloadedParamFileName = fileName;
 476     return fileName;
 477   }
 478   //========================== End of updateFileNameForConfigScaleOut() Method============================================
 479   public onDownloadTemplate(artifact: string) {
 480     let actualContent = this.configMappingEditorContent;
 481     var textToSaveAsBlob: any;
 482     var config_template_fileName: any
 483     let refObj = this.refObj;
 484     let versionandFileType: string;
 485     if (artifact == 'Template' && this.artifactRequest && this.configMappingEditorContent && refObj) {
 486       this.showTemplateVersionDiv = true;
 487       if (this.fileType === "text/xml") {
 488         textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
 489           type: "text/xml"
 490         });
 491         versionandFileType = this.templateVersionNo + 'V.xml'
 492       }
 493       if (this.fileType === "text/plain") {
 494         textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
 495           type: "text/plain"
 496         });
 497         versionandFileType = this.templateVersionNo + 'V.txt'
 498       }
 499       if (this.fileType === "text/json") {
 500         textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
 501           type: "text/json"
 502         });
 503         versionandFileType = this.templateVersionNo + 'V.json'
 504       }
 505       if (this.tempretrieveFlag) {
 506         config_template_fileName = this.fileNameForTempSave;
 507         var filextension = config_template_fileName.substring(config_template_fileName.indexOf("V") + 2, config_template_fileName.length);
 508
 509         textToSaveAsBlob = new Blob([this.configMappingEditorContent], {
 510           type: "text/" + filextension
 511         });
 512       }
 513       else {
 514         config_template_fileName = this.artifactName;
 515       }
 516       this.mappingEditorService.initialise(this.templateeditor.getEditor(), actualContent, this.modal);
 517       this.downloadDataObject.template.templateData = this.configMappingEditorContent.replace(/\(([^()]|(R))*\)=\(/g, '').replace(/\)}/g, '}');
 518       this.downloadDataObject.template.templateFileName = config_template_fileName;
 519     }
 520
 521   }
 522   //========================== End of onDownloadTemplate() Method============================================
 523   fileChange(input) {
 524
 525     let self = this;
 526     let refObj = this.refObj;
 527     this.enableValidateTemplate = true;
 528
 529     if (refObj && refObj != undefined) {
 530       if (input.files && input.files[0]) {
 531         this.spinner.show();
 532         this.myfileName = input.files[0].name;
 533         this.fileName = input.files[0].name;
 534         this.fileType = input.files[0].type;
 535         let reader = new FileReader();
 536         this.readFile(input.files[0], reader, (result) => {
 537           if (this.fileType === 'text/xml') {
 538             sessionStorage.setItem('fileType', 'text/xml');
 539           }
 540           if (this.fileName.endsWith(".json")) {
 541             this.fileType = "text/json";
 542             sessionStorage.setItem('fileType', 'text/json');
 543           }
 544           if (this.fileType === '') {
 545             sessionStorage.setItem('fileType', '');
 546           }
 547
 548
 549           if ('Generated Template' === this.selectedUploadType) {
 550             this.configMappingEditorContent = result
 551             this.artifactRequest.templateContent = this.configMappingEditorContent;
 552             this.notificationService.notifySuccessMessage('Configuration Template file successfully uploaded..');
 553             if (this.artifactRequest.templateContent) {
 554               this.mappingEditorService.initialise(this.templateeditor.getEditor(), this.artifactRequest.templateContent, this.modal);
 555             }
 556           }
 557           this.enableDownloadButtons = true;
 558           this.initialData = result;
 559           this.saveTemplate();
 560           this.templateeditor.getEditor().$enableBlockSelect = false;
 561           this.templateeditor.getEditor().$enableMultiselect = false;
 562           setTimeout(() => {
 563                         /** spinner ends after 3.5 seconds */
 564                         this.spinner.hide();
 565           }, 3500);
 566         });
 567       }
 568       else {
 569         this.nService.error("Error", "Failed to read file");
 570       }
 571       this.myInputVariable.nativeElement.value = "";
 572     }
 573     else {
 574       this.nService.error("Error", "Please enter Action and VNF type in Reference Data screen");
 575       return false;
 576     }
 577   }
 578   //========================== End of fileChange() Method============================================
 579   public readFile(file, reader, callback) {
 580     // Set a callback funtion to fire after the file is fully loaded
 581     reader.onload = () => {
 582       // callback with the results
 583       callback(reader.result);
 584     }
 585     this.notificationService.notifySuccessMessage('Uploading File ' + file.name + ':' + file.type + ':' + file.size);
 586     // Read the file
 587     reader.readAsText(file, "UTF-8");
 588   }
 589   //========================== End of readFile() Method============================================
 590   validateUploadedFile(fileExtension) {
 591
 592     if (fileExtension.toUpperCase() === 'json'.toUpperCase() || fileExtension.toUpperCase() === 'xml'.toUpperCase()) {
 593       return true;
 594     }
 595     else {
 596       return false;
 597     }
 598
 599   }
 600   //========================== End of validateUploadedFile() Method============================================
 601   appendSlashes(artifactData) {
 602     let x = artifactData.replace(new RegExp(',"', "g"), ',\"');
 603     let y = x.replace(new RegExp('":', 'g'), '\":');
 604     let z = y.replace(new RegExp('{"', 'g'), '{\"')
 605     let t = z.replace(new RegExp(':"', 'g'), ':\"')
 606     let m = t.replace(new RegExp('",', 'g'), '\",');
 607     let n = y.replace(new RegExp('"}', 'g'), '\"}')
 608     let nw = n.replace(new RegExp('{"', 'g'), '{\"');
 609     let nw1 = nw.replace(new RegExp(':"', 'g'), ':\"');
 610     let nw2 = nw1.replace(new RegExp('",', 'g'), '\",');
 611     return nw2;
 612   }
 613   //========================== End of appendSlashes() Method============================================
 614   prepareDownloadData() {
 615     this.onDownloadParameter();
 616     this.onDownloadTemplate('Template');
 617   }
 618   //========================== End of prepareDownloadData() Method============================================
 619   syncTemplate() {
 620     this.mappingEditorService.replaceNamesWithBlankValues();
 621     this.saveTemplate();
 622
 623     var templateData = this.mappingEditorService.paramData; //template data array
 624     var pdData = this.paramShareService.getSessionParamData(); //PD data array
 625     var paramsContent = localStorage["paramsContent"];
 626
 627     if (paramsContent && paramsContent != undefined) {
 628       try {
 629         var paramTabData = JSON.parse(paramsContent);
 630       }
 631       catch (error) {
 632         console.log("error is : " + error)
 633       }
 634     }
 635     var resultArr = [];
 636     var json = {};
 637     var resultParamObj = {};
 638     let checkNamesOnlyCondition: boolean = true;
 639
 640     if (templateData && templateData != undefined) {
 641       templateData.forEach(function (item) {
 642         if (item.paramValue !== "" && item.paramValue != undefined && item.paramValue != null) {
 643           checkNamesOnlyCondition = false;
 644         }
 645
 646       });
 647
 648       templateData.forEach(function (item) {
 649         resultParamObj[item.paramName] = item.paramValue;
 650       });
 651       if (paramTabData && paramTabData != undefined) {
 652         templateData.forEach(function (item) {
 653           for (var index in paramTabData) {
 654             if (item.paramName === index) {
 655               if (checkNamesOnlyCondition) {
 656                 resultParamObj[index] = paramTabData[index];
 657               }
 658               else {
 659                 if (item.paramValue === "") {
 660                   resultParamObj[index] = paramTabData[index];
 661                 }
 662                 else {
 663                   resultParamObj[index] = item.paramValue;
 664                 }
 665               }
 666             }
 667
 668           }
 669
 670         });
 671
 672       }
 673       localStorage["paramsContent"] = JSON.stringify(resultParamObj);
 674       templateData = Array.from(new Set(templateData.map((itemInArray) => itemInArray.paramName)))
 675
 676       //reformatting arr1 to match with PD
 677       templateData.forEach(function (item) {
 678
 679         resultArr.push({
 680           "name": item,
 681           "type": null,
 682           "description": null,
 683           "required": null,
 684           "default": null,
 685           "source": "Manual",
 686           "rule-type": null,
 687           "request-keys": [{
 688             "key-name": null,
 689             "key-value": null
 690           }, {
 691             "key-name": null,
 692             "key-value": null
 693           }, {
 694             "key-name": null,
 695             "key-value": null
 696           }],
 697           "response-keys": [{
 698             "key-name": null,
 699             "key-value": null
 700           }, {
 701             "key-name": null,
 702             "key-value": null
 703           }, {
 704             "key-name": null,
 705             "key-value": null
 706           }, {
 707             "key-name": null,
 708             "key-value": null
 709           }, {
 710             "key-name": null,
 711             "key-value": null
 712           }],
 713           "ruleTypeValues": [null]
 714
 715         })
 716       });
 717     }
 718     if (pdData && pdData != undefined) {
 719       for (var i = 0; i < resultArr.length; i++) {
 720
 721         pdData.forEach(function (arr2item) {
 722           if (resultArr[i].name === arr2item.name) {
 723
 724             var json = {
 725               "name": arr2item.name,
 726               "type": arr2item.type,
 727               "description": arr2item.description,
 728               "required": arr2item.required,
 729               "default": arr2item.default,
 730               "source": arr2item.source,
 731               "rule-type": arr2item["rule-type"],
 732               "request-keys": arr2item["request-keys"],
 733               "response-keys": arr2item["response-keys"],
 734               "ruleTypeValues": arr2item.ruleTypeValues
 735             };
 736             resultArr.splice(i, 1, json)
 737           }
 738
 739         });
 740
 741       };
 742
 743     }
 744     this.paramShareService.setSessionParamData(resultArr);
 745     this.mappingEditorService.paramData = [];
 746     //navigate to PD page after sync
 747     this
 748       .router
 749       .navigate(['../../../vnfs/design/parameterDefinitions/create']);
 750   }
 751
 752   //========================== End of syncTemplate() Method============================================
 753   mergeParams() {
 754     this.mergeStatus = this.mappingEditorService.autoAnnotateDataForParams();
 755     if (this.mergeStatus) {
 756       this.nService.success("Success", "Merge Successful");
 757     }
 758     else {
 759       this.nService.error("Error", "Merge Unsuccessful");
 760     }
 761     this.saveTemplate();
 762   }
 763   //========================== End of mergeParams() Method============================================
 764   public handleAnnotation(modal) {
 765
 766     this.selectedWord = this.templateeditor.getEditor().session.getTextRange(this.templateeditor.getEditor().selectionRange);
 767     if (this.selectedWord && this.selectedWord != undefined) modal.open();
 768   }
 769   //========================== End of handleAnnotations() Method============================================
 770   public submitNameValues() {
 771     if (this.tempName) {
 772       this.checkNameEntered = true;
 773
 774       if (this.selectedWord) {
 775         if (this.selectedWord.startsWith('${(')) {
 776           var replaceWord: any = this.replaceWord = this.selectedWord.substring(3, this.selectedWord.indexOf(')=(')) + this.tempName;
 777           this.templateeditor.getEditor().session.replace(this.templateeditor.getEditor().session.selection.getRange(), replaceWord);
 778
 779         } else {
 780           let mappingKey = this.mappingEditorService.getKeysForValues(this.selectedWord);
 781           var replaceWord: any = this.replaceWord = '${(' + this.selectedWord + ')=(' + this.tempName + ')}';
 782           this.templateeditor.getEditor().session.replace(this.templateeditor.getEditor().session.selection.getRange(), replaceWord);
 783
 784         }
 785       }
 786       this.mappingEditorService.refreshEditor();
 787       this.tempName = '';
 788       this.modal.close();
 789
 790     }
 791     else {
 792       this.checkNameEntered = false;
 793     }
 794
 795   }
 796   //========================== End of submitNameValues() Method============================================
 797 }