Initial seed code contribution for CDT

Issue-ID: APPC-682
Change-Id: I0331ffce2a430195c29d0d1b2295966f9eb28699
Signed-off-by: Skip Wonnell <skip@att.com>

6 files changed, 1491 insertions, 0 deletions

diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.spec.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.spec.ts
new file mode 100644
index 0000000..8a9c112
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.spec.ts
@@ -0,0 +1,114 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+/* tslint:disable:no-unused-variable */
+
+import {inject, TestBed} from '@angular/core/testing';
+import {ParameterDefinitionService} from './parameter-definition.service';
+import {NotificationsService} from 'angular2-notifications';
+import {MappingEditorService} from '../../../shared/services/mapping-editor.service';
+import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
+import {UtilityService} from '../../../shared/services/utilityService/utility.service';
+import {ParamShareService} from '../../../shared/services/paramShare.service';
+
+
+class MockService {
+    doStuff() {
+        return this;
+    }
+}
+
+describe('ParameterDefinitionService', () => {
+    beforeEach(() => {
+        let httpUtilService = new MockService();
+        TestBed.configureTestingModule({
+            providers: [ParameterDefinitionService, NotificationsService, MappingEditorService, ParamShareService, HttpUtilService, UtilityService,
+                {provide: HttpUtilService, useValue: httpUtilService}]
+        });
+    });
+
+    it('should create a service...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+        expect(service).toBeTruthy();
+    }));
+
+    it('should remove unwanted values from PD object...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+        let obj = {
+            'vnf-parameter-list': [{
+                'ruleTypeValues': 'ruleTypeValues',
+                'showFilterFields': 'showFilterFields',
+                'enableFilterByValue': 'enableFilterByValue'
+            }]
+        };
+
+        expect(service.removeUnwantedvalues(obj)).toEqual({'vnf-parameter-list': [{}]});
+    }));
+
+
+    it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+        let obj = [{'source': 'A&AI', 'ruleType': 'vm-name-list'}];
+
+        expect(service.populateDataUponSource(obj));
+    }));
+
+    it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+        let obj = [{'source': 'Manual', 'ruleType': 'vm-name-list'}];
+
+        expect(service.populateDataUponSource(obj));
+    }));
+
+    it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+        let obj = [{'source': 'Something', 'ruleType': 'vm-name-list'}];
+
+        expect(service.populateDataUponSource(obj));
+    }));
+
+
+    it('populateDataUponSource...', inject([ParameterDefinitionService], (service: ParameterDefinitionService) => {
+        let obj = [{'source': 'Something', 'ruleType': 'vm-name-list'}];
+
+        expect(service.populatePD(obj));
+    }));
+
+    it('processPDfile...', inject([ParameterDefinitionService], (service: ParameterDefinitionService)=> {
+        let yaml = "---\nkind: Property Definition\nversion: V1\nvnf-parameter-list:\n- name: LICENSE_KEY\n  type: null\n  description: null\n  required: null\n  default: null\n  source: Manual\n  rule-type: null\n  request-keys: null\n  response-keys: null";
+        let expectedPD = [{"name":"LICENSE_KEY","type":null,"description":null,"required":null,"default":null,"source":"Manual","rule-type":null,
+        "request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null
+        ,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}];
+        
+        expect(service.processPDfile("testfile.yaml", yaml)).toEqual(expectedPD);
+
+    }));
+
+    // it('processKeyFile...', inject([ParameterDefinitionService, ParamShareService], (service: ParameterDefinitionService, paramShareService: ParamShareService)=> {
+    //     let keyFile = "PARAMVALUE|SOURCE|RULETYPE|KEY1|VALUE1|KEY2|VALUE2|KEY3|VALUE3\nvalue1|INSTAR|interface_ip_address|UniqueKeyName1|addressfqdn123|UniqueKeyValue|m001ssc001p1n001v001|FieldKeyName|ipaddress_v4\nvalue2|INSTAR|interface_ip_address|UniqueKeyName2|addressfqdnAsgar1|UniqueKeyValue|m001ssc001p1n001v002|FieldKeyName|ipaddress_v4";
+    //     let expectedPD = [{"name":"name1","type":null,"description":null,"required":null,"default":null,"source":"Manual","rule-type":null,
+    //     "request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null
+    //     ,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}];
+    //     localStorage['paramsContent'] = "{ \"name1\":\"value1\",\"name2\":\"value2\"}";
+    //     paramShareService.setSessionParamData(expectedPD)
+    //     expect(service.processKeyFile("testfile.txt", keyFile)).toEqual(expectedPD);
+
+    // }));
+
+});
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.ts
new file mode 100644
index 0000000..89eeec2
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter-definition.service.ts
@@ -0,0 +1,509 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+
+import {Injectable, ViewChild} from '@angular/core';
+import {saveAs} from 'file-saver';
+import {ParamShareService} from '../../../shared/services/paramShare.service';
+import {MappingEditorService} from '../../../shared/services/mapping-editor.service';
+import {ModalComponent} from '../../../shared/modal/modal.component';
+import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
+import {UtilityService} from '../../../shared/services/utilityService/utility.service';
+import {NotificationsService} from 'angular2-notifications';
+import 'rxjs/add/operator/map';
+
+let YAML = require('yamljs');
+
+declare var $: any;
+
+@Injectable()
+export class ParameterDefinitionService {
+
+    public vnfcTypeData: string = '';
+    public selectedUploadType: string;
+    @ViewChild(ModalComponent) modalComponent: ModalComponent;
+    public title: string;
+    public parameterDefinitionMap: { [index: string]: string; } = {};
+    public parameterNameValues = {};
+    public displayParamObjects;
+    public modelParamDefinitionObjects;
+    public vnfType: any;
+    vnfcType: any;
+    protocol: any;
+    public refNameObj = {};
+    public action;
+    public artifactName;
+    public type;
+    public appDataObject: any;
+    public downloadDataObject: any;
+    public artifact_fileName;
+    identifier: any;
+    public myKeyFileName = null;
+    public myPdFileName = null;
+    private selectedActionReference: any;
+    private apiToken = localStorage['apiToken'];
+    private userId = localStorage['userId'];
+
+    constructor(private mappingEditorService: MappingEditorService,
+                private paramShareService: ParamShareService,
+                private nService: NotificationsService,
+                private httpService: HttpUtilService,
+                private utilService: UtilityService) {
+
+    }
+
+    public initialize() {
+
+    }
+
+    public setValues(vnfType, vnfcType, protocol, action, artifactName) {
+        this.vnfType = vnfType;
+        this.vnfcType = vnfcType;
+        this.protocol = protocol;
+        this.action = action;
+        this.artifact_fileName = artifactName;
+    }
+
+    public afterInit(artifactName, displayParamObjects) {
+
+    }
+
+    //========================== End of saveChanges() Method============================================
+    /* Saves pd to appc */
+    public sendPD(yamlString: String) {
+        let result: any;
+        let payload = '{"userID": "' + this.userId + '","vnf-type" : "' + this.vnfType + '","action" : "' + this.action + '","artifact-name" : "' + this.artifact_fileName + '","artifact-type" : "APPC-CONFIG","artifact-version" : "0.0.1","artifact-contents" : ' + yamlString + '}';
+        let input = {
+            'input': {
+                'design-request': {
+                    'request-id': this.apiToken,
+                    'action': 'uploadArtifact',
+                    'payload': payload
+                }
+            }
+        };
+        this.appDataObject.pd = input;
+    }
+
+
+    //========================== End of filetrByFieldChanged() Method============================================
+    removeUnwantedvalues(obj) {
+        let result = Object.assign({}, obj);
+        result['vnf-parameter-list'].forEach(obj => {
+            delete obj['ruleTypeValues'];
+            delete obj['showFilterFields'];
+            delete obj['enableFilterByValue'];
+        });
+        return result;
+    }
+
+    //========================== End of removeUnwantedvalues() Method============================================
+    populateDataUponSource(displayParamObjects) {
+        displayParamObjects.forEach(parameter => {
+            if (parameter.source == 'A&AI') {
+                parameter.ruleTypeValues = [null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list'];
+                if (parameter['rule-type'] == 'vm-name-list' || parameter['rule-type'] == 'vnfc-name-list' || parameter['rule-type'] == 'vnfc-oam-ipv4-address-list') {
+                    parameter.showFilterFields = true;
+                    parameter.enableFilterByValue = false;
+                } else {
+                    parameter.showFilterFields = false;
+                }
+
+            } else if (parameter.source == 'Manual') {
+                parameter.ruleTypeValues = [null];
+            }
+            else {
+                parameter.ruleTypeValues = [parameter['rule-type']];
+            }
+        });
+
+    }
+
+    //========================== End of getPD() Method============================================
+    populatePD(result: any) {
+        let fileContent = JSON.stringify(result);
+        //Added code to deserialize, serialize and format the response keys for display purposes ??May be unneessary?? To Do: - Check 
+        let fileObj = JSON.parse(fileContent);
+        this.displayParamObjects = this.formatFileContentForDisplay(fileObj);
+        this.populateDataUponSource(this.displayParamObjects);
+        this.formatResponseForKey(this.displayParamObjects);
+        if (undefined !== this.displayParamObjects)
+            this.modelParamDefinitionObjects = this.displayParamObjects;
+        if (this.displayParamObjects !== undefined && this.displayParamObjects.length > 0) {
+            this.paramShareService.setSessionParamData(this.displayParamObjects);
+        }
+        return this.displayParamObjects;
+    }
+
+    //========================== End of populatePD() Method============================================
+    /* Formats each object read from YAML file as per page expectations */
+    formatResponseForKey(param: any[]) {
+        for (var i = 0; i < param.length; i++) {
+            this.formatKeys(param[i]);
+        }
+    }
+
+    //========================== End of formatResponseForKey() Method============================================
+    /* Formats for responsekeys of each object */
+    formatKeys(parameterDefinitionObject: any) {
+        if (null == parameterDefinitionObject || undefined === parameterDefinitionObject)
+            return;
+        if (null == parameterDefinitionObject['response-keys'])
+            parameterDefinitionObject['response-keys'] = [{}];
+        for (var j = 0; j < 5; j++) {
+            var keysObj = {
+                'key-name': null,
+                'key-value': null
+            };
+            if (undefined == parameterDefinitionObject['response-keys'][j] || null == parameterDefinitionObject['response-keys'][j]) {
+                parameterDefinitionObject['response-keys'].push(keysObj);
+            }
+            if (undefined == parameterDefinitionObject['response-keys'][j]['key-name']) {
+                parameterDefinitionObject['response-keys'][j]['key-name'] = null;
+            }
+            if (undefined == parameterDefinitionObject['response-keys'][j]['key-value']) {
+                parameterDefinitionObject['response-keys'][j]['key-value'] = null;
+            }
+        }
+        if (null == parameterDefinitionObject['request-keys'])
+            parameterDefinitionObject['request-keys'] = [{}];
+        for (var k = 0; k < 3; k++) {
+            var keysObj = {
+                'key-name': null,
+                'key-value': null
+            };
+            if (undefined == parameterDefinitionObject['request-keys'][k] || null == parameterDefinitionObject['request-keys'][k]) {
+                parameterDefinitionObject['request-keys'].push(keysObj);
+            }
+            if (undefined == parameterDefinitionObject['request-keys'][k]['key-name']) {
+                parameterDefinitionObject['request-keys'][k]['key-name'] = null;
+            }
+            if (undefined == parameterDefinitionObject['request-keys'][k]['key-value']) {
+                parameterDefinitionObject['request-keys'][k]['key-value'] = null;
+            }
+        }
+    }
+
+    //========================== End of formatKeys() Method============================================
+    //Send null if there are no keys present - Check with key names being absent
+    formatKeysForFileGeneration() {
+        for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+            if (this.modelParamDefinitionObjects[i]['response-keys'][0]['key-name'] == null && this.modelParamDefinitionObjects[i]['response-keys'][1]['key-name'] == null && this.modelParamDefinitionObjects[i]['response-keys'][2]['key-name'] == null)
+                this.modelParamDefinitionObjects[i]['response-keys'] = null;
+            if (this.modelParamDefinitionObjects[i]['request-keys'][0]['key-name'] == null && this.modelParamDefinitionObjects[i]['request-keys'][1]['key-name'] == null && this.modelParamDefinitionObjects[i]['request-keys'][2]['key-name'] == null)
+                this.modelParamDefinitionObjects[i]['request-keys'] = null;
+        }
+    }
+
+    //========================== End of formatKeysForFileGeneration() Method============================================
+    /* Fn to restore response keys in desired format per backend consumption*/
+    processResponseKeys(saveModel: any[]) {
+        for (var i = 0; i < saveModel.length; i++) {
+            if (saveModel[i]['response-keys'] != null) {
+                saveModel[i]['response-keys-new'] = [{}];
+                saveModel[i]['response-keys-new'][0] = {};//An array of objects ?? so accessing first element
+                if (undefined != saveModel[i]['response-keys'][0]['key-name'] && undefined != saveModel[i]['response-keys'][0]['key-value']) {
+                    let keyName1 = saveModel[i]['response-keys'][0]['key-name'];
+                    saveModel[i]['response-keys-new'][0][keyName1] = saveModel[i]['response-keys'][0]['key-value'];
+                }
+                if (undefined != saveModel[i]['response-keys'][1]['key-name'] && undefined != saveModel[i]['response-keys'][1]['key-value']) {
+                    let keyName2 = saveModel[i]['response-keys'][1]['key-name'];
+                    saveModel[i]['response-keys-new'][0][keyName2] = saveModel[i]['response-keys'][1]['key-value'];
+                }
+                if (undefined != saveModel[i]['response-keys'][2]['key-name'] && undefined != saveModel[i]['response-keys'][2]['key-value']) {
+                    let keyName3 = saveModel[i]['response-keys'][2]['key-name'];
+                    saveModel[i]['response-keys-new'][0][keyName3] = saveModel[i]['response-keys'][2]['key-value'];
+                }
+                if (saveModel[i]['response-keys'][3]['key-value'] != undefined && saveModel[i]['response-keys'][3]['key-value'] != null) {
+                    let keyName4 = saveModel[i]['response-keys'][3]['key-name'];
+                    saveModel[i]['response-keys-new'][0]['filter-by-key'] = saveModel[i]['response-keys'][3]['key-value'];
+                }
+                if (saveModel[i]['response-keys'][4]['key-value'] != undefined && saveModel[i]['response-keys'][4]['key-value'] != null) {
+                    let keyName4 = saveModel[i]['response-keys'][4]['key-name'];
+                    saveModel[i]['response-keys-new'][0]['filter-by-value'] = saveModel[i]['response-keys'][4]['key-value'];
+                }
+            }
+            else {
+                saveModel[i]['response-keys-new'] = null;
+            }
+            delete saveModel[i]['response-keys'];
+            saveModel[i]['response-keys'] = saveModel[i]['response-keys-new'];
+            delete saveModel[i]['response-keys-new'];
+        }
+        return saveModel;
+    }
+
+    //========================== End of processResponseKeys() Method============================================
+    /*Fn to format response keys for front end display */
+    formatFileContentForDisplay(fileModel: any[]) {
+        for (var i = 0; i < fileModel.length; i++) {
+            if (undefined != fileModel[i]['response-keys']) {
+                let testObj = fileModel[i]['response-keys'];
+                let keyNum = 0;
+                fileModel[i]['response-keys-new'] = [{}];
+                for (var prop in testObj[0]) {
+                    if (testObj[0].hasOwnProperty(prop)) {
+                        let key = prop;
+                        fileModel[i]['response-keys-new'][keyNum] = {};
+                        fileModel[i]['response-keys-new'][keyNum]['key-name'] = key;
+                        fileModel[i]['response-keys-new'][keyNum]['key-value'] = testObj[0][key];
+                    }
+                    keyNum++;
+                }
+                delete fileModel[i]['response-keys'];
+                fileModel[i]['response-keys'] = fileModel[i]['response-keys-new'];
+                delete fileModel[i]['response-keys=new'];
+            }
+        }
+        return fileModel;
+    }
+
+    //========================== End of openModal() Method============================================
+    getCorrectParameterDefinitionObject(paramName: string) {
+        var result = {
+            'obj': {},
+            'present': false
+        };
+        for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+            var paramObj = this.modelParamDefinitionObjects[i];
+            if (paramObj.name === paramName) {
+                result.obj = this.modelParamDefinitionObjects[i];
+                result.present = true;
+                return result;
+            }
+        }
+        var parameterDefinitionObject = {
+            'name': paramName,
+            'type': null,
+            'description': null,
+            'required': null,
+            'default': null,
+            'source': null,
+            'rule-type': null,
+            'response-keys': [{}],
+            'request-keys': [{}]
+        };
+        result.obj = parameterDefinitionObject;
+        result.present = false;
+        return result;
+    }
+
+    //========================== End of clearSessionStorageForParam() Method============================================
+    isValidateSourceAndResponseKeys(objs: any[]) {
+        let isValid = true;
+        if (undefined != objs || null != objs) {
+            for (var i = 0; i < objs.length; i++) {
+                if (objs[i].source == 'INSTAR' && (null == objs[i]['response-keys'] || undefined == objs[i]['response-keys'])) {
+                    isValid = false;
+                    return isValid;
+                }
+            }
+        }
+        return isValid;
+    }
+
+
+    public prepareFileName(): any {
+        let fileNameObject: any = this.mappingEditorService.latestAction;
+        this.appDataObject = this.mappingEditorService.appDataObject;
+        this.downloadDataObject = this.mappingEditorService.downloadDataObject;
+        return fileNameObject;
+    }
+
+    public destroy(displayParamObjects) {
+        this.displayParamObjects = displayParamObjects;
+        if (this.mappingEditorService.referenceNameObjects) {
+            this.saveChanges('send');
+            this.saveChanges('download');
+            this.mappingEditorService.changeNavAppData(this.appDataObject);
+            this.mappingEditorService.changeNavDownloadData(this.downloadDataObject);
+        }
+    }
+
+    //========================== End of fileChangeEvent() Method============================================
+    /* Saves pd file in YAML format */
+    public saveChanges(downLoadOrSend: String) {
+        if (undefined != this.displayParamObjects && null != this.displayParamObjects && this.displayParamObjects.length > 0) {
+            this.paramShareService.setSessionParamData(this.displayParamObjects);
+
+            //Generate File Name per given rules - if not, return without saving
+            this.modelParamDefinitionObjects = this.displayParamObjects.slice(0);
+            this.paramShareService.setDisplayData(this.displayParamObjects);
+            this.formatKeysForFileGeneration();
+            //Added code to serialize, deserialize and then make changes needed to save response keys as needed in pd file
+            let jsonString = JSON.stringify(this.modelParamDefinitionObjects, null, '\t');
+            jsonString = jsonString.replace(/"null"/g, 'null');
+            let saveModel = JSON.parse(jsonString);
+            let pdFileObject = this.processResponseKeys(saveModel);
+            //Validate for Source =INSTAR and responsekeys present
+            if (this.isValidateSourceAndResponseKeys(pdFileObject)) {
+                let yamlObject = {
+                    'kind': 'Property Definition',
+                    'version': 'V1',
+                    'vnf-parameter-list': []
+                };
+                yamlObject['vnf-parameter-list'] = pdFileObject;
+                yamlObject = this.removeUnwantedvalues(yamlObject);
+                let yamlStringTemp = YAML.stringify(yamlObject, 6, 1);
+                var re = /\'/gi;
+                var newYamlStringTemp = yamlStringTemp.replace(re, '"');
+                var re2 = / -\n  +/gi;
+                var newYamlStringTemp2 = newYamlStringTemp.replace(re2, '- ');
+                let yamlString = '---\n' + newYamlStringTemp2;
+                if (downLoadOrSend === 'download') {
+                    var blob = new Blob([yamlString], {
+                        type: 'text/plain'
+                    });
+                    //let fileName = "pd_" + this.action + "_" + this.type + "_0.0.1V.yaml"
+                    this.downloadDataObject.pd.pdData = yamlString;
+                    this.downloadDataObject.pd.pdFileName = this.artifact_fileName;
+                }
+                else {
+                    this.sendPD(JSON.stringify(yamlString));
+                }
+            }
+            else {
+                for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+                    this.formatKeys(this.modelParamDefinitionObjects[i]);
+                }
+                this.nService.error('Error', 'Response Keys cannot be empty if source is INSTAR');
+                return;
+            }
+            //Restore Keys for display
+            for (var i = 0; i < this.modelParamDefinitionObjects.length; i++) {
+                this.formatKeys(this.modelParamDefinitionObjects[i]);
+            }
+        }
+
+    }
+
+
+    //This method will create parameter definitions as an array of objects from template name-value pairs and associative array for value from external key file if present
+    createOrUpdateParameterDefinitionData(usecase) {
+        this.parameterNameValues = JSON.parse(localStorage['paramsContent']);
+        this.parameterDefinitionMap = this.paramShareService.getData();
+        //Return if there are no name-value pairs or send some alert notification
+        if (undefined != this.modelParamDefinitionObjects && this.modelParamDefinitionObjects.length > 0 && usecase == 'create') {
+            //Do not recreate if object is already created
+            return;
+        }
+        else {
+        }
+        this.parameterDefinitionMap = this.paramShareService.getData();
+        //To Do:: Add Check for empty parameterDefinitionmap
+        var nameValueObj = {}, pName, pValue;
+        for (var key in this.parameterNameValues) {
+            if (this.parameterNameValues.hasOwnProperty(key)) {
+                pName = key;
+                pValue = this.parameterNameValues[key];
+            }
+
+            if (this.parameterDefinitionMap !== undefined)
+            //Check if parameter exists - if so, just update the keys, else create new object
+                var result = this.getCorrectParameterDefinitionObject(pName);
+            var parameterDefinitionObject = result.obj;
+            if (parameterDefinitionObject['source'] != 'A&AI' && (undefined !== this.parameterDefinitionMap) && (undefined !== this.parameterDefinitionMap[pValue.toUpperCase()])) {
+                var fields = this.parameterDefinitionMap[pValue.toUpperCase()].split('|');
+                //Starts with 2, first vallue is source, second is rule-type
+                let respInd = 0;
+                for (var i = 2; i < fields.length; i += 2) {
+                    parameterDefinitionObject['response-keys'][respInd] = {};
+                    parameterDefinitionObject['response-keys'][respInd]['key-name'] = fields[i];
+                    if ((i + 1) < fields.length) {
+                        parameterDefinitionObject['response-keys'][respInd]['key-value'] = fields[i + 1];
+                    }
+                    respInd++;
+                }
+                parameterDefinitionObject['source'] = fields[0];
+                parameterDefinitionObject['rule-type'] = fields[1];
+            } else {
+                if (parameterDefinitionObject['source'] === 'INSTAR') {
+                    parameterDefinitionObject['source'] = 'Manual';
+                    parameterDefinitionObject['ruleTypeValues'] = [null];
+                    parameterDefinitionObject['rule-type'] = null;
+                    parameterDefinitionObject['showFilterFields'] = false;
+                    for (let x = 0; x < 5; x++) {
+                        parameterDefinitionObject['response-keys'][x]['key-name'] = null;
+                        parameterDefinitionObject['response-keys'][x]['key-value'] = null;
+                    }
+                }
+            }
+            this.formatKeys(parameterDefinitionObject); //Ensure there are 3 elements for response-keys, request-keys for display purposes
+            if (!result.present) { //only push if not present
+                this.modelParamDefinitionObjects.push(parameterDefinitionObject);
+            }
+        }
+        for (var indx in this.modelParamDefinitionObjects) {
+            if (this.modelParamDefinitionObjects[indx] != undefined && (this.modelParamDefinitionObjects[indx].source == undefined || this.modelParamDefinitionObjects[indx].source == null || this.modelParamDefinitionObjects[indx].source == '')) {
+                this.modelParamDefinitionObjects[indx].source = 'Manual';
+            }
+        }
+        this.displayParamObjects = this.modelParamDefinitionObjects.slice(0);
+        this.paramShareService.setDisplayData(this.displayParamObjects);
+    }
+
+    public processKeyFile(fileName, result) {
+        this.myKeyFileName = fileName;
+        if (!this.myKeyFileName.endsWith('.txt')) {
+            this.nService.error('Error', 'Uploaded file is not a TXT file');
+        }
+        this.parameterDefinitionMap = {};
+        var rows = result.split(/\r\n|\r|\n/g);
+        for (var i = 1; i < rows.length; i++) { //Omit headings, so start from 1
+            let ind = rows[i].indexOf('|');
+            let key = rows[i].slice(0, ind);
+            let value = rows[i].slice(ind + 1);
+            this.parameterDefinitionMap[key.toUpperCase()] = value;
+        }
+        this.paramShareService.setData(this.parameterDefinitionMap);
+        //this.notificationService.notifySuccessMessage('External Key file successfully uploaded..');
+        let sessionVar = [{}];
+        sessionVar = this.paramShareService.getSessionParamData();
+        if (sessionVar !== undefined && sessionVar != null && sessionVar.length > 0) {
+            if (undefined == this.displayParamObjects)
+                this.displayParamObjects = this.modelParamDefinitionObjects = [];
+            this.displayParamObjects = sessionVar;
+            this.modelParamDefinitionObjects = this.displayParamObjects;
+            if (localStorage['paramsContent'] && (undefined !== this.displayParamObjects) && (this.displayParamObjects.length > 0)) {
+                this.createOrUpdateParameterDefinitionData('update');
+                //update the session variable with the updated data
+                this.paramShareService.setSessionParamData(this.displayParamObjects);
+            }
+        } else {
+            this.displayParamObjects = this.modelParamDefinitionObjects = [];
+        }
+        this.populateDataUponSource(this.displayParamObjects);
+        return this.displayParamObjects;
+    }
+
+    public processPDfile(fileName, result) {
+        this.myPdFileName = fileName;
+        if (!this.myPdFileName.endsWith('.yaml')) {
+            this.nService.error('Error', 'Uploaded file is not a YAML file');
+        }
+        var pdObject = YAML.parse(result);
+        let fileModel = pdObject['vnf-parameter-list'];
+        this.populatePD(fileModel);
+        return this.displayParamObjects;
+    }
+}
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.css b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.css
new file mode 100644
index 0000000..be35e44
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.css
@@ -0,0 +1,22 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html
new file mode 100644
index 0000000..ed0fbd3
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.html
@@ -0,0 +1,219 @@
+<!--
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+-->
+
+<simple-notifications [options]="options"></simple-notifications>
+<ng-progress [positionUsing]="'marginLeft'" [minimum]="0.15" [maximum]="1" [speed]="200" [showSpinner]="false" [direction]="'leftToRightIncreased'" [color]="'#6ab344'"
+    [trickleSpeed]="250" [thick]="true" [ease]="'linear'"></ng-progress>
+<div class="card" style="    margin-bottom: 23px;">
+    <img class="card-img-top" data-src="holder.js/100%x180/" alt="">
+    <div class="card-block" style="border-top: 5px solid #6ab344;border-top-right-radius: 7px;border-top-left-radius: 7px;">
+        <div class="row" style="padding: 15px 25px">
+            <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+                <label>Action</label>
+                <input class="form-control" type="text" disabled value="{{action}}" />
+            </div>
+            <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+                <label>Vnf Type</label><input class="form-control" type="text" disabled value="{{vnfType}}" />
+            </div>
+            <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+                <label>Vnfc Type</label><input class="form-control" type="text" disabled value="{{vnfcType}}" />
+            </div>
+            <div class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+                <label>Protocol</label><input class="form-control" type="text" disabled value="{{protocol}}" />
+            </div>
+            <div *ngIf="(action === 'ConfigScaleOut')" class="col-lg-3 col-sm-6 col-md-3 col-xs-12">
+                <label>templateIdentifier</label><input class="form-control" type="text" disabled value="{{identifier}}" />
+            </div>
+        </div>
+    </div>
+</div>
+<div class="row create-wrapper">
+    <div class="col-md-12">
+        <div class="row" style="padding: 5px 5px">
+            <div class="col-12 mb-3">
+                <div class="input-group">
+                    <input id="inputFile1" class="file" hidden #myInput1 type='file' (change)="fileChange(myInput1, 'pdfile')">
+                    <input [(ngModel)]="myPdFileName" type="text" class="input-lg" disabled placeholder="Upload parameters from PC" style="width:85%;">
+                    <button [disabled]="(undefined == mappingEditorService.latestAction)" (click)="browsePdFile($event)" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+                        type="button"> UPLOAD PD FILE
+                    </button>
+                </div>
+            </div>
+            <div class="col-12">
+                <div class="input-group">
+                    <input id="inputFile2" class="file" hidden #myInput2 type='file' (change)="fileChange(myInput2, 'keyfile')">
+                    <input [(ngModel)]="myKeyFileName" type="text" class="input-lg" disabled placeholder="Upload key file from PC. You can upload a key file only if you have some parameters."
+                        style="width:85%;">
+                    <button [disabled]="(!(undefined !== displayParamObjects && displayParamObjects.length>0))" (click)="browseKeyFile($event)" class="browse mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary input-lg"
+                        type="button">UPLOAD KEY FILE
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <br>
+    <hr>
+    <!--h4>testing{{initialData}}</h4-->
+    <div *ngIf="((undefined !== displayParamObjects && displayParamObjects.length>0)   ) " class="col-md-12 ">
+        <form *ngIf="undefined !== displayParamObjects" class="form-inline" novalidate #paramForm="ngForm" (ngSubmit)="saveChanges('download', paramForm.valid)">
+
+            <div style="height: 210px; overflow: auto;">
+                <table class="mdl-data-table mdl-js-data-table mdl-data-table--selectable mdl-shadow--2dp">
+                    <thead>
+                        <tr>
+                            <th class="mdl-data-table__cell--non-numeric">NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">DESCRIPTION</th>
+                            <th class="mdl-data-table__cell--non-numeric">TYPE</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQUIRED</th>
+                            <th class="mdl-data-table__cell--non-numeric">DEFAULT</th>
+                            <th class="mdl-data-table__cell--non-numeric">SOURCE</th>
+                            <th class="mdl-data-table__cell--non-numeric">RULETYPE</th>
+                            <th class="mdl-data-table__cell--non-numeric">FILTER BY FIELD</th>
+                            <th class="mdl-data-table__cell--non-numeric">FILTER BY VALUE</th>
+                            <th class="mdl-data-table__cell--non-numeric">RESPKEY NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">RESPKEY VALUE</th>
+                            <th class="mdl-data-table__cell--non-numeric">RESPKEY NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">RESPKEY VALUE</th>
+                            <th class="mdl-data-table__cell--non-numeric">RESPKEY NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">RESPKEY VALUE</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQKEY NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQKEY VALUE</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQKEY NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQKEY VALUE</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQKEY NAME</th>
+                            <th class="mdl-data-table__cell--non-numeric">REQKEY VALUE</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr *ngFor="let obj of displayParamObjects; let i = index">
+                            <td class="mdl-data-table__cell--non-numeric">
+                                <input required id="id1" [(ngModel)]="obj.name" #objName="ngModel" name="objName{{i}}" style="width:300px">
+                                <span class="error-message" [hidden]="objName.valid || (objName.pristine && !paramForm.submitted)">Required Field</span>
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric"><input [(ngModel)]="obj.description" #objDesc="ngModel" name="objDesc{{i}}">
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">
+                                <select id="id3" [(ngModel)]="obj.type" name="{{'objType'+i}}">
+                                <option *ngFor="let typ of typeValues"
+                                        [value]="typ"
+                                        [selected]="obj.type === typ"
+                                >
+                                    {{typ}}
+                                </option>
+                            </select>
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">
+                                <select [(ngModel)]="obj.required" #objRequired="ngModel" name="{{'objRequired'+i}}">
+                                <option *ngFor="let req of requiredValues"
+                                        [value]="req"
+                                        [selected]="req === obj.required"
+                                >
+                                    {{req}}
+                                </option>
+                            </select>
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric"><input id="id1" [(ngModel)]="obj.default" #objDefault="ngModel" name="objDefault{{i}}"></td>
+                            <td class="mdl-data-table__cell--non-numeric">
+                                <select class="form-control" required id="id3" [(ngModel)]="obj.source" #objSource="ngModel" (ngModelChange)="sourceChanged($event,obj)" name="{{'objSource'+i}}">
+                                <option *ngFor="let src of sourceValues"
+                                        [value]="src"
+                                        [selected]="src === obj.source"
+                                        [disabled]="src === 'INSTAR'">
+                                    {{src}}
+                                </option>
+
+                            </select>
+                                <span class="error-message" [hidden]="objSource.valid || (objSource.pristine && !paramForm.submitted)">Required Field</span>
+                            </td>
+
+                            <td class="mdl-data-table__cell--non-numeric">
+                                <select (ngModelChange)="ruleTypeChanged($event,obj)" class="form-control" id="id4" [(ngModel)]="obj['rule-type']" #objRuleType="ngModel" name="objRuleType{{i}}"
+                                    list="ruleTypes">
+                                <option *ngFor="let rTyp of obj.ruleTypeValues;" [value]="rTyp"
+                                        [selected]="rTyp === obj.rule-type">
+                                    {{rTyp}}
+                                </option>
+                            </select>
+                            </td>
+
+                            <td>
+                                <select *ngIf="obj.showFilterFields" (ngModelChange)="filetrByFieldChanged($event,obj)" class="form-control" id="id4" [(ngModel)]="obj['response-keys'][3]['key-value']"
+                                    #objfilterByField="ngModel" name="filterByField{{i}}" list="ruleTypes">
+                                <option *ngFor="let fTyp of filterByFieldvalues;" [value]="fTyp"
+                                        [selected]="fTyp === obj['response-keys'][3]['key-value']">
+                                    {{fTyp}}
+                                </option>
+                            </select>
+                            </td>
+                            <td>
+                                <input *ngIf="obj.showFilterFields" [disabled]="!(obj.enableFilterByValue)" type="text" [value]="obj['response-keys'][4]['key-value']" class="form-control"
+                                    id="id4" [(ngModel)]="obj['response-keys'][4]['key-value']" #objfilterByValue="ngModel" name="objfilterByValue{{i}}" list="ruleTypes">
+                            </td>
+
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][0]['key-name']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][0]['key-value']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][1]['key-name']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][1]['key-value']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][2]['key-name']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['response-keys'][2]['key-value']}}
+
+                            </td>
+
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][0]['key-name']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][0]['key-value']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][1]['key-name']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][1]['key-value']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][2]['key-name']}}
+
+                            </td>
+                            <td class="mdl-data-table__cell--non-numeric">{{obj['request-keys'][2]['key-value']}}
+
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+                `
+            </div>
+
+        </form>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
new file mode 100644
index 0000000..2668f2b
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.spec.ts
@@ -0,0 +1,197 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+/* tslint:disable:no-unused-variable */
+import {async, ComponentFixture, TestBed, inject} from '@angular/core/testing';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {FormsModule} from '@angular/forms';
+import {NotificationService} from '../../../shared/services/notification.service';
+import {ParamShareService} from '../../../shared/services/paramShare.service';
+import {MappingEditorService} from '../../../shared/services/mapping-editor.service';
+import {ModalComponent} from '../../../shared/modal/modal.component';
+import {DialogService} from 'ng2-bootstrap-modal';
+import {ConfirmComponent} from '../../../shared/confirmModal/confirm.component';
+import {RouterTestingModule} from '@angular/router/testing';
+import {HttpUtilService} from '../../../shared/services/httpUtil/http-util.service';
+import {UtilityService} from '../../../shared/services/utilityService/utility.service';
+
+import {BuildDesignComponent} from '../build-artifacts.component';
+import {NotificationsService} from 'angular2-notifications';
+import {HomeComponent} from '../../../home/home/home.component';
+import {LogoutComponent} from '../../../shared/components/logout/logout.component';
+import {HelpComponent} from '../../../shared/components/help/help/help.component';
+import {AboutUsComponent} from '../../../about-us/aboutus.component';
+import {TestComponent} from '../../../test/test.component';
+import {ParameterComponent} from './parameter.component';
+import {HttpModule} from '@angular/http';
+import { NgProgress } from 'ngx-progressbar';
+
+
+
+describe('ParameterComponent', () => {
+    let component: ParameterComponent;
+    let fixture: ComponentFixture<ParameterComponent>;
+    const routes = [
+        {
+            path: 'home',
+            component: HomeComponent
+        }, {
+            path: 'vnfs',
+            loadChildren: './vnfs/vnfs.module#VnfsModule'
+        }, {
+            path: 'test',
+            component: TestComponent
+        },
+        {
+            path: 'help',
+            component: HelpComponent
+        }, {
+            path: 'aboutUs',
+            component: AboutUsComponent
+        }, {
+            path: 'logout',
+            component: LogoutComponent
+        }, {
+            path: '',
+            redirectTo: '/home',
+            pathMatch: 'full'
+        }
+    ];
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [ParameterComponent, HomeComponent, TestComponent, HelpComponent, AboutUsComponent, LogoutComponent],
+            schemas: [NO_ERRORS_SCHEMA],
+            imports: [HttpModule, FormsModule, RouterTestingModule.withRoutes(routes)],
+            providers: [UtilityService, NgProgress, BuildDesignComponent, ParamShareService, DialogService, NotificationService, HttpUtilService, MappingEditorService, NotificationsService]
+        })
+            .compileComponents();
+    }));
+
+    beforeEach(() => {
+        fixture = TestBed.createComponent(ParameterComponent);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it('should create', () => {
+        expect(component).toBeTruthy();
+    });
+
+
+     it('should retrieve PD from APPC...', () => {
+    expect(component.getPD());
+  });
+
+  it('should infer some information from reference object...', inject([MappingEditorService], (mappingEditorService: MappingEditorService) => {
+    mappingEditorService.latestAction = {"action":"Configure","action-level":"vnf","scope":{"vnf-type":"ticktack","vnfc-type":""},"template":"Y","vm":[],"device-protocol":"CHEF","user-name":"","port-number":"","artifact-list":[{"artifact-name":"template_Configure_ticktack_0.0.1V.json","artifact-type":"config_template"},{"artifact-name":"pd_Configure_ticktack_0.0.1V.yaml","artifact-type":"parameter_definitions"}],"scopeType":"vnf-type"};
+    expect(component.ngOnInit());
+    expect(component.vnfType).toEqual('ticktack');
+    expect(component.vnfcType).toEqual('');
+    expect(component.protocol).toEqual('CHEF');
+    expect(component.action).toEqual('Configure');
+    expect(component.artifact_fileName).toEqual('pd_Configure_ticktack_0.0.1V.yaml');
+  }));
+
+
+  it('should retrieve the PD from cache...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    mappingEditorService.latestAction = {"action":"Configure","action-level":"vnf","scope":{"vnf-type":"ticktack","vnfc-type":""},"template":"Y","vm":[],"device-protocol":"CHEF","user-name":"","port-number":"","artifact-list":[{"artifact-name":"template_Configure_ticktack_0.0.1V.json","artifact-type":"config_template"},{"artifact-name":"pd_Configure_ticktack_0.0.1V.yaml","artifact-type":"parameter_definitions"}],"scopeType":"vnf-type"};
+    paramShareService.setSessionParamData("TEST PD INFORMATION")
+    expect(component.ngAfterViewInit()).toEqual("TEST PD INFORMATION");
+  }));
+
+/*
+   it('should read file key file content...', () => {
+    let input = {"__zone_symbol__changefalse":[{"type":"eventTask","state":"running","source":"HTMLInputElement.addEventListener:change","zone":"angular","runCount":2}]};
+    expect(component.fileChange(input, 'keyfile'));
+  });
+
+let content = new Blob(["PARAMVALUE|SOURCE|RULETYPE|KEY1|VALUE1|KEY2|VALUE2|KEY3|VALUE3\nvalue1|INSTAR|interface_ip_address|UniqueKeyName1|addressfqdn123|UniqueKeyValue|m001ssc001p1n001v001|FieldKeyName|ipaddress_v4\nvalue2|INSTAR|interface_ip_address|UniqueKeyName2|addressfqdnAsgar1|UniqueKeyValue|m001ssc001p1n001v002|FieldKeyName|ipaddress_v4"]
+{includes:()});
+let file = new File(content, "test.txt");
+  it('should read file PD file content...', () => {
+   let input = {"__zone_symbol__changefalse":[{"type":"eventTask","state":"running","source":"HTMLInputElement.addEventListener:change","zone":"angular","runCount":2}]};
+    
+    expect(component.fileChange(input, 'pdfile'));
+  });
+  */
+
+  it('should set the ruletypes for source A&AI...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+    let data = "A&AI";
+    expect(component.sourceChanged(data, obj));
+    expect(obj.ruleTypeValues).toEqual([null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list']);
+  }));
+
+  it('should set the ruletypes for source Manual...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+    let data = "Manual";
+    expect(component.sourceChanged(data, obj));
+    expect(obj.ruleTypeValues).toEqual([null]);
+    expect(obj['rule-type']).toBeNull();
+  }));
+
+  it('should set the ruletypes for source INSTAR...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+    let data = "INSTAR";
+    expect(component.sourceChanged(data, obj));
+    expect(obj.ruleTypeValues).toEqual([null]);
+  }));
+
+  it('should set the ruletypes for ruletype null...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+    let data = null
+    expect(component.ruleTypeChanged(data, obj));
+    expect(obj['showFilterFields']).toBeFalsy();
+    expect(obj['rule-type']).toBeNull();
+  }));
+
+  it('should set the ruletypes for ruletype vm-name-list...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+    let data = 'vm-name-list';
+    let sourceObject = component.ruleTypeConfiguaration[data];
+
+    expect(component.ruleTypeChanged(data, obj));
+    expect(obj['showFilterFields']).toBeTruthy();
+    expect(obj['rule-type']).toBeNull();
+
+    for (let x = 0; x < sourceObject.length; x++) {
+        expect(obj['response-keys'][x]['key-name']).toEqual(sourceObject[x]['key-name']);
+        expect(obj['response-keys'][x]['key-value']).toEqual(sourceObject[x]['key-value']);
+    }
+  }));
+
+
+  it('should set the ruletypes for ruletype vnf-name...', inject([MappingEditorService, ParamShareService], (mappingEditorService: MappingEditorService, paramShareService:ParamShareService) => {
+    let obj = {"name":"name1","type":"ipv4-address","description":"xxx","required":"true","default":null,"source":"A&AI","rule-type":null,"request-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"response-keys":[{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null},{"key-name":null,"key-value":null}],"ruleTypeValues":[null]}
+    let data = "vnf-name";
+    expect(component.ruleTypeChanged(data, obj));
+    expect(obj['showFilterFields']).toBeFalsy();
+    expect(obj['response-keys'][3]['key-name']).toBeNull;
+    expect(obj['response-keys'][3]['key-value']).toBeNull;
+    expect(obj['response-keys'][4]['key-name']).toBeNull;
+    expect(obj['response-keys'][4]['key-value']).toBeNull;
+  }));
+
+
+
+});
diff --git a/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts
new file mode 100644
index 0000000..2732473
--- /dev/null
+++ b/src/app/vnfs/build-artifacts/parameter-definitions/parameter.component.ts
@@ -0,0 +1,430 @@
+/*
+============LICENSE_START==========================================
+===================================================================
+Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
+===================================================================
+
+Unless otherwise specified, all software contained herein is licensed
+under the Apache License, Version 2.0 (the License);
+you may not use this software except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+ECOMP is a trademark and service mark of AT&T Intellectual Property.
+============LICENSE_END============================================
+*/
+
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { saveAs } from 'file-saver';
+import { ParamShareService } from '../../../shared/services/paramShare.service';
+import { MappingEditorService } from '../../../shared/services/mapping-editor.service';
+import { ModalComponent } from '../../../shared/modal/modal.component';
+import { HttpUtilService } from '../../../shared/services/httpUtil/http-util.service';
+import { UtilityService } from '../../../shared/services/utilityService/utility.service';
+import { environment } from '../../../../environments/environment';
+import { NotificationsService } from 'angular2-notifications';
+import { ParameterDefinitionService } from './parameter-definition.service';
+import 'rxjs/add/operator/map';
+import { NgProgress } from 'ngx-progressbar';
+
+
+let YAML = require('yamljs');
+
+declare var $: any;
+
+@Component({
+    selector: 'parameter-form',
+    templateUrl: './parameter.component.html',
+    styleUrls: ['../reference-dataform/reference-dataform.component.css'],
+    providers: [ParameterDefinitionService]
+})
+export class ParameterComponent implements OnInit {
+    public paramForm: any;
+    public actionType: any;
+    public showFilterFields: boolean;
+    public filterByFieldvalues = [null, 'vm-number', 'vnfc-function-code'];
+    public ruleTypeConfiguaration = {
+        'vnf-name': [
+            {
+                'key-name': 'unique-key-name',
+                'key-value': 'parent-name'
+            },
+            {
+                'key-name': 'unique-key-value',
+                'key-value': 'vnf'
+            },
+            {
+                'key-name': 'field-key-name',
+                'key-value': 'vnf-name'
+            }
+        ],
+        'vm-name-list': [
+            {
+                'key-name': 'unique-key-name',
+                'key-value': 'parent-name'
+            },
+            {
+                'key-name': 'unique-key-value',
+                'key-value': 'vserver'
+            },
+            {
+                'key-name': 'field-key-name',
+                'key-value': 'vserver-name'
+            }
+        ],
+        'vnfc-name-list': [
+            {
+                'key-name': 'unique-key-name',
+                'key-value': 'parent-name'
+            },
+            {
+                'key-name': 'unique-key-value',
+                'key-value': 'vnfc'
+            },
+            {
+                'key-name': 'field-key-name',
+                'key-value': 'vnfc-name'
+            }
+        ],
+        'vnf-oam-ipv4-address': [
+            {
+                'key-name': 'unique-key-name',
+                'key-value': 'parent-name'
+            },
+            {
+                'key-name': 'unique-key-value',
+                'key-value': 'vnf'
+            },
+            {
+                'key-name': 'field-key-name',
+                'key-value': 'ipv4-oam-ipaddress'
+            }
+        ],
+        'vnfc-oam-ipv4-address-list': [
+            {
+                'key-name': 'unique-key-name',
+                'key-value': 'parent-name'
+            },
+            {
+                'key-name': 'unique-key-value',
+                'key-value': 'vnfc'
+            },
+            {
+                'key-name': 'field-key-name',
+                'key-value': 'ipaddress-v4-oam-vip'
+            }
+        ]
+    };
+    public requiredValues: boolean[] = [null, true, false];
+    public sourceValues = ['Manual', 'INSTAR', 'A&AI'];
+    public ruleTypeValues = [null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list'];
+    public typeValues = [null, 'ipv4-address', 'ipv6-address', 'ipv4-prefix', 'ipv6-prefix'];
+    public responseKeyNameValues = ['', 'unique-key-name', 'unique-key-value', 'field-key-name'];
+    public responseKeyValues = ['(none)', 'addressfqdn', 'ipaddress-v4', 'ipaddress-v6'];
+    public requestKeyNameValues = [''];
+    public requestKeyValues = ['', '(none)'];
+    public myKeyFileName = null;
+    public myPdFileName = null;
+    public disposable: any;
+    public confirmation: boolean;
+    public showConfirmation: boolean;
+    public test: boolean;
+    apiToken = localStorage['apiToken'];
+    userId = localStorage['userId'];
+    public initialData: any;
+    public intialData: any;
+    public initialAction: any;
+    public item: any = {};
+    public subscription: any;
+    public Actions = [
+        { action: 'ConfigBackup', value: 'ConfigBackup' },
+        { action: 'ConfigModify', value: 'ConfigModify' },
+        { action: 'ConfigRestore', value: 'ConfigRestore' },
+        { action: 'Configure', value: 'Configure' },
+        { action: 'GetRunningConfig', value: 'GetRunningConfig' },
+        { action: 'HealthCheck', value: 'HealthCheck' },
+        { action: 'StartApplication', value: 'StartApplication' },
+        { action: 'StopApplication', value: 'StopApplication' }
+    ];
+    public uploadTypes = [{
+        value: 'External Key File',
+        display: 'KeyFile'
+    },
+    {
+        value: 'Pd File',
+        display: 'Pd File'
+    }
+    ];
+
+    options = {
+        timeOut: 1000,
+        showProgressBar: true,
+        pauseOnHover: true,
+        clickToClose: true,
+        maxLength: 200
+    };
+    public vnfcTypeData: string = '';
+    public selectedUploadType: string;
+    @ViewChild(ModalComponent) modalComponent: ModalComponent;
+    public title: string;
+    public parameterDefinitionMap: { [index: string]: string; } = {};
+    public parameterNameValues = {};
+    public displayParamObjects;
+    public modelParamDefinitionObjects;
+    public vnfType: any;
+    vnfcType: any;
+    protocol: any;
+    public refNameObj = {};
+    public action;
+    public artifactName;
+    public appDataObject: any;
+    public downloadDataObject: any;
+    public artifact_fileName;
+    identifier: any;
+    private selectedActionReference: any;
+
+    //this.mappingeditorservice.referenceNameObjects = object;PLEASE USE THIS OBJECT TO GET TEMPALLDATA
+
+    constructor (private httpService: HttpUtilService,
+        private parameterDefinitionService: ParameterDefinitionService,
+        private paramShareService: ParamShareService,
+        private mappingEditorService: MappingEditorService,
+        private httpUtil: HttpUtilService,
+        private utilService: UtilityService,
+        private nService: NotificationsService,
+        private ngProgress: NgProgress) {
+    }
+
+    ngOnInit() {
+        this.selectedActionReference = this.parameterDefinitionService.prepareFileName();
+        if (this.selectedActionReference && this.selectedActionReference != undefined) {
+
+            this.vnfType = this.selectedActionReference.scope['vnf-type'];
+            this.vnfcType = this.selectedActionReference.scope['vnfc-type'];
+            this.protocol = this.selectedActionReference['device-protocol'];
+            this.action = this.selectedActionReference.action;
+
+            for (let i = 0; i < this.selectedActionReference['artifact-list'].length; i++) {
+                let artifactList = this.selectedActionReference['artifact-list'];
+                if (artifactList[i]['artifact-type'] === 'parameter_definitions') {
+                    this.artifact_fileName = artifactList[i]['artifact-name'];
+                }
+            }
+            this.parameterDefinitionService.setValues(this.vnfType, this.vnfcType, this.protocol, this.action, this.artifact_fileName);
+        }
+        else {
+            this.selectedActionReference = {
+                'action': '',
+                'scope': { 'vnf-type': '', 'vnfc-type': '' },
+                'vm': [],
+                'protocol': '',
+                'download-dg-reference': '',
+                'user-name': '',
+                'port-number': '',
+                'artifact-list': [],
+                'deviceTemplate': '',
+                'scopeType': ''
+            };
+        }
+
+        //let path = this.location.path
+        /* this.activeRoutes.url.subscribe(UrlSegment => {
+             this.actionType = UrlSegment[0].path
+         })
+         */
+        this.identifier = this.mappingEditorService.identifier;
+    }
+
+    ngAfterViewInit() {
+        if (this.mappingEditorService.latestAction) {
+            this.displayParamObjects = [];
+            this.modelParamDefinitionObjects = [];
+            if (this.paramShareService.getSessionParamData() != undefined && this.paramShareService.getSessionParamData().length > 0) {
+                this.displayParamObjects = this.paramShareService.getSessionParamData();
+            } else {
+                this.getPD();
+            }
+        } else {
+            this.nService.error('Error', 'Please enter Action and VNF type in Reference Data screen');
+        }
+        return this.displayParamObjects;
+    }
+
+
+    public getPD() {
+        let result: any;
+        let input = {
+            'input': {
+                'design-request': {
+                    'request-id': this.apiToken,
+                    'action': 'getArtifact',
+                    'payload': '{"userID": "' + this.userId + '", "vnf-type" : "' + this.vnfType + '", "artifact-type":"APPC-CONFIG", "artifact-name":"' + this.artifact_fileName + '"}'
+                }
+            }
+        };
+        let artifactContent: any;
+        this.ngProgress.start();
+        return this.httpService.post({
+            url: environment.getDesigns,
+            data: input
+        }).subscribe(data => {
+            if (this.utilService.checkResult(data)) {
+                let result: any = JSON.parse(data.output.data.block).artifactInfo[0];
+                var pdObject = YAML.parse(result['artifact-content']);
+                let fileModel = pdObject['vnf-parameter-list'];
+                this.displayParamObjects = this.parameterDefinitionService.populatePD(fileModel);
+            }
+            else {
+
+            }
+            this.ngProgress.done();
+        },
+
+            error => this.nService.error('Error', 'Error in connecting APPC Server'));
+
+    }
+
+    //========================== End of NGInit() Method============================================
+    selectedNavItem(item: any) {
+        this.item = item;
+    }
+
+    //========================== End of selectedNavItem() Method============================================
+    browsePdFile() {
+        $('#inputFile1').trigger('click');
+    }
+
+    //========================== End of browsePdFile() Method============================================
+    browseKeyFile() {
+        $('#inputFile2').trigger('click');
+
+    }
+
+    //========================== End of browseKeyFile() Method============================================
+
+
+    //========================== End of appendSlashes() Method============================================
+
+
+    //========================== End of prepareFileName() Method============================================
+    ngOnDestroy() {
+        this.parameterDefinitionService.destroy(this.displayParamObjects);
+    }
+
+    //========================== End of ngOnDestroy() Method============================================
+
+    //========================== End of createOrUpdateParameterDefinitionData() Method============================================
+    public showUpload() {
+        this.selectedUploadType = this.uploadTypes[0].value;
+    };
+
+    //========================== End of showUpload() Method============================================
+    //This is called when the user selects new files from the upload button
+    public fileChange(input, uploadType) {
+        if (input.files && input.files[0]) {
+            // Create the file reader
+            let reader = new FileReader();
+            this.readFile(input.files[0], reader, (result) => {
+                if ('keyfile' === uploadType) {
+                    this.myKeyFileName = input.files[0].name;
+                    this.displayParamObjects = this.parameterDefinitionService.processKeyFile(this.myKeyFileName, result);
+                }
+                if ('pdfile' === uploadType) {
+                    this.myPdFileName = input.files[0].name;
+                    this.displayParamObjects = this.parameterDefinitionService.processPDfile(this.myPdFileName, result);
+                }
+            });
+        } else {
+            //this.notificationService.notifyErrorMessage('Failed to read file!Please try again.');
+        }
+    }
+
+    //========================== End of fileChange() Method============================================
+    public readFile(file, reader, callback) {
+        // Set a callback funtion to fire after the file is fully loaded
+        reader.onload = () => {
+            // callback with the results
+            callback(reader.result);
+        };
+        //this.notificationService.notifySuccessMessage('Uploading File ' + file.name + ':' + file.type + ':' + file.size);
+        // Read the file
+        reader.readAsText(file, 'UTF-8');
+    }
+
+    //========================== End of readFile() Method============================================
+    fileChangeEvent(fileInput: any) {
+        let obj: any = fileInput.target.files;
+    }
+
+
+    sourceChanged(data, obj) {
+        if (data == 'A&AI') {
+            obj.ruleTypeValues = [null, 'vnf-name', 'vm-name-list', 'vnfc-name-list', 'vnf-oam-ipv4-address', 'vnfc-oam-ipv4-address-list'];
+            for (let x = 0; x < 5; x++) {
+                obj['response-keys'][x]['key-name'] = null;
+                obj['response-keys'][x]['key-value'] = null;
+            }
+        } else if (data == 'Manual') {
+            obj.ruleTypeValues = [null];
+            obj['rule-type'] = null;
+            obj.showFilterFields = false;
+            for (let x = 0; x < 5; x++) {
+                obj['response-keys'][x]['key-name'] = null;
+                obj['response-keys'][x]['key-value'] = null;
+            }
+        }
+        else {
+            obj.ruleTypeValues = [null];
+        }
+    }
+
+    //========================== End of sourceChanged() Method============================================
+    ruleTypeChanged(data, obj) {
+        if (data == null || data == undefined || data == 'null') {
+            obj.showFilterFields = false;
+            obj['rule-type'] = null;
+            for (let x = 0; x < 5; x++) {
+                obj['response-keys'][x]['key-name'] = null;
+                obj['response-keys'][x]['key-value'] = null;
+            }
+        } else {
+            let sourceObject = this.ruleTypeConfiguaration[data];
+            if (data == 'vm-name-list' || data == 'vnfc-name-list' || data == 'vnfc-oam-ipv4-address-list') {
+                this.showFilterFields = false;
+                obj.showFilterFields = true;
+                this.filetrByFieldChanged(obj['response-keys'][3]['key-value'], obj);
+            } else {
+                obj.showFilterFields = false;
+                obj['response-keys'][3]['key-name'] = null;
+                obj['response-keys'][3]['key-value'] = null;
+                obj['response-keys'][4]['key-name'] = null;
+                obj['response-keys'][4]['key-value'] = null;
+            }
+            for (let x = 0; x < sourceObject.length; x++) {
+                obj['response-keys'][x]['key-name'] = sourceObject[x]['key-name'];
+                obj['response-keys'][x]['key-value'] = sourceObject[x]['key-value'];
+            }
+        }
+
+    }
+
+    //========================== End of ruleTypeChanged() Method============================================
+    filetrByFieldChanged(data, obj) {
+        if (data == null || data == undefined || data == 'null') {
+            obj.enableFilterByValue = false;
+            obj['response-keys'][4]['key-value'] = null;
+        } else {
+            obj.enableFilterByValue = true;
+        }
+
+    }
+
+
+}
\ No newline at end of file