UI Feature flagging support

Change-Id: Ic2151dab6306c42364483e9064c01bab3dd7378b
Issue-ID: VID-208
Signed-off-by: Sonsino, Ofir (os0695) <os0695@intl.att.com>

43 files changed, 3202 insertions, 2258 deletions

diff --git a/vid-app-common/src/main/webapp/WEB-INF/conf/dev.features.properties b/vid-app-common/src/main/webapp/WEB-INF/conf/dev.features.properties
new file mode 100644
index 00000000..8ff0db2a
--- /dev/null
+++ b/vid-app-common/src/main/webapp/WEB-INF/conf/dev.features.properties
@@ -0,0 +1,14 @@
+FLAG_ASYNC_INSTANTIATION = true
+FLAG_ASYNC_JOBS = true
+FLAG_REGION_ID_FROM_REMOTE = true
+CREATE_INSTANCE_TEST = false
+EMPTY_DRAWING_BOARD_TEST = false
+FLAG_ADVANCED_PORTS_FILTER = true
+FLAG_ADD_MSO_TESTAPI_FIELD = true
+FLAG_UNASSIGN_SERVICE = true
+FLAG_COLLECTION_RESOURCE_SUPPORT = true
+FLAG_NETWORK_TO_ASYNC_INSTANTIATION = true
+FLAG_SERVICE_MODEL_CACHE = true
+FLAG_SHOW_ASSIGNMENTS = true
+FLAG_SHOW_VERIFY_SERVICE=false
+FLAG_SETTING_DEFAULTS_IN_DRAWING_BOARD = false
diff --git a/vid-app-common/src/main/webapp/WEB-INF/conf/features.properties b/vid-app-common/src/main/webapp/WEB-INF/conf/features.properties
new file mode 100644
index 00000000..de466bea
--- /dev/null
+++ b/vid-app-common/src/main/webapp/WEB-INF/conf/features.properties
@@ -0,0 +1,11 @@
+#    features.properties
+#    -------------------
+
+#    This file is, generally, empty.
+
+#    Configure `featureFlags.filename` in system.properties to use
+#    one of the ready-made sets:
+
+#    -  featureFlags.filename = ci.features.properties
+#    -  featureFlags.filename = ist.features.properties
+#    -  featureFlags.filename = e2e.features.properties
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js b/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
index b08b2b16..e3edf830 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/constants/componentConstants.js
@@ -29,6 +29,7 @@ appDS2
 	CLOUD_REGION_ID : "cloudRegionID",
     COMPONENT_STATUS : "ComponentStatus",
     CREATE_COMPONENT : "createComponent",
+	IFRAME_DIALOG : "iframeDialog",
     DELETE_RESUME_COMPONENT : "deleteResumeComponent",
     DELETE:"Delete",
     RESUME:"Resume",
@@ -46,6 +47,7 @@ appDS2
 	MODEL_VERSION_1 : "1",
 	MSO_CREATE_REQ : "createInstance",
 	MSO_DELETE_REQ : "deleteInstance",
+	MSO_DELETE_CONFIGURATION_REQ : 'deleteConfiguration',
 	MSO_CHANGE_CONFIG_STATUS_REQ: "changeConfigurationStatus",
 	MSO_CHANGE_PORT_STATUS_REQ: "changePortStatus",
 	MSO_CREATE_ENVIRONMENT: "createEnvironmentInstance",
@@ -81,7 +83,6 @@ appDS2
 	VNF_TYPE : "vnfType",
 	VOLUME_GROUP : "volumeGroup",
     IS_PERMITTED: "is-permitted",
-    RESUME_STATUS: "PendingActivation",
     PNF : "pnf",
         // IDs
 	CIDR_MASK_1 : "255.255.255.000",
@@ -123,6 +124,8 @@ appDS2
 	AAI_GET_TENANTS : "aai_get_tenants/",
 	AAI_SUB_DETAILS_PATH : "aai_sub_details/",
     AAI_GET_VERSION_BY_INVARIANT_ID:"aai_get_version_by_invariant_id/",
+    AAI_GET_PORT_MIRRORING_CONFIGS_DATA : "aai_getPortMirroringConfigsData",
+    AAI_GET_PORT_MIRRORING_SOURCE_PORTS : "aai_getPortMirroringSourcePorts",
     SEARCH_SERVICE_INSTANCES:"search_service_instances",
     AAI_GET_VNF_DATA_PATH: "aai_get_vnf_data/",
     AAI_GET_VNF_BY_CUSTOMERID_AND_SERVICETYPE: "get_vnf_data_by_globalid_and_service_type/",
@@ -130,6 +133,7 @@ appDS2
     AAI_SUB_VIEWEDIT_PATH : "aai_sub_viewedit",
 	AAI_GET_VNF_INFO : "aai_get_vnf_information",
 	AAI_GET_PNF_INSTANCE: "aai_get_service_instance_pnfs",
+	AAI_GET_CR_INSTANCE: "aai_get_network_collection_details",
 	AAI_GET_VNF_INSTANCES_LIST: "aai_get_vnf_instances",
 	AAI_GET_PNF_INSTANCES_LIST: "aai_get_pnf_instances",
 	AAI_GET_BY_URI: "aai_get_by_uri/",
@@ -146,6 +150,7 @@ appDS2
 	WORKFLOW: "workflow",
 	GET_TIME_SLOTS:"get_time_slots",
 	SUBMIT_VNF_CHANGE_TIMESLOTS:"submit_vnf_change_timeslots",
+        AAI_GET_INSTANCE_GROUPS_BY_VNF_INSTANCE_ID_PATH: 'aai_get_instance_groups_by_vnf_instance_id',
 
 	FORWARD_SLASH : "/",
 	GET_SYSTEM_PROP_VNF_PROV_STATUS_PATH : "get_system_prop_vnf_prov_status",
@@ -174,14 +179,18 @@ appDS2
 	SERVICES_PATH : "rest/models/services/",
 	SERVICETYPE_SUB_PATH : "&serviceType=",
 	SERVICEINSTANCEID_SUB_PATH : "&serviceInstanceId=",
+	MODELVERSIONID_SUB_PATH : "&aaiModelVersionId=",
 	SERVICEMODELS_INSTANCES_SERVICES_PATH : "serviceModels.htm#/instances/services",
 	SERVICEMODELS_MODELS_SERVICES_PATH : "serviceModels.htm#/models/services",
 	SUBDETAILS_SELECTEDSUBSCRIBER : "#subdetails?selectedSubscriber=",
 	SUBSCRIBERNAME_SUB_PATH : "&subscriberName=",
 	WELCOME_PATH : "welcome.htm",
     IS_PERMITTED_SUB_PATH: "&isPermitted=",
+	SERVICE_POPUP_IFRAME_URL: "app/ui/#/servicePopup?serviceModelId=",
+	SUB_INTERFACE_POPUP_IFRAME_URL: "app/ui/#/vlan?",
+    VERIFY_SERVICE_URL: "rest/models/services/verifyService",
 
-    //Test Environment Urls:
+        //Test Environment Urls:
 	OPERATIONAL_ENVIRONMENT_CREATE : "operationalEnvironment/create",
 	OPERATIONAL_ENVIRONMENT_DEACTIVATE : "operationalEnvironment/deactivate?operationalEnvironment=",
 	OPERATIONAL_ENVIRONMENT_ACTIVATE : "operationalEnvironment/activate?operationalEnvironment=",
@@ -196,7 +205,7 @@ appDS2
 	INSTANTIATE_URL : "app/vid/scripts/view-models/instantiate.htm",
 	SERVICE_MODELS : "app/vid/scripts/view-models/serviceModels.htm",
 
-
+    ACTIVATE_SERVICE_STATUSES: ['created', 'pendingdelete', 'pending-delete', 'assigned'],
 
 	FULL_NAME_MAP : {
 	    "model-invariant-id" : "Model ID",
@@ -223,7 +232,18 @@ appDS2
 		update: "update",
 		replace: "replace",
 		vnfScaleOut: "VNF Scale Out"
-	}
+	},
+
+	FEATURE_FLAGS:{
+    	FLAG_ASYNC_INSTANTIATION : "FLAG_ASYNC_INSTANTIATION",
+		FLAG_VLAN_TAGGING_VIEW_EDIT: "FLAG_VLAN_TAGGING_VIEW_EDIT",
+		FLAG_NETWORK_TO_ASYNC_INSTANTIATION : "FLAG_NETWORK_TO_ASYNC_INSTANTIATION",
+        FLAG_REGION_ID_FROM_REMOTE : "FLAG_REGION_ID_FROM_REMOTE",
+        FLAG_ADD_MSO_TESTAPI_FIELD : "FLAG_ADD_MSO_TESTAPI_FIELD",
+        FLAG_COLLECTION_RESOURCE_SUPPORT : "FLAG_COLLECTION_RESOURCE_SUPPORT",
+        FLAG_SHOW_ASSIGNMENTS: "FLAG_SHOW_ASSIGNMENTS",
+        FLAG_SHOW_VERIFY_SERVICE: "FLAG_SHOW_VERIFY_SERVICE"
+    }
 
     };
-})())
+})());
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/constants/fieldConstants.js b/vid-app-common/src/main/webapp/app/vid/scripts/constants/fieldConstants.js
index fc051d02..544a8114 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/constants/fieldConstants.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/constants/fieldConstants.js
@@ -119,6 +119,8 @@ appDS2.factory("FIELD", ["PARAMETER", function (PARAMETER) {
         VF_MODULES: "vfModules",

         VF_MODULE_ID: "vf-module-id",

         VF_MODULE_NAME: "vf-module-name",

+        VF_MODULE_MODEL_CUSTOMIZATION_ID: "vf-module-model-customization-id",

+        VF_MODULE_MODEL_VERSION_ID: "vf-module-model-version-id",

         VID: "VID",

         VNF_ID: "vnf-id",

         VNF_NAME: "vnf-name",

@@ -140,10 +142,9 @@ appDS2.factory("FIELD", ["PARAMETER", function (PARAMETER) {
         CONFIGURATION_NAME: "configuration-name",

         CONFIGURATION_TYPE: "configuration-type",

         CONFIGURATION_ID: "configuration-id",

-        PORT: "l-interface",

-        PORT_ID: "interface-id",

-        PORT_NAME: "interface-name",

-        PORT_MIRRORED: "is-port-mirrored"

+        PORT_ID: "interfaceId",

+        PORT_NAME: "interfaceName",

+        PORT_MIRRORED: "isPortMirrored"

     };

 

     var KEY = {

@@ -270,6 +271,7 @@ appDS2.factory("FIELD", ["PARAMETER", function (PARAMETER) {
         AAI_ACTIVE: "Active",

         AAI_INACTIVE: "Inactive",

         AAI_CREATED: "Created",

+        AAI_DELETE: "Deleted",

         AAI_ENABLED: "Enabled",

         AAI_DISABLED: "Disabled"

     };

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js b/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js
index 84cb5ad7..f71213bf 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/constants/vidConfiguration.js
@@ -85,11 +85,11 @@ appDS2.constant("VIDCONFIGURATION", (function() {
 	/*

 	 * Max number of times that VID will poll MSO for a given request status

 	 */

-	var MSO_MAX_POLLS = 10;

+	var MSO_MAX_POLLS = 1440;

 	/*

 	 * Number of msecs that VID will wait between MSO polls.

 	 */

-	var MSO_POLLING_INTERVAL_MSECS = 10000;

+	var MSO_POLLING_INTERVAL_MSECS = 200;

 	

 	var SCHEDULER_POLLING_INTERVAL_MSECS = 10000;

 	

@@ -109,6 +109,8 @@ appDS2.constant("VIDCONFIGURATION", (function() {
 

 	var SCALE_OUT_CONTROLLERS = ["", "SDNC", "APPC"];

 	

+	var SDNC_SHOW_ASSIGNMENTS_URL = "https://sdnc.api.simpledemo.onap.org:8448/configAdapter/index#/resource_manager/<SERVICE_INSTANCE_ID>";

+	

     return {

     	ASDC_MODEL_STATUS : ASDC_MODEL_STATUS,

     	MSO_MAX_POLLS : MSO_MAX_POLLS,

@@ -122,6 +124,7 @@ appDS2.constant("VIDCONFIGURATION", (function() {
     	COMPONENT_LIST_NAMED_QUERY_ID : COMPONENT_LIST_NAMED_QUERY_ID,

         SCHEDULER_CALLBACK_URL: SCHEDULER_CALLBACK_URL,

         SCHEDULER_PORTAL_URL: SCHEDULER_PORTAL_URL,

+	        SDNC_SHOW_ASSIGNMENTS_URL: SDNC_SHOW_ASSIGNMENTS_URL,

 		SCALE_OUT_CONTROLLERS: SCALE_OUT_CONTROLLERS

     };

 })())

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/InstantiationController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/InstantiationController.js
index f1dc384c..1b3ab09c 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/InstantiationController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/InstantiationController.js
@@ -23,35 +23,38 @@
  * deployable objects (Services, VNFs, VF-Modules, Networks, and Volume-Groups)

  */

 (function () {

-	"use strict";

+    "use strict";

 

-	appDS2.requires.push('ui.tree');

+    appDS2.requires.push('ui.tree');

 

-	appDS2.controller("InstantiationController", function ($scope, $route, $location, $timeout, COMPONENT, VIDCONFIGURATION, FIELD, DataService, PropertyService, UtilityService, VnfService, $http, vidService, AaiService,PnfService, $q) {

-

-		$scope.popup = new Object();

-		$scope.defaultBaseUrl = "";

-		$scope.responseTimeoutMsec = 60000;

-		$scope.properties = UtilityService.getProperties();

+    appDS2.controller("InstantiationController", function ($scope, $route, $location, $timeout, COMPONENT, VIDCONFIGURATION, FIELD, DataService, PropertyService, UtilityService, VnfService, $http, vidService, AaiService, PnfService, CrService, AsdcService, $q, featureFlags, _, CreationService, $window) {

+        $scope.popup = new Object();

+        $scope.defaultBaseUrl = "";

+        $scope.responseTimeoutMsec = 60000;

+        $scope.properties = UtilityService.getProperties();

         $scope.resumeStatus = COMPONENT.RESUME_STATUS;

         //isPermitted - returned as string from url and converted into boolean

-		$scope.isPermitted = $location.search().isPermitted == "true";

-		$scope.STATUS_CONSTANTS = FIELD.STATUS;

+        $scope.isPermitted = $location.search().isPermitted == "true";

+        $scope.STATUS_CONSTANTS = FIELD.STATUS;

         $scope.pnfs = [];// PNF data init;

-

-        $scope.init = function() {

+        $scope.collectionResource = {};

+        $scope.collections = [];

+        $scope.networks = [];

+        $scope.isCR = false;

+        $scope.isVFC = false;

+        $scope.init = function () {

             /*

              * These 2 statements should be included in non-test code.

              */

-        	// takes a default value, retrieves the prop value from the file system and sets it

-    		var msecs = PropertyService.retrieveMsoMaxPollingIntervalMsec();

-    		PropertyService.setMsoMaxPollingIntervalMsec(msecs);

-    		

-    		// takes a default value, retrieves the prop value from the file system and sets it

-    		var polls = PropertyService.retrieveMsoMaxPolls();

-    		PropertyService.setMsoMaxPolls(polls);

-    		

-    		PropertyService.setServerResponseTimeoutMsec(30000);

+            // takes a default value, retrieves the prop value from the file system and sets it

+            var msecs = PropertyService.retrieveMsoMaxPollingIntervalMsec();

+            PropertyService.setMsoMaxPollingIntervalMsec(msecs);

+

+            // takes a default value, retrieves the prop value from the file system and sets it

+            var polls = PropertyService.retrieveMsoMaxPolls();

+            PropertyService.setMsoMaxPolls(polls);

+

+            PropertyService.setServerResponseTimeoutMsec(30000);

 

             /*

              * Common parameters that shows an example of how the view edit screen

@@ -72,226 +75,341 @@
 

         //PropertyService.setMsoBaseUrl("testmso");

 

-		$scope.convertModel = function(asdcModel) {

-			if (!asdcModel) return undefined;

-			var convertedAsdcModel = UtilityService.convertModel(asdcModel);

-			return convertedAsdcModel;

-		};

-		

-		$scope.service = {

-			"model": vidService.getModel(),

-			"convertedModel": $scope.convertModel(vidService.getModel()),

-			"instance": vidService.getInstance()

-		};

+        $scope.convertModel = function (asdcModel) {

+            if (!asdcModel) return undefined;

+            var convertedAsdcModel = UtilityService.convertModel(asdcModel);

+            return convertedAsdcModel;

+        };

+

+        $scope.prepareScopeWithModel = function () {

+            // skip if no model

+            if (!vidService.getModel()) return;

+

+            $scope.service = {

+                "model": vidService.getModel(),

+                "convertedModel": $scope.convertModel(vidService.getModel()),

+                "instance": vidService.getInstance()

+            };

 

-		preparePnfs();

 

+            $scope.isCR = !_.isEmpty($scope.service.model.collectionResource) && featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_COLLECTION_RESOURCE_SUPPORT);

+            if ($scope.isCR)

+                prepareCr();

+            else

+                preparePnfs();

+        };

 

-        function preparePnfs(){

-        	var serviceInstance = {

+        function preparePnfs() {

+            var serviceInstance = {

                 globalCustomerId: $location.search().subscriberId,

                 serviceType: $location.search().serviceType,

                 serviceInstanceId: $location.search().serviceInstanceId

-        	};

+            };

 

-            _setPnf(serviceInstance).then(function(data){

+            _setPnf(serviceInstance).then(function (data) {

                 $scope.pnfs = data;

             });

-		}

-

-

-		$scope.returnVfModules = function (vnfInstance) {

-			

-			var svcModel = $scope.service.convertedModel;

-			//var vnfModelInvariantUuid = vnfInstance[FIELD.ID.MODEL_INVAR_ID];

-			var vnfModelVersionId = vnfInstance[FIELD.ID.MODEL_VERSION_ID]; // model uuid

-			var vnfModelCustomizationUuid = vnfInstance[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-	

-			var vnfModel = null;

-			

-			if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-				if ( (svcModel.isNewFlow) && (vnfModelCustomizationUuid != null ) ) {

-					vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

-					if ( !($scope.isObjectEmpty(vnfModel.vfModules) ) )  {

-						//console.log ("vnfModel.vfModules: "); console.log (JSON.stringify(vnfModel.vfModules, null, 4));

-						return (vnfModel.vfModules);

-					}

-				}

-				else {

-					// old flow

-					if ( vnfModelVersionId != null ) {

-						vnfModel = svcModel.vnfs[vnfModelVersionId];

-						if ( !($scope.isObjectEmpty(vnfModel.vfModules) ) )  {

-							//console.log ("vnfModel.vfModules: "); console.log (JSON.stringify(vnfModel.vfModules, null, 4));

-							return (vnfModel.vfModules);

-						}

-					}

-				}

-				

-			}

-			return null;

-		}

-		$scope.hasVfModules = function (vnfInstance) {

-			if ($scope.returnVfModules(vnfInstance) != null ){

-				return true;

-			}

-			return false;

-		}

-		$scope.returnVolumeGroups = function (vnfInstance) {

-			

-			var svcModel = $scope.service.convertedModel;

-

-			//var vnfModelInvariantUuid = vnfInstance[FIELD.ID.MODEL_INVAR_ID];

-			var vnfModelVersionId = vnfInstance[FIELD.ID.MODEL_VERSION_ID];

-			var vnfModelCustomizationUuid = vnfInstance[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-

-			var vnfModel = null;

-			

-			if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-				if ( (svcModel.isNewFlow) && (vnfModelCustomizationUuid != null ) ) {

-					vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

-					if ( !($scope.isObjectEmpty(vnfModel.volumeGroups) ) )  {

-						//console.log ("vnfModel.volumeGroups: "); console.log (JSON.stringify(vnfModel.volumeGroups, null, 4));

-						return (vnfModel.volumeGroups);

-					}

-				}

-				else {

-					// old flow

-					if ( vnfModelVersionId != null ) {

-						vnfModel = svcModel.vnfs[vnfModelVersionId];

-						if ( !($scope.isObjectEmpty(vnfModel.volumeGroups) ) )  {

-							//console.log ("vnfModel.vfModules: "); console.log (JSON.stringify(vnfModel.volumeGroups, null, 4));

-							return (vnfModel.volumeGroups);

-						}

-					}

-				}

-				

-			}

-			return null;

-		}

-		$scope.hasVolumeGroups = function (vnfInstance) {

-			if ($scope.returnVolumeGroups(vnfInstance) != null ){

-				return true;

-			}

-			return false;

-		}

-		$scope.deleteNetwork = function(serviceObject, network) {

-

-			console.log("Removing Network " + network.name);

-

-			//Send delete network request to MSO

-

-			//var networks = this.service.instance.networks;

-

-			//networks.splice(networks.indexOf(network), 1);

-

-			//Retrieve updated data from A&AI

-            var serviceInstance = serviceObject.object;

+        }

+

+

+        function prepareCr() {

+            var serviceInstance = {

+                globalCustomerId: $location.search().subscriberId,

+                serviceType: $location.search().serviceType,

+                serviceInstanceId: $location.search().serviceInstanceId

+            };

+

+            _setCr(serviceInstance).then(function (data) {

+                $scope.collectionResource = data;

+                $scope.collections.push($scope.collectionResource.collection);

+                $scope.networks.push($scope.collectionResource.networks[0]);

+            });

+        }

+

+        $scope.returnVfModules = function (vnfInstance) {

+

+            var svcModel = $scope.service.convertedModel;

+            //var vnfModelInvariantUuid = vnfInstance[FIELD.ID.MODEL_INVAR_ID];

+            var vnfModelVersionId = vnfInstance[FIELD.ID.MODEL_VERSION_ID]; // model uuid

+            var vnfModelCustomizationUuid = vnfInstance[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            var vnfModel = null;

+

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

+                    vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+                    if (vnfModel !== undefined) {

+                        if (!($scope.isObjectEmpty(vnfModel.vfModules))) {

+                            //console.log ("vnfModel.vfModules: "); console.log (JSON.stringify(vnfModel.vfModules, null, 4));

+                            return (vnfModel.vfModules);

+                        }

+                    }

+                }

+                else {

+                    // old flow

+                    if (vnfModelVersionId != null) {

+                        vnfModel = svcModel.vnfs[vnfModelVersionId];

+                        if (vnfModel !== undefined) {

+                            if (!($scope.isObjectEmpty(vnfModel.vfModules))) {

+                                //console.log ("vnfModel.vfModules: "); console.log (JSON.stringify(vnfModel.vfModules, null, 4));

+                                return (vnfModel.vfModules);

+                            }

+                        }

+                    }

+                }

+

+            }

+            return null;

+        }

+        $scope.hasVfModules = function (vnfInstance) {

+            if ($scope.returnVfModules(vnfInstance) != null) {

+                return true;

+            }

+            return false;

+        }

+        $scope.returnVolumeGroups = function (vnfInstance) {

+

             var svcModel = $scope.service.convertedModel;

-			var netModel;

-			DataService.setInventoryItem(network.object);

-			// set model default and override later if found

-			DataService.setModelInfo(COMPONENT.NETWORK, {});

-			

-			if ( network.object != null ) {

-				

-				//var netModelInvariantUuid = network.object[FIELD.ID.MODEL_INVAR_ID];

-				var netModelVersionId = network.object[FIELD.ID.MODEL_VERSION_ID]; // model uuid

-				var netModelCustomizationUuid = network.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			

-				if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.networks) ) ) ) {

-					if ( (svcModel.isNewFlow) && (UtilityService.hasContents(netModelCustomizationUuid) ) ) {

-						netModel = svcModel.networks[netModelCustomizationUuid];

-					}

-					else {

-						

-						if ( UtilityService.hasContents(netModelVersionId) ) {

-							netModel = svcModel.networks[netModelVersionId];

-						}

-				

-					}

-				}

-			}

-			if (!($scope.isObjectEmpty(netModel) ) ) {

-				DataService.setModelInfo(COMPONENT.NETWORK, {

-					"modelInvariantId": netModel.invariantUuid,

-					"modelVersion": netModel.version,

-					"modelNameVersionId": netModel.uuid,

-					"modelCustomizationName": netModel.modelCustomizationName,

-					"customizationUuid": netModel.customizationUuid,

-					"modelName": netModel.name,

-					"inputs": ""

-				});

-			}

-			

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-	

-			DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			DataService.setServiceName($scope.service.model.service.name);

-			DataService.setServiceUuid($scope.service.model.service.uuid);

-			DataService.setNetworkInstanceId(network.object[FIELD.ID.NETWORK_ID]);

-			

-			$scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-			    componentId : COMPONENT.NETWORK,

-			    callbackFunction : deleteOrResumeCallback,

-				dialogMethod: COMPONENT.DELETE

-			});

-		};

-

-		$scope.deleteService = function(serviceObject) {

-

-			var serviceInstance = serviceObject.object;

-			

-			console.log("Removing Service " + $scope.service.instance.name);

-

-			if ( $scope.isMacro() ) {

-				DataService.setALaCarte (false);

-				}

-				else {

-				DataService.setALaCarte (true);

-				}

-			DataService.setMacro($scope.isMacro());

-			DataService.setInventoryItem(serviceInstance);

-			setCurrentServiceModelInfoFromScope();

-

-			

-			DataService.setSubscriberName(serviceObject[FIELD.ID.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-	

-			DataService.setGlobalCustomerId(serviceObject[COMPONENT.GLOBAL_CUSTOMER_ID]);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			

-			DataService.setServiceName($scope.service.model.service.name);

-			

-			DataService.setServiceUuid($scope.service.model.service.uuid);

-			

-			$scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-			    componentId : COMPONENT.SERVICE,

-			    callbackFunction : deleteServiceInstanceCallbackFunction,

+

+            //var vnfModelInvariantUuid = vnfInstance[FIELD.ID.MODEL_INVAR_ID];

+            var vnfModelVersionId = vnfInstance[FIELD.ID.MODEL_VERSION_ID];

+            var vnfModelCustomizationUuid = vnfInstance[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            var vnfModel = null;

+

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

+                    vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+                    if (vnfModel !== undefined) {

+

+                        if (!($scope.isObjectEmpty(vnfModel.volumeGroups))) {

+                            //console.log ("vnfModel.volumeGroups: "); console.log (JSON.stringify(vnfModel.volumeGroups, null, 4));

+                            return (vnfModel.volumeGroups);

+                        }

+                    }

+                }

+                else {

+                    // old flow

+                    if (vnfModelVersionId != null) {

+                        vnfModel = svcModel.vnfs[vnfModelVersionId];

+                        if (!($scope.isObjectEmpty(vnfModel.volumeGroups))) {

+                            //console.log ("vnfModel.vfModules: "); console.log (JSON.stringify(vnfModel.volumeGroups, null, 4));

+                            return (vnfModel.volumeGroups);

+                        }

+                    }

+                }

+

+            }

+            return null;

+        }

+        $scope.hasVolumeGroups = function (vnfInstance) {

+            if ($scope.returnVolumeGroups(vnfInstance) != null) {

+                return true;

+            }

+            return false;

+        }

+        $scope.deleteNetwork = function (serviceObject, network) {

+

+            console.log("Removing Network " + network.name);

+

+            //Send delete network request to MSO

+

+            //var networks = this.service.instance.networks;

+

+            //networks.splice(networks.indexOf(network), 1);

+

+            //Retrieve updated data from A&AI

+            var serviceInstance = serviceObject.object;

+

+            setCurrentNetworkModelInfoFromScope(network);

+

+            DataService.setInventoryItem(network.object);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+            DataService.setServiceName($scope.service.model.service.name);

+            DataService.setServiceUuid($scope.service.model.service.uuid);

+            DataService.setNetworkInstanceId(network.object[FIELD.ID.NETWORK_ID]);

+

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.NETWORK,

+                callbackFunction: deleteOrResumeCallback,

                 dialogMethod: COMPONENT.DELETE

-			});

-		

-		};

+            });

+        };

+

+        $scope.deleteService = function (serviceObject, serviceOrchestrationStatus) {

 

-		function populate_popup_vfModule(serviceObject, vfModule, vnf){

             var serviceInstance = serviceObject.object;

 

-            DataService.setInventoryItem(vfModule.object);

+            console.log("Removing Service " + $scope.service.instance.name);

 

-            var svcModel = $scope.service.convertedModel;

+            if ($scope.isMacro()) {

+                DataService.setALaCarte(false);

+            }

+            else {

+                DataService.setALaCarte(true);

+            }

+            DataService.setMacro($scope.isMacro());

+            DataService.setInventoryItem(serviceInstance);

+            setCurrentServiceModelInfoFromScope();

 

-            //var vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

-            var vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

-            var vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];;

+

+            DataService.setSubscriberName(serviceObject[FIELD.ID.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            DataService.setGlobalCustomerId(serviceObject[COMPONENT.GLOBAL_CUSTOMER_ID]);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+

+            DataService.setServiceName($scope.service.model.service.name);

+

+            DataService.setServiceUuid($scope.service.model.service.uuid);

+

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.SERVICE,

+                callbackFunction: deleteServiceInstanceCallbackFunction,

+                dialogMethod: COMPONENT.DELETE,

+                serviceStatus: serviceOrchestrationStatus

+            });

+

+        };

+

+        function populate_popup_vfModule(serviceObject, vfModule, vnf) {

+            var serviceInstance = serviceObject.object;

+

+            DataService.setInventoryItem(vfModule.object);

+

+            setCurrentVfModuleModelInfoFromScope(vnf, vfModule);

             var vfModuleInstanceID = vfModule.object[FIELD.ID.VF_MODULE_ID];

             if (vfModuleInstanceID == null) {

                 vfModuleInstanceID = "";

             }

 

+            DataService.setVnfInstanceId(vnf.object[FIELD.ID.VNF_ID]);

+            DataService.setVfModuleInstanceId(vfModuleInstanceID);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+

+            DataService.setServiceName($scope.service.model.service.name);

+

+            DataService.setServiceUuid($scope.service.model.service.uuid);

+        }

+

+        $scope.deleteVfModule = function (serviceObject, vfModule, vnf) {

+

+            console.log("Removing VF-Module " + vfModule.name);

+

+            populate_popup_vfModule(serviceObject, vfModule, vnf);

+

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.VF_MODULE,

+                callbackFunction: deleteOrResumeCallback,

+                dialogMethod: COMPONENT.DELETE

+            });

+

+            return;

+

+        };

+

+        function setCurrentServiceModelInfoFromScope() {

+            DataService.setModelInfo(COMPONENT.SERVICE, {

+                "modelInvariantId": $scope.service.model.service.invariantUuid,

+                "modelVersion": $scope.service.model.service.version,

+                "modelNameVersionId": $scope.service.model.service.uuid,

+                "modelName": $scope.service.model.service.name,

+                "inputs": ""

+            });

+        };

+

+        function setCurrentVNFModelInfo(vnf) {

+            var svcModel = $scope.service.convertedModel;

+            var vnfModel;

+            var vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+            var vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

+                    vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+                }

+                else {

+                    vnfModel = svcModel.vnfs[vnfModelVersionId];

+                }

+                if (!($scope.isObjectEmpty(vnfModel))) {

+

+                    DataService.setModelInfo(COMPONENT.VNF, {

+                        "modelInvariantId": vnfModel.invariantUuid,

+                        "modelVersion": vnfModel.version,

+                        "modelNameVersionId": vnfModel.uuid,

+                        "modelCustomizationName": vnfModel.modelCustomizationName,

+                        "customizationUuid": vnfModel.customizationUuid,

+                        "modelName": vnfModel.name,

+                        "inputs": ""

+                    });

+                }

+            }

+

+

+        }

+

+        function setCurrentNetworkModelInfoFromScope(network) {

+            var svcModel = $scope.service.convertedModel;

+            var netModel;

+            // set model default and override later if found

+            DataService.setModelInfo(COMPONENT.NETWORK, {});

+

+            if (network.object != null) {

+

+                //var netModelInvariantUuid = network.object[FIELD.ID.MODEL_INVAR_ID];

+                var netModelVersionId = network.object[FIELD.ID.MODEL_VERSION_ID]; // model uuid

+                var netModelCustomizationUuid = network.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+                if (UtilityService.hasContents(netModelCustomizationUuid)) {

+                    // set it to what came from a&ai

+                    DataService.setResCustomizationUuid(netModelCustomizationUuid);

+                }

+

+                if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.networks)))) {

+                    if ((svcModel.isNewFlow) && (UtilityService.hasContents(netModelCustomizationUuid))) {

+                        netModel = svcModel.networks[netModelCustomizationUuid];

+                    }

+                    else {

+

+                        if (UtilityService.hasContents(netModelVersionId)) {

+                            netModel = svcModel.networks[netModelVersionId];

+                        }

+

+                    }

+                }

+            }

+            if (!($scope.isObjectEmpty(netModel))) {

+                DataService.setModelInfo(COMPONENT.NETWORK, {

+                    "modelInvariantId": netModel.invariantUuid,

+                    "modelVersion": netModel.version,

+                    "modelNameVersionId": netModel.uuid,

+                    "modelCustomizationName": netModel.modelCustomizationName,

+                    "customizationUuid": netModel.customizationUuid,

+                    "modelName": netModel.name,

+                    "inputs": ""

+                });

+            }

+        }

+

+        function setCurrentVfModuleModelInfoFromScope(vnf, vfModule) {

+

+            var svcModel = $scope.service.convertedModel;

+

+            //var vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

+            var vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

+            var vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

             var vnfModel = null;

             var vfModuleModel = null;

 

@@ -305,12 +423,12 @@
                 "inputs": ""

             });

 

-            if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-                if ( (svcModel.isNewFlow) && (vnfModelCustomizationUuid != null ) ) {

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

                     vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

 

                     var vfModuleCustomizationUuid = vfModule.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-                    if ( !($scope.isObjectEmpty(vnfModel.vfModules) ) && UtilityService.hasContents(vfModuleCustomizationUuid) ) {

+                    if (!($scope.isObjectEmpty(vnfModel)) && !($scope.isObjectEmpty(vnfModel.vfModules)) && UtilityService.hasContents(vfModuleCustomizationUuid)) {

 

                         vfModuleModel = vnfModel.vfModules[vfModuleCustomizationUuid];

 

@@ -318,17 +436,17 @@
                 }

                 else {

                     // old flow

-                    if (vnfModelVersionId != null ) {

+                    if (vnfModelVersionId != null) {

                         vnfModel = svcModel.vnfs[vnfModelVersionId];

                     }

                     //var vfModuleInvariantUuid = vfModule.object[FIELD.ID.MODEL_INVAR_ID];

                     var vfModuleModelVersionId = vfModule.object[FIELD.ID.MODEL_VERSION_ID];

-                    if ( (!($scope.isObjectEmpty(vnfModel))) && (!($scope.isObjectEmpty(vnfModel.vfModules))) &&

-                        UtilityService.hasContents(vfModuleModelVersionId) ) {

+                    if ((!($scope.isObjectEmpty(vnfModel))) && (!($scope.isObjectEmpty(vnfModel.vfModules))) &&

+                        UtilityService.hasContents(vfModuleModelVersionId)) {

                         vfModuleModel = vnfModel.vfModules[vfModuleModelVersionId];

                     }

                 }

-                if ( !($scope.isObjectEmpty(vfModuleModel)) ) {

+                if (!($scope.isObjectEmpty(vfModuleModel))) {

                     DataService.setModelInfo(COMPONENT.VF_MODULE, {

                         "modelInvariantId": vfModuleModel.invariantUuid,

                         "modelVersion": vfModuleModel.version,

@@ -340,61 +458,172 @@
                     });

                 }

             }

+        }

 

-            DataService.setVnfInstanceId(vnf.object[FIELD.ID.VNF_ID]);

-            DataService.setVfModuleInstanceId(vfModuleInstanceID);

+        function setCurrentVolumeGroupModelInfoFromScope(vnf, vfModule) {

+            var svcModel = $scope.service.convertedModel;

 

-            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+            var vnfModelCustomizationUuid = null;

+            var vnfModel = null;

+            var vnfModelVersionId = null;

 

-            DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

-            DataService.setServiceInstanceName($scope.service.instance.name);

+            vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

+            vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

 

-            DataService.setServiceName($scope.service.model.service.name);

+            DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

+                "modelInvariantId": "",

+                "modelVersion": "",

+                "modelNameVersionId": "",

+                "modelCustomizationName": "",

+                "customizationUuid": "",

+                "modelName": "",

+                "inputs": ""

+            });

 

-            DataService.setServiceUuid($scope.service.model.service.uuid);

-		}

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

+                    vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+                }

+                else {

+                    vnfModel = svcModel.vnfs[vnfModelVersionId];

+                }

+            }

 

-		$scope.deleteVfModule = function(serviceObject, vfModule, vnf) {

 

-			console.log("Removing VF-Module " + vfModule.name);

+            // volume groups don't have model-invariant-id/version in a&ai.

+            // Their model-invariant-id/version is the one for the associated vfModule

 

-            populate_popup_vfModule(serviceObject, vfModule, vnf);

-			

-			$scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-			    componentId : COMPONENT.VF_MODULE,

-			    callbackFunction : deleteOrResumeCallback,

-                dialogMethod: COMPONENT.DELETE

-			});

-			

-			return;

+            var vfModuleModelVersionId = vfModule.object[FIELD.ID.MODEL_VERSION_ID];

+            var vfModuleCustomizationUuid = vfModule.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+            var volGroupModel = null;

+

+            if (!($scope.isObjectEmpty(vnfModel)) && !($scope.isObjectEmpty(vnfModel.volumeGroups))) {

+                if ((svcModel.isNewFlow) && (UtilityService.hasContents(vfModuleCustomizationUuid))) {

+                    volGroupModel = vnfModel.volumeGroups[vfModuleCustomizationUuid];

+                }

+                else {

+                    volGroupModel = vnfModel.volumeGroups[vfModuleModelVersionId];

+                }

+                if (!($scope.isObjectEmpty(volGroupModel))) {

+                    DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

+                        "modelInvariantId": volGroupModel.invariantUuid,

+                        "modelVersion": volGroupModel.version,

+                        "modelNameVersionId": volGroupModel.uuid,

+                        "modelCustomizationName": volGroupModel.modelCustomizationName,

+                        "customizationUuid": volGroupModel.customizationUuid,

+                        "modelName": volGroupModel.name,

+                        "inputs": ""

+                    });

 

-		};

+                }

+            }

+        }

 

-		function setCurrentServiceModelInfoFromScope(){

-            DataService.setModelInfo(COMPONENT.SERVICE, {

-                "modelInvariantId": $scope.service.model.service.invariantUuid,

-                "modelVersion": $scope.service.model.service.version,

-                "modelNameVersionId": $scope.service.model.service.uuid,

-                "modelName": $scope.service.model.service.name,

+        function setCurrentVolumeGroupModelInfoByVfModuleFromScope(vnf, volumeGroup) {

+            var svcModel = $scope.service.convertedModel;

+

+            var vnfModelCustomizationUuid = null;

+            var vnfModel = null;

+            var vnfModelVersionId = null;

+

+            vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

+            vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

+                "modelInvariantId": "",

+                "modelVersion": "",

+                "modelNameVersionId": "",

+                "modelCustomizationName": "",

+                "customizationUuid": "",

+                "modelName": "",

                 "inputs": ""

             });

-		};

 

-		function setCurrentVNFModelInfo(vnf){

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

+                    vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+                }

+                else {

+                    vnfModel = svcModel.vnfs[vnfModelVersionId];

+                }

+            }

+

+

+            // volume groups don't have model-invariant-id/version in a&ai.

+            // Their model-invariant-id/version is the one for the associated vfModule

+

+            var vfModuleModelVersionId = volumeGroup.object[FIELD.ID.VF_MODULE_MODEL_VERSION_ID];

+            var vfModuleCustomizationUuid = volumeGroup.object[FIELD.ID.VF_MODULE_MODEL_CUSTOMIZATION_ID];

+            var volGroupModel = null;

+            if ((!($scope.isObjectEmpty(vnfModel))) && (!($scope.isObjectEmpty(vnfModel.volumeGroups)))) {

+                if ((svcModel.isNewFlow) && (UtilityService.hasContents(vfModuleCustomizationUuid))) {

+                    volGroupModel = vnfModel.volumeGroups[vfModuleCustomizationUuid];

+                }

+                else {

+                    volGroupModel = vnfModel.volumeGroups[vfModuleModelVersionId];

+                }

+                if (!($scope.isObjectEmpty(volGroupModel))) {

+                    DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

+                        "modelInvariantId": volGroupModel.invariantUuid,

+                        "modelVersion": volGroupModel.version,

+                        "modelNameVersionId": volGroupModel.uuid,

+                        "modelCustomizationName": volGroupModel.modelCustomizationName,

+                        "customizationUuid": volGroupModel.customizationUuid,

+                        "modelName": volGroupModel.name,

+                        "inputs": ""

+                    });

+

+                }

+            }

+        }

+

+        $scope.deleteVnf = function (serviceObject, vnf) {

+            console.log("Removing VNF " + vnf.name);

+

+            var serviceInstance = serviceObject.object;

             var svcModel = $scope.service.convertedModel;

-            var vnfModel;

-            var vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-            var vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

-            if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-                if ( (svcModel.isNewFlow) && (vnfModelCustomizationUuid != null ) ) {

-                     vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+            DataService.setInventoryItem(vnf.object);

+

+            /*var vnftype = vnf.object['vnf-type'];

+            if (vnftype == null)

+                vnftype = "";

+            else

+            {

+                var n = vnftype.search("/");

+                if (n >= 0)

+                    vnftype = vnftype.substring(n+1);

+            }*/

+

+            var svcModel = $scope.service.convertedModel;

+            var vnfModelInvariantUuid = null;

+            var vnfModelVersion = null;

+            var vnfModelCustomizationUuid = null;

+            var vnfModel = null;

+            var vnfModelVersionId = null;

+

+            vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

+            vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

+            vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            DataService.setModelInfo(COMPONENT.VNF, {

+                "modelInvariantId": vnfModelInvariantUuid,

+                "modelVersion": "",

+                "modelNameVersionId": vnfModelVersionId,

+                "modelCustomizationName": "",

+                "customizationUuid": vnfModelCustomizationUuid,

+                "modelName": "",

+                "inputs": ""

+            });

+

+            if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                if ((svcModel.isNewFlow) && (vnfModelCustomizationUuid != null)) {

+                    vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

                 }

                 else {

-                     vnfModel = svcModel.vnfs[vnfModelVersionId];

+                    vnfModel = svcModel.vnfs[vnfModelVersionId];

                 }

-                if ( !($scope.isObjectEmpty(vnfModel) ) ) {

+                //console.log ( "vnf models: "); console.log ( JSON.stringify ($scope.service.convertedModel.vnfs, null, 4) );

+                if (!($scope.isObjectEmpty(vnfModel))) {

 

                     DataService.setModelInfo(COMPONENT.VNF, {

                         "modelInvariantId": vnfModel.invariantUuid,

@@ -408,670 +637,552 @@
                 }

             }

 

+            DataService.setVnfInstanceId(vnf.object[FIELD.ID.VNF_ID]);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+

+            DataService.setServiceName($scope.service.model.service.name);

 

+            DataService.setServiceUuid($scope.service.model.service.uuid);

 

-		}

-

-		$scope.deleteVnf = function(serviceObject, vnf) {

-			console.log("Removing VNF " + vnf.name);

-			

-			var serviceInstance = serviceObject.object;

-			var svcModel = $scope.service.convertedModel;

-			DataService.setInventoryItem(vnf.object);

-			

-			/*var vnftype = vnf.object['vnf-type'];

-			if (vnftype == null)

-				vnftype = "";

-			else

-			{

-				var n = vnftype.search("/");

-				if (n >= 0)

-					vnftype = vnftype.substring(n+1);

-			}*/

-		

-			var svcModel = $scope.service.convertedModel;

-			var vnfModelInvariantUuid = null;

-			var vnfModelVersion = null;

-			var vnfModelCustomizationUuid = null;

-			var vnfModel = null;

-			var vnfModelVersionId = null;

-			

-			vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

-			vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

-			vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			

-			DataService.setModelInfo(COMPONENT.VNF, {

-				"modelInvariantId": vnfModelInvariantUuid,

-				"modelVersion": "",

-				"modelNameVersionId": vnfModelVersionId,

-				"modelCustomizationName": "",

-				"customizationUuid": vnfModelCustomizationUuid,

-				"modelName": "",

-				"inputs": ""

-			});

-			

-			if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-				if ( (svcModel.isNewFlow) && (vnfModelCustomizationUuid != null ) ) {

-					vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

-				}

-				else {

-					vnfModel = svcModel.vnfs[vnfModelVersionId];

-				}

-				//console.log ( "vnf models: "); console.log ( JSON.stringify ($scope.service.convertedModel.vnfs, null, 4) );

-				if ( !($scope.isObjectEmpty(vnfModel) ) ) {

-						

-					DataService.setModelInfo(COMPONENT.VNF, {

-						"modelInvariantId": vnfModel.invariantUuid,

-						"modelVersion": vnfModel.version,

-						"modelNameVersionId": vnfModel.uuid,

-						"modelCustomizationName": vnfModel.modelCustomizationName,

-						"customizationUuid": vnfModel.customizationUuid,

-						"modelName": vnfModel.name,

-						"inputs": ""

-					});

-				}

-		    } 

-				

-			DataService.setVnfInstanceId(vnf.object[FIELD.ID.VNF_ID]);

-	

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-	

-			DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			

-			DataService.setServiceName($scope.service.model.service.name);

-			

-			DataService.setServiceUuid($scope.service.model.service.uuid);

-			

-			$scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-			    componentId : COMPONENT.VNF,

-			    callbackFunction : deleteOrResumeCallback,

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.VNF,

+                callbackFunction: deleteOrResumeCallback,

                 dialogMethod: COMPONENT.DELETE

-			});

-		

-		};

-		

-		

-

-		$scope.deleteVolumeGroup = function(serviceObject, vnf, vfModule, volumeGroup) {

-

-			console.log("Removing Volume Group " + volumeGroup.name);

-			var haveModel = false;

-			var svcModel = $scope.service.convertedModel;

-			

-			var vnfModelInvariantUuid = null;

-			var vnfModelVersion = null;

-			var vnfModelCustomizationUuid = null;

-			var vnfModel = null;

-			var vnfModelVersionId = null;

-			

-			vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

-			vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

-			vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-		

-			DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

-				"modelInvariantId": "",

-				"modelVersion": "",

-				"modelNameVersionId": "",

-				"modelCustomizationName": "",

-				"customizationUuid": "",

-				"modelName": "",

-				"inputs": ""

-			});

-	

-			if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-				if ( (svcModel.isNewFlow) && (vnfModelCustomizationUuid != null ) ) {

-					vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

-				}

-				else {

-					vnfModel = svcModel.vnfs[vnfModelVersionId];

-				}

-			}

-			

-						

-			// volume groups don't have model-invariant-id/version in a&ai.

-			// Their model-invariant-id/version is the one for the associated vfModule

-			

-			var vfModuleInvariantUuid = vfModule.object[FIELD.ID.MODEL_INVAR_ID];

-			var vfModuleModelVersionId = vfModule.object[FIELD.ID.MODEL_VERSION_ID];

-			var vfModuleCustomizationUuid = vfModule.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			var volGroupModel = null;

-				

-			if ( !($scope.isObjectEmpty(vnfModel.volumeGroups) ) ) {

-				if ( ( !($scope.isObjectEmpty(vnfModel) ) ) && ( !($scope.isObjectEmpty(vnfModel.volumeGroups) ) ) ) {

-					if ( (svcModel.isNewFlow) && (UtilityService.hasContents(vfModuleCustomizationUuid) ) ){

-						volGroupModel = vnfModel.volumeGroups[vfModuleCustomizationUuid];

-					}

-					else {

-						volGroupModel = vnfModel.volumeGroups[vfModuleModelVersionId];

-					}

-					if ( !($scope.isObjectEmpty(volGroupModel) ) ) {

-						DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

-							"modelInvariantId": volGroupModel.invariantUuid,

-							"modelVersion": volGroupModel.version,

-							"modelNameVersionId": volGroupModel.uuid,

-							"modelCustomizationName": volGroupModel.modelCustomizationName,

-							"customizationUuid": volGroupModel.customizationUuid,

-							"modelName": volGroupModel.name,

-							"inputs": ""

-						});

-		

-					}

-				}

-			}

-

-			var serviceInstance = serviceObject.object;

-			

+            });

+

+        };

+

+        $scope.deleteVolumeGroup = function (serviceObject, vnf, vfModule, volumeGroup) {

+

+            console.log("Removing Volume Group " + volumeGroup.name);

+            var haveModel = false;

+

+            var serviceInstance = serviceObject.object;

+

+            setCurrentVolumeGroupModelInfoFromScope(vnf, vfModule);

+

             DataService.setInventoryItem(volumeGroup.object);

-		

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			

-			DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			

-			DataService.setServiceName($scope.service.model.service.name);

-			

-			DataService.setServiceUuid($scope.service.model.service.uuid);

-			DataService.setVnfInstanceId(vnf.nodeId);

-			DataService.setVolumeGroupInstanceId(volumeGroup.nodeId);

-			

-			$scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-			    componentId : COMPONENT.VOLUME_GROUP,

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+

+            DataService.setServiceName($scope.service.model.service.name);

+

+            DataService.setServiceUuid($scope.service.model.service.uuid);

+            DataService.setVnfInstanceId(vnf.nodeId);

+            DataService.setVolumeGroupInstanceId(volumeGroup.nodeId);

+

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.VOLUME_GROUP,

                 dialogMethod: COMPONENT.DELETE

-			});

-		};

-		

-		$scope.deleteVnfVolumeGroup = function(serviceObject, vnf, volumeGroup) {

+            });

+        };

+

+        $scope.deleteVnfVolumeGroup = function (serviceObject, vnf, volumeGroup) {

 

-			console.log("Removing Volume Group " + volumeGroup.name);

+            console.log("Removing Volume Group " + volumeGroup.name);

             var serviceInstance = serviceObject.object;

-			

+

             DataService.setInventoryItem(volumeGroup.object);

-        

-			var svcModel = $scope.service.convertedModel;

-			

-			var vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

-			var vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

-			var vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			

-			var volGroupModelInvariantUuid = volumeGroup.object[FIELD.ID.MODEL_INVAR_ID];

-			var volGroupModelVersionId = volumeGroup.object[FIELD.ID.MODEL_VERSION_ID];

-			var volGroupModelCustomizationUuid = volumeGroup.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			

-			var vnfModel = null;

-			var volGroupModel = null;

-			

-			// send an empty model by default since model is not required for deletes

-			DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {});

-

-			if ( svcModel.isNewFlow ) {

-				vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

-				if ( UtilityService.hasContents (volGroupModelCustomizationUuid) ) {

-					volGroupModel = vnfModel.volumeGroups[volGroupModelCustomizationUuid];

-				}

-			}

-			else {

-				

-				vnfModel = svcModel.vnfs[vnfModelVersionId];

-				if (  UtilityService.hasContents (volGroupModelVersionId) ) {

-					volGroupModel = vnfModel.volumeGroups[volGroupModelVersionId];

-				}

-			}

-			if ( !($scope.isObjectEmpty(volGroupModel) ) ) {

-				DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {		

-					"modelInvariantId": volGroupModel.invariantUuid,

-					"modelVersion": volGroupModel.version,

-					"modelNameVersionId": volGroupModel.uuid,

-					"modelName": volGroupModel.name,

-					"modelCustomizationName": volGroupModel.modelCustomizationName,

-					"customizationUuid": volGroupModel.customizationUuid,

-					"inputs": ""

-				});

-			}

-				

-			DataService.setVnfInstanceId(vnf.object[FIELD.ID.VNF_ID]);

-		

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-	

-			DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			

-			DataService.setServiceName($scope.service.model.service.name);

-			

-			DataService.setServiceUuid($scope.service.model.service.uuid);

-			DataService.setVnfInstanceId(vnf.nodeId);

-			DataService.setVolumeGroupInstanceId(volumeGroup.nodeId);

-		

-			$scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-                componentId : COMPONENT.VOLUME_GROUP,

-                callbackFunction : deleteOrResumeCallback,

+

+            var svcModel = $scope.service.convertedModel;

+

+            var vnfModelInvariantUuid = vnf.object[FIELD.ID.MODEL_INVAR_ID];

+            var vnfModelVersionId = vnf.object[FIELD.ID.MODEL_VERSION_ID];

+            var vnfModelCustomizationUuid = vnf.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            var volGroupModelInvariantUuid = volumeGroup.object[FIELD.ID.MODEL_INVAR_ID];

+            var volGroupModelVersionId = volumeGroup.object[FIELD.ID.MODEL_VERSION_ID];

+            var volGroupModelCustomizationUuid = volumeGroup.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            var vnfModel = null;

+            var volGroupModel = null;

+

+            // send an empty model by default since model is not required for deletes

+            DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {});

+

+            if (svcModel.isNewFlow) {

+                vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+                if (UtilityService.hasContents(volGroupModelCustomizationUuid)) {

+                    volGroupModel = vnfModel.volumeGroups[volGroupModelCustomizationUuid];

+                }

+            }

+            else {

+

+                vnfModel = svcModel.vnfs[vnfModelVersionId];

+                if (UtilityService.hasContents(volGroupModelVersionId)) {

+                    volGroupModel = vnfModel.volumeGroups[volGroupModelVersionId];

+                }

+            }

+            if (!($scope.isObjectEmpty(volGroupModel))) {

+                DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

+                    "modelInvariantId": volGroupModel.invariantUuid,

+                    "modelVersion": volGroupModel.version,

+                    "modelNameVersionId": volGroupModel.uuid,

+                    "modelName": volGroupModel.name,

+                    "modelCustomizationName": volGroupModel.modelCustomizationName,

+                    "customizationUuid": volGroupModel.customizationUuid,

+                    "inputs": ""

+                });

+            }

+

+            DataService.setVnfInstanceId(vnf.object[FIELD.ID.VNF_ID]);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            DataService.setGlobalCustomerId(serviceObject[FIELD.ID.GLOBAL_CUST_ID]);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+

+            DataService.setServiceName($scope.service.model.service.name);

+

+            DataService.setServiceUuid($scope.service.model.service.uuid);

+            DataService.setVnfInstanceId(vnf.nodeId);

+            DataService.setVolumeGroupInstanceId(volumeGroup.nodeId);

+

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.VOLUME_GROUP,

+                callbackFunction: deleteOrResumeCallback,

                 dialogMethod: COMPONENT.DELETE

             });

-		};

-

-		$scope.describeNetwork = function(serviceObject, networkObject) {

-			var serviceInstance = serviceObject.object;

-			var network = networkObject.object;

-			//console.log ("networkObject="); console.log (JSON.stringify(networkObject, null, 4));

-			

-			DataService.setResCustomizationUuid(" ");

-			

-			var svcModel = $scope.service.convertedModel;

-			var netModel = null;

-			

-			if ( !($scope.isObjectEmpty(network) ) ) {

-				

-				var netModelInvariantUuid = network[FIELD.ID.MODEL_INVAR_ID];

-				var netModelVersionId = network[FIELD.ID.MODEL_VERSION_ID];

-				var netModelCustomizationUuid = network[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-				

-				if ( UtilityService.hasContents (netModelCustomizationUuid) ) {

-					// set it to what came from a&ai 

-					DataService.setResCustomizationUuid(netModelCustomizationUuid);

-				}

-				

-				if ( (!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.networks))) ) {

-					if ( svcModel.isNewFlow ) {

-						netModel = svcModel.networks[netModelCustomizationUuid];

-					}

-					else {

-						netModel = svcModel.networks[netModelVersionId];

-					}

-					/*

-					 * The details pop-up should use a&ai info

-					 * if ( !($scope.isObjectEmpty(netModel) ) ) {

-						if (UtilityService.hasContents(netModel.customizationUuid)) {

-							DataService.setResCustomizationUuid(netModel.customizationUuid);

-						}

-					}*/

-				}

-			}

-			

-			DataService.setNetworkInstanceId(network[FIELD.ID.NETWORK_ID]);

-			DataService.setInventoryItem(networkObject);

-			DataService.setSubscriberName(serviceObject.subscriberName);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			

-			$scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

-			    componentId : COMPONENT.NETWORK

-			});

-		};

-

-		// for service instance id - no need for this!

-		$scope.describeService = function(serviceObject) {

-			var serviceInstance = serviceObject.object;

-		

-			DataService.setInventoryItem(serviceInstance);

-			//DataService.setModelInfo(serviceInstance['service-instance-id'], serviceInstance);

-			

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			

-			//Display popup with additional service information

-			$scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

-			    componentId : COMPONENT.SERVICE

-			});

-			

-		};

-

-		$scope.describeVfModule = function(serviceObject, vfModuleObject, vnf) {

-			var serviceInstance = serviceObject.object;

-			var vfModule = vfModuleObject.object;

-			

-			/*var vfModuleInvariantUuid = vfModule[FIELD.ID.MODEL_INVAR_ID];

-			var vfModuleModelVersionId = vfModule[FIELD.ID.MODEL_VERSION_ID];*/

-			var vfModuleCustomizationUuid = vfModule[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-

-			DataService.setCustomizationUuid(" ");

-			if ( UtilityService.hasContents (vfModuleCustomizationUuid) ) {

-				DataService.setCustomizationUuid(vfModuleCustomizationUuid);

-			}

-		

-			//Display popup with additional VF-Module information

-			DataService.setVfModuleInstanceId(vfModule[FIELD.ID.VF_MODULE_ID]);

-			DataService.setInventoryItem(vfModule)

-			

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			

-			$scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

-			    componentId : COMPONENT.VF_MODULE

-			});

-		};

-

-		$scope.getStatusOfVnf = function(serviceObject, vnfObject) {

-			var serviceInstance = serviceObject.object;

-			var vnf = vnfObject.object;

-		  

-			DataService.setVnfInstanceId(vnf[FIELD.ID.VNF_ID]);

-			DataService.setInventoryItem(vnf);

-			

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			DataService.setServiceInstanceName(serviceInstance[FIELD.ID.SERVICE_INSTANCE_NAME]);

-			

-			$scope.$broadcast(COMPONENT.COMPONENT_STATUS, {

-			    componentId : COMPONENT.VNF,

-			    callbackFunction : updateProvStatusVnfCallbackFunction

-			});

-		};

-

-		$scope.describeVnf = function(serviceObject, vnfObject) {

-			var serviceInstance = serviceObject.object;

-			var vnf = vnfObject.object;

-			DataService.setResCustomizationUuid(" ");

-			

-			//var vnfInvariantUuid = vnf[FIELD.ID.MODEL_INVAR_ID];

-			//var vnfVersionId = vnf[FIELD.ID.MODEL_VERSION_ID];

-			var vnfCustomizationUuid = vnf[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-	

-			if ( UtilityService.hasContents (vnfCustomizationUuid) ) {

-				DataService.setResCustomizationUuid(vnfCustomizationUuid);

-		    }

-			//Display popup with additional VNF information

-			DataService.setVnfInstanceId(vnf[FIELD.ID.VNF_ID]);

-			DataService.setInventoryItem(vnf);

-			

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			

-			$scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

-			    componentId : COMPONENT.VNF

-			});

-		};

-

-		$scope.describeVolumeGroup = function(serviceObject, vnf, volumeGroupObject) {

-			

-			var serviceInstance = serviceObject.object;

-			var volumeGroup = volumeGroupObject.object;

-			

-			//var volGroupInvariantUuid = volumeGroup[FIELD.ID.MODEL_INVAR_ID];

-			//var volGroupVersionId = volumeGroup[FIELD.ID.MODEL_VERSION_ID];

-			var volGroupCustomizationUuid = volumeGroup[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-

-			DataService.setCustomizationUuid(" ");	

-			if ( UtilityService.hasContents(volGroupCustomizationUuid) ) {

-				DataService.setCustomizationUuid(volGroupCustomizationUuid);	 

-		    }

-			DataService.setVolumeGroupInstanceId(volumeGroup[FIELD.ID.VOLUME_GROUP_ID]);

-			DataService.setInventoryItem(volumeGroup);

-		

-			DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

-			DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

-			DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

-			

-			

-			$scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

-			    componentId : COMPONENT.VOLUME_GROUP

-			});

-		};

-

-		$scope.addNetworkInstance = function(netModel, existingVnfs) {

-			

-			// For networks we assume that we always follow the new flow

-			console.log("Adding network to service instance" + this.service.instance.name);

-			if ( VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED && (UtilityService.hasContents(existingVnfs)) && (existingVnfs.length > 0) ) {

-				var msg = VnfService.isVnfListStatusValid (existingVnfs);

-				if ( msg != "" ) {

-					alert ( msg );

-					return;

-				}

-			}

-			

-			DataService.setSubscriberName($scope.service.instance.subscriberName);

-			DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

-			DataService.setServiceType($scope.service.instance.serviceType);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			DataService.setServiceInstanceId($scope.service.instance.id);

-			DataService.setServiceName($scope.service.model.service.name);

-			

-			DataService.setModelInfo(COMPONENT.NETWORK, {

-				"modelType": "network",

-				"modelInvariantId": netModel.invariantUuid,

-				"modelVersion": netModel.version,

-				"modelNameVersionId": netModel.uuid,

-				"modelName": netModel.name,

-				"modelCustomizationName": netModel.modelCustomizationName,

-				"customizationUuid": netModel.customizationUuid,

-				"inputs": "",

-				"displayInputs": netModel.displayInputs

-			});

-			setCurrentServiceModelInfoFromScope();

-

-			

-			$scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

-			    componentId : COMPONENT.NETWORK,

-			    callbackFunction : createVnfCallbackFunction

-			});		

-		};

-

-		$scope.addVnfInstance = function(vnf, existingVnfs) {

-				

-			if ( VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED && (UtilityService.hasContents(existingVnfs)) && (existingVnfs.length > 0) ) {

-				var msg = VnfService.isVnfListStatusValid (existingVnfs);

-				if ( msg != "" ) {

-					alert ( msg );

-					return;

-				}

-			}

-			DataService.setSubscriberName($scope.service.instance.subscriberName);

-			DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

-			DataService.setServiceType($scope.service.instance.serviceType);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			DataService.setServiceInstanceId($scope.service.instance.id);

-			DataService.setServiceName($scope.service.model.service.name);

-			

-			console.log ( "existingVnfs: " );

-			console.log (JSON.stringify ( existingVnfs, null, 4));

-			console.log ( "existingVnfs: " ); console.log (JSON.stringify ( existingVnfs, null, 4));

-			var vnf_type = "";

-			var vnf_role = "";

-			var vnf_function = "";

-			var vnf_code = "";

-			

-			if (UtilityService.hasContents (vnf.nfType) ) {

-				vnf_type = vnf.nfType;

-			}

-			if (UtilityService.hasContents (vnf.nfRole) ) {

-				vnf_role = vnf.nfRole;

-			}

-			if (UtilityService.hasContents (vnf.nfFunction) ) {

-				vnf_function = vnf.nfFunction;

-			}

-			if (UtilityService.hasContents (vnf.nfCode) ) {

-				vnf_code = vnf.nfCode;

-			}

-			DataService.setModelInfo(COMPONENT.VNF, {

-				"modelType": vnf.isPnf ? "pnf" : "vnf",

-				"modelInvariantId": vnf.invariantUuid,

-				"modelVersion": vnf.version,

-				"modelNameVersionId": vnf.uuid,

-				"modelName": vnf.name,

-				"modelCustomizationName": vnf.modelCustomizationName,

-				"customizationUuid": vnf.customizationUuid,

-				"inputs": "",

-				"displayInputs": vnf.displayInputs,

-				"vnfType": vnf_type,

-				"vnfRole": vnf_role,

-				"vnfFunction": vnf_function,

-				"vnfCode": vnf_code,

-				"properties": vnf.properties

-			});

-			

-			DataService.setModelInstanceName($scope.service.model.service.name);

-			setCurrentServiceModelInfoFromScope();

-

-			if (vnf.isConfig) {

+        };

+

+        $scope.describeNetwork = function (serviceObject, networkObject) {

+            var serviceInstance = serviceObject.object;

+            var network = networkObject.object;

+            //console.log ("networkObject="); console.log (JSON.stringify(networkObject, null, 4));

+

+            DataService.setResCustomizationUuid(" ");

+

+            setCurrentServiceModelInfoFromScope();

+            setCurrentNetworkModelInfoFromScope(networkObject);

+

+            DataService.setNetworkInstanceId(network[FIELD.ID.NETWORK_ID]);

+            DataService.setInventoryItem(networkObject);

+            DataService.setSubscriberName(serviceObject.subscriberName);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            $scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

+                componentId: COMPONENT.NETWORK

+            });

+        };

+

+        // for service instance id - no need for this!

+        $scope.describeService = function (serviceObject) {

+            var serviceInstance = serviceObject.object;

+            setCurrentServiceModelInfoFromScope();

+

+            DataService.setInventoryItem(serviceInstance);

+            //DataService.setModelInfo(serviceInstance['service-instance-id'], serviceInstance);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            //Display popup with additional service information

+            $scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

+                componentId: COMPONENT.SERVICE

+            });

+

+        };

+

+        $scope.describeVfModule = function (serviceObject, vfModuleObject, vnf) {

+            var serviceInstance = serviceObject.object;

+            var vfModule = vfModuleObject.object;

+

+            /*var vfModuleInvariantUuid = vfModule[FIELD.ID.MODEL_INVAR_ID];

+            var vfModuleModelVersionId = vfModule[FIELD.ID.MODEL_VERSION_ID];*/

+            var vfModuleCustomizationUuid = vfModule[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            setCurrentServiceModelInfoFromScope();

+            setCurrentVfModuleModelInfoFromScope(vnf, vfModuleObject);

+

+            DataService.setCustomizationUuid(" ");

+            if (UtilityService.hasContents(vfModuleCustomizationUuid)) {

+                DataService.setCustomizationUuid(vfModuleCustomizationUuid);

+            }

+

+            //Display popup with additional VF-Module information

+            DataService.setVfModuleInstanceId(vfModule[FIELD.ID.VF_MODULE_ID]);

+            DataService.setInventoryItem(vfModule)

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            $scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

+                componentId: COMPONENT.VF_MODULE

+            });

+        };

+

+        $scope.getStatusOfVnf = function (serviceObject, vnfObject) {

+            var serviceInstance = serviceObject.object;

+            var vnf = vnfObject.object;

+

+            DataService.setVnfInstanceId(vnf[FIELD.ID.VNF_ID]);

+            DataService.setInventoryItem(vnf);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+            DataService.setServiceInstanceName(serviceInstance[FIELD.ID.SERVICE_INSTANCE_NAME]);

+

+            $scope.$broadcast(COMPONENT.COMPONENT_STATUS, {

+                componentId: COMPONENT.VNF,

+                callbackFunction: updateProvStatusVnfCallbackFunction

+            });

+        };

+

+        $scope.describeVnf = function (serviceObject, vnfObject) {

+            var serviceInstance = serviceObject.object;

+            var vnf = vnfObject.object;

+            DataService.setResCustomizationUuid(" ");

+

+            //var vnfInvariantUuid = vnf[FIELD.ID.MODEL_INVAR_ID];

+            //var vnfVersionId = vnf[FIELD.ID.MODEL_VERSION_ID];

+            var vnfCustomizationUuid = vnf[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            if (UtilityService.hasContents(vnfCustomizationUuid)) {

+                DataService.setResCustomizationUuid(vnfCustomizationUuid);

+            }

+

+            setCurrentServiceModelInfoFromScope();

+            setCurrentVNFModelInfo(vnfObject);

+

+            //Display popup with additional VNF information

+            DataService.setVnfInstanceId(vnf[FIELD.ID.VNF_ID]);

+            DataService.setInventoryItem(vnf);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+            $scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

+                componentId: COMPONENT.VNF

+            });

+        };

+

+        $scope.describeVolumeGroup = function (serviceObject, vnf, volumeGroupObject) {

+

+            var serviceInstance = serviceObject.object;

+            var volumeGroup = volumeGroupObject.object;

+

+            var volGroupCustomizationUuid = volumeGroup[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+

+            setCurrentServiceModelInfoFromScope();

+            setCurrentVolumeGroupModelInfoByVfModuleFromScope(vnf, volumeGroupObject);

+

+            DataService.setCustomizationUuid(" ");

+            if (UtilityService.hasContents(volGroupCustomizationUuid)) {

+                DataService.setCustomizationUuid(volGroupCustomizationUuid);

+            }

+            DataService.setVolumeGroupInstanceId(volumeGroup[FIELD.ID.VOLUME_GROUP_ID]);

+            DataService.setInventoryItem(volumeGroup);

+

+            DataService.setSubscriberName(serviceObject[COMPONENT.SUBSCRIBER_NAME]);

+            DataService.setServiceType(serviceObject[COMPONENT.SERVICE_TYPE]);

+            DataService.setServiceInstanceId(serviceInstance[FIELD.ID.SERVICE_INSTANCE_ID]);

+

+

+            $scope.$broadcast(COMPONENT.SHOW_COMPONENT_DETAILS, {

+                componentId: COMPONENT.VOLUME_GROUP

+            });

+        };

+

+        $scope.addNetworkInstance = function (netModel, existingVnfs) {

+

+            // For networks we assume that we always follow the new flow

+            console.log("Adding network to service instance" + this.service.instance.name);

+            if (VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED && (UtilityService.hasContents(existingVnfs)) && (existingVnfs.length > 0)) {

+                var msg = VnfService.isVnfListStatusValid(existingVnfs);

+                if (msg != "") {

+                    alert(msg);

+                    return;

+                }

+            }

+

+            DataService.setSubscriberName($scope.service.instance.subscriberName);

+            DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

+            DataService.setServiceType($scope.service.instance.serviceType);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+            DataService.setServiceInstanceId($scope.service.instance.id);

+            DataService.setServiceName($scope.service.model.service.name);

+

+            DataService.setModelInfo(COMPONENT.NETWORK, {

+                "modelType": "network",

+                "modelInvariantId": netModel.invariantUuid,

+                "modelVersion": netModel.version,

+                "modelNameVersionId": netModel.uuid,

+                "modelName": netModel.name,

+                "modelCustomizationName": netModel.modelCustomizationName,

+                "customizationUuid": netModel.customizationUuid,

+                "inputs": "",

+                "displayInputs": netModel.displayInputs

+            });

+            setCurrentServiceModelInfoFromScope();

+

+

+            $scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

+                componentId: COMPONENT.NETWORK,

+                callbackFunction: createVnfCallbackFunction

+            });

+        };

+

+        $scope.addVnfInstance = function (vnf, existingVnfs) {

+

+            if (VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED && (UtilityService.hasContents(existingVnfs)) && (existingVnfs.length > 0)) {

+                var msg = VnfService.isVnfListStatusValid(existingVnfs);

+                if (msg != "") {

+                    alert(msg);

+                    return;

+                }

+            }

+

+            var isVfc = false;

+

+            _.map($scope.service.model.vnfs, function (value, key) {

+                if (value.uuid == vnf.uuid) {

+                    if (!_.isEmpty(value.vfcInstanceGroups)) {

+                        isVfc = true;

+                        var queryData = {

+                            serviceModelId: $scope.service.model.service.uuid,

+                            serviceInstanceID: $scope.service.instance.id,

+                            globalCustomerId: $scope.service.instance.globalCustomerId,

+                            serviceType: $scope.service.instance.serviceType,

+                            serviceInstanceName: $scope.service.instance.name,

+                            modelCustomizationName: value.modelCustomizationName,

+                            modelCustomizationId: value.customizationUuid,

+                            subscriberName: $scope.service.instance.subscriberName

+                        };

+

+                        $scope.$broadcast(COMPONENT.IFRAME_DIALOG, queryData);

+                        return;

+                    }

+                }

+            });

+

+            DataService.setSubscriberName($scope.service.instance.subscriberName);

+            DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

+            DataService.setServiceType($scope.service.instance.serviceType);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+            DataService.setServiceInstanceId($scope.service.instance.id);

+            DataService.setServiceName($scope.service.model.service.name);

+

+            console.log("existingVnfs: ");

+            console.log(JSON.stringify(existingVnfs, null, 4));

+            console.log("existingVnfs: ");

+            console.log(JSON.stringify(existingVnfs, null, 4));

+            var vnf_type = "";

+            var vnf_role = "";

+            var vnf_function = "";

+            var vnf_code = "";

+

+            if (UtilityService.hasContents(vnf.nfType)) {

+                vnf_type = vnf.nfType;

+            }

+            if (UtilityService.hasContents(vnf.nfRole)) {

+                vnf_role = vnf.nfRole;

+            }

+            if (UtilityService.hasContents(vnf.nfFunction)) {

+                vnf_function = vnf.nfFunction;

+            }

+            if (UtilityService.hasContents(vnf.nfCode)) {

+                vnf_code = vnf.nfCode;

+            }

+            DataService.setModelInfo(COMPONENT.VNF, {

+                "modelType": vnf.isPnf ? "pnf" : "vnf",

+                "modelInvariantId": vnf.invariantUuid,

+                "modelVersion": vnf.version,

+                "modelNameVersionId": vnf.uuid,

+                "modelName": vnf.name,

+                "modelCustomizationName": vnf.modelCustomizationName,

+                "customizationUuid": vnf.customizationUuid,

+                "inputs": "",

+                "displayInputs": vnf.displayInputs,

+                "vnfType": vnf_type,

+                "vnfRole": vnf_role,

+                "vnfFunction": vnf_function,

+                "vnfCode": vnf_code,

+                "properties": vnf.properties

+            });

+

+            DataService.setModelInstanceName($scope.service.model.service.name);

+            setCurrentServiceModelInfoFromScope();

+

+            if (vnf.isConfig) {

                 DataService.setServiceProxies($scope.service.model.serviceProxies);

                 DataService.setSourceServiceProxies(vnf.sourceNodes);

                 DataService.setCollectorServiceProxies(vnf.collectorNodes);

                 DataService.setConfigurationByPolicy(vnf.isConfigurationByPolicy);

                 $location.path("/addNetworkNode");

-            } else if(vnf.isPnf){

+            } else if (vnf.isPnf) {

                 $location.path("/pnfSearchAssociation");

+            } else if (isVfc) {

+                //do nothing

             } else {

                 $scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

                     componentId: COMPONENT.VNF,

                     callbackFunction: createVnfCallbackFunction

                 });

             }

-		};

-

-		$scope.addVfModuleInstance = function(vnfInstance, vfModuleModel) {

-			

-			if ( VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED ) {

-				var msg = VnfService.isVnfStatusValid (vnfInstance);

-				if ( msg != "" ) {

-					alert ( msg );

-					return;

-				}

-				

-			}

-			var svcModel = $scope.service.convertedModel;

-			DataService.setSubscriberName($scope.service.instance.subscriberName);

-			DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

-			DataService.setServiceType($scope.service.instance.serviceType);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			DataService.setServiceInstanceId($scope.service.instance.id);

-			DataService.setServiceName($scope.service.model.service.name);

-

-			var vnfModelInvariantUuid = vnfInstance.object[FIELD.ID.MODEL_INVAR_ID];

-			var vnfModelVersionId = vnfInstance.object[FIELD.ID.MODEL_VERSION_ID];

-			var vnfModelCustomizationUuid = vnfInstance.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			var vnfModel = null;

-			if ( svcModel.isNewFlow ) {

-				vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

-			}

-			else {

-				vnfModel = svcModel.vnfs[vnfModelVersionId];

-			}

-			

-			var availableVolumeGroupList = [];

-			angular.forEach(vnfInstance[FIELD.ID.AVAILABLEVOLUMEGROUPS], function(volumeGroupInstance, key) {

-				availableVolumeGroupList.push({"instance": volumeGroupInstance});

-			});

-			

-			DataService.setAvailableVolumeGroupList(availableVolumeGroupList);

-			setCurrentServiceModelInfoFromScope();

-

-			DataService.setVnfInstanceId(vnfInstance.object[FIELD.ID.VNF_ID]);

-

-			DataService.setModelInfo(COMPONENT.VNF, {

-				"modelInvariantId": vnfModel.invariantUuid,

-				"modelVersion": vnfModel.version,

-				"modelNameVersionId": vnfModel.uuid,

-				"modelName": vnfModel.name,

-				"modelCustomizationName": vnfModel.modelCustomizationName,

-				"customizationUuid": vnfModel.customizationUuid,

-				"inputs": ""

-			});

-			

-			DataService.setModelInfo(COMPONENT.VF_MODULE, {

-				"modelInvariantId": vfModuleModel.invariantUuid,

-				"modelVersion": vfModuleModel.version,

-				"modelNameVersionId": vfModuleModel.uuid,

-				"customizationUuid": vfModuleModel.customizationUuid,

-				"modelCustomizationName": vfModuleModel.modelCustomizationName,

-				"modelName": vfModuleModel.name,

-				"inputs": ""

-			});

-			

-			$scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

-			    componentId : COMPONENT.VF_MODULE,

-			    callbackFunction : createVfModuleCallbackFunction

-			});

-		

-		};

-

-		$scope.addVolumeGroupInstance = function(vnfInstance, volumeGroupModel) {

-			if ( VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED ) {

-				var msg = VnfService.isVnfStatusValid (vnfInstance);

-				if ( msg != "" ) {

-					alert ( msg );

-					return;

-				}

-			}

-			var svcModel = $scope.service.convertedModel;

-			DataService.setSubscriberName($scope.service.instance.subscriberName);

-			DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

-			DataService.setServiceType($scope.service.instance.serviceType);

-			DataService.setServiceInstanceName($scope.service.instance.name);

-			DataService.setServiceInstanceId($scope.service.instance.id);

-			DataService.setServiceName($scope.service.model.service.name);

-			setCurrentServiceModelInfoFromScope();

-

-			DataService.setModelInfo(COMPONENT.SERVICE, {

-				"modelInvariantId": $scope.service.model.service.invariantUuid,

-				"modelVersion": $scope.service.model.service.version,

-				"modelNameVersionId": $scope.service.model.service.uuid,

-				"modelName": $scope.service.model.service.name,

-				"inputs": ""

-			});

-

-			DataService.setVnfInstanceId(vnfInstance.object[FIELD.ID.VNF_ID]);

-

-			var vnfModelInvariantUuid = vnfInstance.object[FIELD.ID.MODEL_INVAR_ID];

-			var vnfModelVersionId = vnfInstance.object[FIELD.ID.MODEL_VERSION_ID];

-			var vnfCustomizationUuid = vnfInstance.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

-			var vnfModel = null;

-			

-			if ( svcModel.isNewFlow ) {

-				vnfModel = svcModel.vnfs[vnfCustomizationUuid];

-			}

-			else {

-				vnfModel = svcModel.vnfs[vnfModelVersionId];

-			}

-

-			DataService.setModelInfo(COMPONENT.VNF, {

-				"modelInvariantId": vnfModel.invariantUuid,

-				"modelVersion": vnfModel.version,

-				"modelNameVersionId": vnfModel.uuid,

-				"modelName": vnfModel.name,

-				"modelCustomizationName": vnfModel.modelCustomizationName,

-				"customizationUuid": vnfModel.customizationUuid,

-				"inputs": ""

-			});

-			

-			DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

-				"modelInvariantId": volumeGroupModel.invariantUuid,

-				"modelVersion": volumeGroupModel.version,

-				"modelNameVersionId": volumeGroupModel.uuid,

-				"modelName": volumeGroupModel.name,

-				"modelCustomizationName": volumeGroupModel.modelCustomizationName,

-				"customizationUuid": volumeGroupModel.customizationUuid,

-				"inputs": ""

-			});

-			

-			$scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

-			    componentId : COMPONENT.VOLUME_GROUP,

-			    callbackFunction : createVolumeGroupCallbackFunction

-			});

-		};

-

-        $scope.resume = function(serviceObject, vfModule, vnfModel) {

+        };

+

+        $scope.addVfModuleInstance = function (vnfInstance, vfModuleModel) {

+

+            if (VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED) {

+                var msg = VnfService.isVnfStatusValid(vnfInstance);

+                if (msg != "") {

+                    alert(msg);

+                    return;

+                }

+

+            }

+            var svcModel = $scope.service.convertedModel;

+            DataService.setSubscriberName($scope.service.instance.subscriberName);

+            DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

+            DataService.setServiceType($scope.service.instance.serviceType);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+            DataService.setServiceInstanceId($scope.service.instance.id);

+            DataService.setServiceName($scope.service.model.service.name);

+

+            var vnfModelInvariantUuid = vnfInstance.object[FIELD.ID.MODEL_INVAR_ID];

+            var vnfModelVersionId = vnfInstance.object[FIELD.ID.MODEL_VERSION_ID];

+            var vnfModelCustomizationUuid = vnfInstance.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+            var vnfModel = null;

+            if (svcModel.isNewFlow) {

+                vnfModel = svcModel.vnfs[vnfModelCustomizationUuid];

+            }

+            else {

+                vnfModel = svcModel.vnfs[vnfModelVersionId];

+            }

+

+            var availableVolumeGroupList = [];

+            angular.forEach(vnfInstance[FIELD.ID.AVAILABLEVOLUMEGROUPS], function (volumeGroupInstance, key) {

+                availableVolumeGroupList.push({"instance": volumeGroupInstance});

+            });

+

+            DataService.setAvailableVolumeGroupList(availableVolumeGroupList);

+            setCurrentServiceModelInfoFromScope();

+

+            DataService.setVnfInstanceId(vnfInstance.object[FIELD.ID.VNF_ID]);

+

+            DataService.setModelInfo(COMPONENT.VNF, {

+                "modelInvariantId": vnfModel.invariantUuid,

+                "modelVersion": vnfModel.version,

+                "modelNameVersionId": vnfModel.uuid,

+                "modelName": vnfModel.name,

+                "modelCustomizationName": vnfModel.modelCustomizationName,

+                "customizationUuid": vnfModel.customizationUuid,

+                "inputs": ""

+            });

+

+            DataService.setModelInfo(COMPONENT.VF_MODULE, {

+                "modelInvariantId": vfModuleModel.invariantUuid,

+                "modelVersion": vfModuleModel.version,

+                "modelNameVersionId": vfModuleModel.uuid,

+                "customizationUuid": vfModuleModel.customizationUuid,

+                "modelCustomizationName": vfModuleModel.modelCustomizationName,

+                "modelName": vfModuleModel.name,

+                "inputs": ""

+            });

+

+            $scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

+                componentId: COMPONENT.VF_MODULE,

+                callbackFunction: createVfModuleCallbackFunction

+            });

+

+        };

+

+        $scope.addVolumeGroupInstance = function (vnfInstance, volumeGroupModel) {

+            if (VIDCONFIGURATION.VNF_STATUS_CHECK_ENABLED) {

+                var msg = VnfService.isVnfStatusValid(vnfInstance);

+                if (msg != "") {

+                    alert(msg);

+                    return;

+                }

+            }

+            var svcModel = $scope.service.convertedModel;

+            DataService.setSubscriberName($scope.service.instance.subscriberName);

+            DataService.setGlobalCustomerId($scope.service.instance.globalCustomerId);

+            DataService.setServiceType($scope.service.instance.serviceType);

+            DataService.setServiceInstanceName($scope.service.instance.name);

+            DataService.setServiceInstanceId($scope.service.instance.id);

+            DataService.setServiceName($scope.service.model.service.name);

+            setCurrentServiceModelInfoFromScope();

+

+            DataService.setModelInfo(COMPONENT.SERVICE, {

+                "modelInvariantId": $scope.service.model.service.invariantUuid,

+                "modelVersion": $scope.service.model.service.version,

+                "modelNameVersionId": $scope.service.model.service.uuid,

+                "modelName": $scope.service.model.service.name,

+                "inputs": ""

+            });

+

+            DataService.setVnfInstanceId(vnfInstance.object[FIELD.ID.VNF_ID]);

+

+            var vnfModelInvariantUuid = vnfInstance.object[FIELD.ID.MODEL_INVAR_ID];

+            var vnfModelVersionId = vnfInstance.object[FIELD.ID.MODEL_VERSION_ID];

+            var vnfCustomizationUuid = vnfInstance.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

+            var vnfModel = null;

+

+            if (svcModel.isNewFlow) {

+                vnfModel = svcModel.vnfs[vnfCustomizationUuid];

+            }

+            else {

+                vnfModel = svcModel.vnfs[vnfModelVersionId];

+            }

+

+            DataService.setModelInfo(COMPONENT.VNF, {

+                "modelInvariantId": vnfModel.invariantUuid,

+                "modelVersion": vnfModel.version,

+                "modelNameVersionId": vnfModel.uuid,

+                "modelName": vnfModel.name,

+                "modelCustomizationName": vnfModel.modelCustomizationName,

+                "customizationUuid": vnfModel.customizationUuid,

+                "inputs": ""

+            });

+

+            DataService.setModelInfo(COMPONENT.VOLUME_GROUP, {

+                "modelInvariantId": volumeGroupModel.invariantUuid,

+                "modelVersion": volumeGroupModel.version,

+                "modelNameVersionId": volumeGroupModel.uuid,

+                "modelName": volumeGroupModel.name,

+                "modelCustomizationName": volumeGroupModel.modelCustomizationName,

+                "customizationUuid": volumeGroupModel.customizationUuid,

+                "inputs": ""

+            });

+

+            $scope.$broadcast(COMPONENT.CREATE_COMPONENT, {

+                componentId: COMPONENT.VOLUME_GROUP,

+                callbackFunction: createVolumeGroupCallbackFunction

+            });

+        };

+

+        $scope.resume = function (serviceObject, vfModule, vnfModel) {

             populate_popup_vfModule(serviceObject, vfModule, vnfModel);

-			setCurrentVNFModelInfo(vnfModel);

-			DataService.setVfModuleInstanceName(vfModule.object[FIELD.ID.VF_MODULE_NAME]);

-			setCurrentServiceModelInfoFromScope();

+            setCurrentVNFModelInfo(vnfModel);

+            DataService.setVfModuleInstanceName(vfModule.object[FIELD.ID.VF_MODULE_NAME]);

+            setCurrentServiceModelInfoFromScope();

             $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

-                componentId : COMPONENT.VF_MODULE,

-                callbackFunction : deleteOrResumeCallback,

+                componentId: COMPONENT.VF_MODULE,

+                callbackFunction: deleteOrResumeCallback,

                 dialogMethod: COMPONENT.RESUME

             });

         };

 

-		$scope.deleteConfiguration = function (serviceObject, configuration) {

+        $scope.deleteConfiguration = function (serviceObject, configuration) {

             console.log("Deleting Configuration " + configuration.name);

 

             var serviceInstance = serviceObject.object;

@@ -1081,27 +1192,27 @@
             // set model default and override later if found

             DataService.setModelInfo(COMPONENT.CONFIGURATION, {});

 

-            if ( configuration.object != null ) {

+            if (configuration.object != null) {

 

                 //var netModelInvariantUuid = network.object[FIELD.ID.MODEL_INVAR_ID];

                 var configModelVersionId = configuration.object[FIELD.ID.MODEL_VERSION_ID]; // model uuid

                 var configModelCustomizationUuid = configuration.object[FIELD.ID.MODEL_CUSTOMIZATION_ID];

 

                 //configurations added to vnfs list, in order to be part of the "Add VNF" drop-down list

-                if ( (!($scope.isObjectEmpty(svcModel))) && ( !($scope.isObjectEmpty(svcModel.vnfs) ) ) ) {

-                    if ( (svcModel.isNewFlow) && (UtilityService.hasContents(configModelCustomizationUuid) ) ) {

+                if ((!($scope.isObjectEmpty(svcModel))) && (!($scope.isObjectEmpty(svcModel.vnfs)))) {

+                    if ((svcModel.isNewFlow) && (UtilityService.hasContents(configModelCustomizationUuid))) {

                         configModel = svcModel.vnfs[configModelCustomizationUuid];

                     }

                     else {

 

-                        if ( UtilityService.hasContents(configModelVersionId) ) {

+                        if (UtilityService.hasContents(configModelVersionId)) {

                             configModel = svcModel.vnfs[configModelVersionId];

                         }

 

                     }

                 }

             }

-            if (!($scope.isObjectEmpty(configModel) ) ) {

+            if (!($scope.isObjectEmpty(configModel))) {

                 DataService.setModelInfo(COMPONENT.CONFIGURATION, {

                     "modelInvariantId": configModel.invariantUuid,

                     "modelVersion": configModel.version,

@@ -1123,258 +1234,269 @@
             DataService.setServiceUuid($scope.service.model.service.uuid);

             DataService.setConfigurationInstanceId(configuration.object[FIELD.ID.CONFIGURATION_ID]);

 

-            $scope.$broadcast(COMPONENT.DELETE_COMPONENT, {

-                componentId : COMPONENT.CONFIGURATION,

-                callbackFunction : deleteCallbackFunction

+            $scope.$broadcast(COMPONENT.DELETE_RESUME_COMPONENT, {

+                componentId: COMPONENT.CONFIGURATION,

+                dialogMethod: COMPONENT.DELETE,

+                callbackFunction: deleteCallbackFunction

             });

         };

 

-		$scope.resetProgress = function() {

-			$scope.percentProgress = 0;

-			$scope.progressClass = FIELD.STYLE.PROGRESS_BAR_INFO;

-		};

-

-		$scope.setProgress = function(percentProgress) {

-			percentProgress = parseInt(percentProgress);

-			if (percentProgress >= 100) {

-				$scope.progressClass = FIELD.STYLE.PROGRESS_BAR_SUCCESS;					

-			}

-

-			if (percentProgress < $scope.percentProgress) {

-				return;

-			}

-

-			$scope.percentProgress = percentProgress;

-			$scope.progressWidth = {width: percentProgress + "%"};

-			if (percentProgress >= 5) {

-				$scope.progressText =  percentProgress + " %";

-			} else {

-				// Hidden since color combination is barely visible when progress portion is narrow.

-				$scope.progressText = "";

-			}

-		};

-		$scope.isObjectEmpty = function(o) {

-			var len = 0;

-			if (UtilityService.hasContents(o)){

-				var keys = Object.keys(o);

-				len = keys.length;

-				if ( len == 0 ) {

-					return true;

-				}

-				else {

-					return false;

-				}

-			}

-			else {

-				return true;

-			}

-		}

-		$scope.isMacro = function() {

-			if (UtilityService.arrayContains (VIDCONFIGURATION.MACRO_SERVICES, $scope.service.model.service.invariantUuid )) {

-				return(true);

-				

-			}

-			else {

-				return (false);

-			}

-		}

-		$scope.reloadRoute = function() {

-			$route.reload();

-		}

-

-

-

-           		/*

-		Private metthods

-		 */

-

-		/*

-		setPnf

-		* set the controller pnf param using api call

-		* return: void

-		 */

-        function _setPnf(data){ // data is the $scope.service.instance object

- 		 return PnfService.getPnfs(data)

+        var deleteCallbackFunction = function () {

+            console.log('hi')

+        }

+

+        $scope.resetProgress = function () {

+            $scope.percentProgress = 0;

+            $scope.progressClass = FIELD.STYLE.PROGRESS_BAR_INFO;

+        };

+

+        $scope.setProgress = function (percentProgress) {

+            percentProgress = parseInt(percentProgress);

+            if (percentProgress >= 100) {

+                $scope.progressClass = FIELD.STYLE.PROGRESS_BAR_SUCCESS;

+            }

+

+            if (percentProgress < $scope.percentProgress) {

+                return;

+            }

+

+            $scope.percentProgress = percentProgress;

+            $scope.progressWidth = {width: percentProgress + "%"};

+            if (percentProgress >= 5) {

+                $scope.progressText = percentProgress + " %";

+            } else {

+                // Hidden since color combination is barely visible when progress portion is narrow.

+                $scope.progressText = "";

+            }

+        };

+        $scope.isObjectEmpty = function (o) {

+            var len = 0;

+            if (UtilityService.hasContents(o)) {

+                var keys = Object.keys(o);

+                len = keys.length;

+                if (len == 0) {

+                    return true;

+                }

+                else {

+                    return false;

+                }

+            }

+            else {

+                return true;

+            }

+        }

+        $scope.isMacro = function () {

+            return $scope.service && AsdcService.isMacro($scope.service.model);

+        }

+        $scope.reloadRoute = function () {

+            $route.reload();

+        }

+

+

+        /*

+Private metthods

+*/

+

+        /*

+        setPnf

+        * set the controller pnf param using api call

+        * return: void

+         */

+        function _setPnf(data) { // data is the $scope.service.instance object

+            return PnfService.getPnfs(data)

+                .then(

+                    function success(response) {

+                        return response.data;

+                        // * can add here changes on the data that are needed to the view ( filter, ect..)

+                    },

+                    function error(error) {

+                        console.error(error);

+                    }

+                );

+        }

+

+

+        function _setCr(data) { // data is the $scope.service.instance object

+            return CrService.getCr(data)

                 .then(

-					function success(response){

-						return response.data;

-						// * can add here changes on the data that are needed to the view ( filter, ect..)

-					},

-					function error(error){

-						console.error(error);

-					}

-            	);

+                    function success(response) {

+                        return response.data.results;

+                        // * can add here changes on the data that are needed to the view ( filter, ect..)

+                    },

+                    function error(error) {

+                        console.error(error);

+                    }

+                );

         }

 

+

         /*

         Callbaks functions

 

          */

-		var updateProvStatusVnfCallbackFunction = function(response) {

-			$scope.callbackResults = "";

-			var color = FIELD.ID.COLOR_NONE;

-			$scope.callbackStyle = {

-					"background-color" : color

-			};

-			$scope.reloadRoute();

-			/*

-			 * This 1/2 delay was only added to visually highlight the status

-			 * change. Probably not needed in the real application code.

-			 */

-			$timeout(function() {

-				$scope.callbackResults = UtilityService.getCurrentTime()

-				+ FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

-				if (response.isSuccessful) {

-					color = FIELD.ID.COLOR_8F8;

-					

-				} else {

-					color = FIELD.ID.COLOR_F88;

-				}

-				$scope.callbackStyle = {

-						"background-color" : color

-				};

-			}, 500);

-		

-		};

-

-		var createVnfCallbackFunction = function(response) {

-			$scope.callbackResults = "";

-			var color = FIELD.ID.COLOR_NONE;

-			$scope.callbackStyle = {

-					"background-color" : color

-			};

-			

-			/*

-			 * This 1/2 delay was only added to visually highlight the status

-			 * change. Probably not needed in the real application code.

-			 */

-			$timeout(function() {

-				$scope.callbackResults = UtilityService.getCurrentTime()

-				+ FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

-				if (response.isSuccessful) {

-					color = FIELD.ID.COLOR_8F8;

-					$scope.reloadRoute();

-				} else {

-					color = FIELD.ID.COLOR_F88;

-				}

-				$scope.callbackStyle = {

-						"background-color" : color

-				};

-			}, 500);

-			

-		

-			

-		};

-		

-		var deleteOrResumeCallback = function(response) {

-			$scope.callbackResults = "";

-			var color = FIELD.ID.COLOR_NONE;

-			$scope.callbackStyle = {

-					"background-color" : color

-			};

-			

-			/*

-			 * This 1/2 delay was only added to visually highlight the status

-			 * change. Probably not needed in the real application code.

-			 */

-			$timeout(function() {

-				$scope.callbackResults = UtilityService.getCurrentTime()

-				+ FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

-				if (response.isSuccessful) {

-					color = FIELD.ID.COLOR_8F8;

-					$scope.reloadRoute();

-				} else {

-					color = FIELD.ID.COLOR_F88;

-				}

-				$scope.callbackStyle = {

-						"background-color" : color

-				};

-			}, 500);

-			

-		};

-		

-		var createVfModuleCallbackFunction = function(response) {

-			$scope.callbackResults = "";

-			var color = FIELD.ID.COLOR_NONE;

-			$scope.callbackStyle = {

-					"background-color" : color

-			};

-			

-			/*

-			 * This 1/2 delay was only added to visually highlight the status

-			 * change. Probably not needed in the real application code.

-			 */

-			$timeout(function() {

-				$scope.callbackResults = UtilityService.getCurrentTime()

-				+ FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

-				if (response.isSuccessful) {

-					color = FIELD.ID.COLOR_8F8;

-					$scope.reloadRoute();

-				} else {

-					color = FIELD.ID.COLOR_F88;

-				}

-				$scope.callbackStyle = {

-						"background-color" : color

-				};

-			}, 500);

-

-		};

-			

-		var deleteServiceInstanceCallbackFunction = function(response) {

-			$scope.callbackResults = "";

-			var color = FIELD.ID.COLOR_NONE;

-			$scope.callbackStyle = {

-					"background-color" : color

-			};

-			

-			/*

-			 * This 1/2 delay was only added to visually highlight the status

-			 * change. Probably not needed in the real application code.

-			 */

-			$timeout(function() {

-				$scope.callbackResults = UtilityService.getCurrentTime()

-				+ FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

-				if (response.isSuccessful) {

-					color = FIELD.ID.COLOR_8F8;

-					$location.path(COMPONENT.SERVICEMODELS_MODELS_SERVICES_PATH)

-				} else {

-					color = FIELD.ID.COLOR_F88;

-				}

-				$scope.callbackStyle = {

-						"background-color" : color

-				};

-			}, 500);

-

-		};

-	

-		var createVolumeGroupCallbackFunction = function(response) {

-			$scope.callbackResults = "";

-			var color = FIELD.ID.COLOR_NONE;

-			$scope.callbackStyle = {

-					"background-color" : color

-			};

-			

-			/*

-			 * This 1/2 delay was only added to visually highlight the status

-			 * change. Probably not needed in the real application code.

-			 */

-			$timeout(function() {

-				$scope.callbackResults = UtilityService.getCurrentTime()

-				+ FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

-				if (response.isSuccessful) {

-					color = FIELD.ID.COLOR_8F8;

-					$scope.reloadRoute();

-				} else {

-					color = FIELD.ID.COLOR_F88;

-				}

-				$scope.callbackStyle = {

-						"background-color" : color

-				};

-			}, 500);

-			

-			

-		

-		};

-			

-	});

+        var updateProvStatusVnfCallbackFunction = function (response) {

+            $scope.callbackResults = "";

+            var color = FIELD.ID.COLOR_NONE;

+            $scope.callbackStyle = {

+                "background-color": color

+            };

+            $scope.reloadRoute();

+            /*

+             * This 1/2 delay was only added to visually highlight the status

+             * change. Probably not needed in the real application code.

+             */

+            $timeout(function () {

+                $scope.callbackResults = UtilityService.getCurrentTime()

+                    + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

+                if (response.isSuccessful) {

+                    color = FIELD.ID.COLOR_8F8;

+

+                } else {

+                    color = FIELD.ID.COLOR_F88;

+                }

+                $scope.callbackStyle = {

+                    "background-color": color

+                };

+            }, 500);

+

+        };

+

+        var createVnfCallbackFunction = function (response) {

+            $scope.callbackResults = "";

+            var color = FIELD.ID.COLOR_NONE;

+            $scope.callbackStyle = {

+                "background-color": color

+            };

+

+            /*

+             * This 1/2 delay was only added to visually highlight the status

+             * change. Probably not needed in the real application code.

+             */

+            $timeout(function () {

+                $scope.callbackResults = UtilityService.getCurrentTime()

+                    + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

+                if (response.isSuccessful) {

+                    color = FIELD.ID.COLOR_8F8;

+                    $scope.reloadRoute();

+                } else {

+                    color = FIELD.ID.COLOR_F88;

+                }

+                $scope.callbackStyle = {

+                    "background-color": color

+                };

+            }, 500);

+

+

+        };

+

+        var deleteOrResumeCallback = function (response) {

+            $scope.callbackResults = "";

+            var color = FIELD.ID.COLOR_NONE;

+            $scope.callbackStyle = {

+                "background-color": color

+            };

+

+            /*

+             * This 1/2 delay was only added to visually highlight the status

+             * change. Probably not needed in the real application code.

+             */

+            $timeout(function () {

+                $scope.callbackResults = UtilityService.getCurrentTime()

+                    + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

+                if (response.isSuccessful) {

+                    color = FIELD.ID.COLOR_8F8;

+                    $scope.reloadRoute();

+                } else {

+                    color = FIELD.ID.COLOR_F88;

+                }

+                $scope.callbackStyle = {

+                    "background-color": color

+                };

+            }, 500);

+

+        };

+

+        var createVfModuleCallbackFunction = function (response) {

+            $scope.callbackResults = "";

+            var color = FIELD.ID.COLOR_NONE;

+            $scope.callbackStyle = {

+                "background-color": color

+            };

+

+            /*

+             * This 1/2 delay was only added to visually highlight the status

+             * change. Probably not needed in the real application code.

+             */

+            $timeout(function () {

+                $scope.callbackResults = UtilityService.getCurrentTime()

+                    + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

+                if (response.isSuccessful) {

+                    color = FIELD.ID.COLOR_8F8;

+                    $scope.reloadRoute();

+                } else {

+                    color = FIELD.ID.COLOR_F88;

+                }

+                $scope.callbackStyle = {

+                    "background-color": color

+                };

+            }, 500);

+

+        };

+

+        var deleteServiceInstanceCallbackFunction = function (response) {

+            $scope.callbackResults = "";

+            var color = FIELD.ID.COLOR_NONE;

+            $scope.callbackStyle = {

+                "background-color": color

+            };

+

+            /*

+             * This 1/2 delay was only added to visually highlight the status

+             * change. Probably not needed in the real application code.

+             */

+            $timeout(function () {

+                $scope.callbackResults = UtilityService.getCurrentTime()

+                    + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

+                if (response.isSuccessful) {

+                    color = FIELD.ID.COLOR_8F8;

+                    $location.path(COMPONENT.SERVICEMODELS_MODELS_SERVICES_PATH)

+                } else {

+                    color = FIELD.ID.COLOR_F88;

+                }

+                $scope.callbackStyle = {

+                    "background-color": color

+                };

+            }, 500);

+

+        };

+

+        var createVolumeGroupCallbackFunction = function (response) {

+            $scope.callbackResults = "";

+            var color = FIELD.ID.COLOR_NONE;

+            $scope.callbackStyle = {

+                "background-color": color

+            };

+

+            /*

+             * This 1/2 delay was only added to visually highlight the status

+             * change. Probably not needed in the real application code.

+             */

+            $timeout(function () {

+                $scope.callbackResults = UtilityService.getCurrentTime()

+                    + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

+                if (response.isSuccessful) {

+                    color = FIELD.ID.COLOR_8F8;

+                    $scope.reloadRoute();

+                } else {

+                    color = FIELD.ID.COLOR_F88;

+                }

+                $scope.callbackStyle = {

+                    "background-color": color

+                };

+            }, 500);

+

+

+        };

+

+    });

 })();

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js
index b52b463b..c85e8652 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceModelController.js
@@ -22,17 +22,30 @@
 	'use strict';

 

 	appDS2.controller("ServiceModelController", function ($scope, $http, $location, COMPONENT, VIDCONFIGURATION, FIELD, DataService, vidService,

-			PropertyService, UtilityService) {

+			PropertyService, UtilityService, AsdcService,$timeout) {

 

 		$scope.popup = {};

-		

+		var defaultViewPerPage = 10;

 	//	var baseEndpoint = "vid";

 		var pathQuery = COMPONENT.SERVICES_DIST_STATUS_PATH + VIDCONFIGURATION.ASDC_MODEL_STATUS;

 		

 		if ( VIDCONFIGURATION.ASDC_MODEL_STATUS === FIELD.STATUS.ALL) {

 			pathQuery = COMPONENT.SERVICES_PATH;

 		}

-		

+        window.addEventListener("message", receiveMessage, false);

+

+		function receiveMessage(event){

+            if(event.data == 'navigateTo') {

+                $location.path('/models/services').search({});

+                $scope.$apply();

+                $scope.rememberFilter = true;

+            }

+            if(event.data == 'navigateToInstantiationStatus') {

+                $location.path('/instantiationStatus').search({});

+                $scope.$apply();

+            }

+		}

+

 		$scope.getServiceModels = function() {

 			$scope.status = FIELD.STATUS.FETCHING_SERVICE_CATALOG_ASDC;

 

@@ -41,16 +54,28 @@
 				$scope.services = [];

 				if (response.data && angular.isArray(response.data.services)) {

 					wholeData = response.data.services;

-					$scope.services = $scope.filterDataWithHigherVersion(wholeData);

-					$scope.viewPerPage=10;

-					$scope.totalPage=$scope.services.length/$scope.viewPerPage;

-					$scope.sortBy=COMPONENT.NAME;

-					$scope.scrollViewPerPage=2;

-					$scope.currentPage=1;

-					$scope.searchCategory;

-					$scope.currentPageNum=1;

-					$scope.isSpinnerVisible = false;

-					$scope.isProgressVisible = false;

+                    $scope.services = $scope.filterDataWithHigherVersion(wholeData);

+                    $scope.viewPerPage = defaultViewPerPage;

+                    $scope.totalPage=$scope.services.length/$scope.viewPerPage;

+                    $scope.sortBy=COMPONENT.NAME;

+                    $scope.scrollViewPerPage=2;

+                    $scope.currentPage=1;

+                    $scope.currentPageNum=1;

+                    $scope.isSpinnerVisible = false;

+                    $scope.isProgressVisible = false;

+                    if (sessionStorage.getItem("searchKey")!='undefined' && ($scope.rememberFilter)) {

+                        var searchKey = JSON.parse(sessionStorage.getItem("searchKey"));

+                        $scope.searchString = searchKey.searchString || '';

+                        $scope.viewPerPage = searchKey.viewPerPage || defaultViewPerPage;

+                        $scope.totalPage = $scope.services.length / $scope.viewPerPage;

+                        $timeout(function () {

+                        	// the table controller handles the current page once

+							// data is loaded, therefore we're delying the paging

+							// override

+                            $scope.currentPage = $scope.currentPageNum = searchKey.currentPage ? parseInt(searchKey.currentPage) : 1;

+                        }, 0);

+                        $scope.rememberFilter = false;

+                    }

 				} else {

 					$scope.status = FIELD.STATUS.FAILED_SERVICE_MODELS_ASDC;

 					$scope.error = true;

@@ -99,25 +124,32 @@
     		

     		//PropertyService.setMsoBaseUrl("testmso");

     		PropertyService.setServerResponseTimeoutMsec(30000);

-        }

+        };

 		

 		$scope.prevPage = function() {

 			$scope.currentPage--;

-		}

+		};

 		

 		$scope.nextPage = function() {

 			$scope.currentPage++;

-		}

+		};

+

+

 		

 		$scope.createType = COMPONENT.A_LA_CARTE;

 		$scope.deployService = function(service) {

-

+			var searchKey = {

+				searchString: $scope.searchString,

+                viewPerPage: $scope.viewPerPage,

+                currentPage: $scope.currentPage

+			};

+			sessionStorage.setItem("searchKey",JSON.stringify(searchKey));

 

 			console.log("Instantiating SDC service " + service.uuid);

-			

+

 			$http.get(COMPONENT.SERVICES_PATH + service.uuid)

 				.then(function successCallback(getServiceResponse) {

-					

+

 					var serviceModel = getServiceResponse.data;

 

 					//VID-233 bug fix when models doesn't exists

@@ -157,41 +189,42 @@
 					DataService.setALaCarte (true);

 					$scope.createType = COMPONENT.A_LA_CARTE;

 					var broadcastType = COMPONENT.CREATE_COMPONENT;

-					

-					if (UtilityService.arrayContains (VIDCONFIGURATION.MACRO_SERVICES, serviceModel.service.invariantUuid )) {

-						DataService.setALaCarte (false);

-						$scope.createType = COMPONENT.MACRO;

-						var convertedAsdcModel = UtilityService.convertModel(serviceModel);

-						

-						//console.log ("display inputs "); 

-						//console.log (JSON.stringify ( convertedAsdcModel.completeDisplayInputs));

-						

-						DataService.setModelInfo(COMPONENT.SERVICE, {

-							"modelInvariantId": serviceModel.service.invariantUuid,

-							"modelVersion": serviceModel.service.version,

-							"modelNameVersionId": serviceModel.service.uuid,

-							"modelName": serviceModel.service.name,

-							"description": serviceModel.service.description,

-							"category":serviceModel.service.category,

-							"serviceEcompNaming": serviceModel.service.serviceEcompNaming,

-							"inputs": serviceModel.service.inputs,

-							"serviceType": serviceModel.service.serviceType,

-							"serviceRole": serviceModel.service.serviceRole,

-							"displayInputs": convertedAsdcModel.completeDisplayInputs

-						});

-					};

-					

+                    if (AsdcService.isMacro(serviceModel)) {

+                        DataService.setALaCarte(false);

+                        if(AsdcService.shouldExcludeMacroFromAsyncInstatiationFlow(serviceModel)){

+                        	DataService.setShouldExcludeMacroFromAsyncInstatiationFlow(true);

+                            $scope.createType = COMPONENT.MACRO;

+                            var convertedAsdcModel = UtilityService.convertModel(serviceModel);

+

+                            DataService.setModelInfo(COMPONENT.SERVICE, {

+                                "modelInvariantId": serviceModel.service.invariantUuid,

+                                "modelVersion": serviceModel.service.version,

+                                "modelNameVersionId": serviceModel.service.uuid,

+                                "modelName": serviceModel.service.name,

+                                "description": serviceModel.service.description,

+                                "category": serviceModel.service.category,

+                                "serviceEcompNaming": serviceModel.service.serviceEcompNaming,

+                                "inputs": serviceModel.service.inputs,

+                                "serviceType": serviceModel.service.serviceType,

+                                "serviceRole": serviceModel.service.serviceRole,

+                                "displayInputs": convertedAsdcModel.completeDisplayInputs

+                            });

+

+                        }

+                    }

+

 					$scope.$broadcast(broadcastType, {

 					    componentId : COMPONENT.SERVICE,

+                        modelNameVersionId: serviceModel.service.uuid,

 					    callbackFunction : function(response) {

 					    	if (response.isSuccessful) {

 								vidService.setModel(serviceModel);

-								

+

 								var subscriberId = FIELD.STATUS.NOT_FOUND;

 								var serviceType = FIELD.STATUS.NOT_FOUND;

-								

+

 								var serviceInstanceId = response.instanceId;

-								

+

 								for (var i = 0; i < response.control.length; i++) {

 									if (response.control[i].id == COMPONENT.SUBSCRIBER_NAME) {

 										subscriberId = response.control[i].value;

@@ -199,14 +232,13 @@
 										serviceType = response.control[i].value;

 									}

 								}

-								

-								

+

+

 								$scope.refreshSubs(subscriberId,serviceType,serviceInstanceId);

-							

+

 					    	}

 					    }

 					});

-					

 				}, function errorCallback(response) {

 					console.log("Error: " + response);

 				});

@@ -231,7 +263,7 @@
 			    callbackFunction : function(response) {

 			    }

 			});

-		}

+		};

 

 		$scope.refreshSubs = function(subscriberId, serviceType, serviceInstanceId) {

 			$scope.status = FIELD.STATUS.FETCHING_SUBSCRIBER_LIST_AAI;

@@ -243,7 +275,7 @@
 			}).then(function(response){

 				

 				if (response.data.status < 200 || response.data.status > 202) {

-					$scope.showError(FIELD.ERROR.MSO)

+					$scope.showError(FIELD.ERROR.MSO);

 					return;

 				}

 

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceProxyConfigController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceProxyConfigController.js
index 6e7ad50c..5d17faa9 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceProxyConfigController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/ServiceProxyConfigController.js
@@ -163,6 +163,9 @@ appDS2.controller("ServiceProxyConfigController", ["COMPONENT", "$log", "FIELD",
                             },
                             requestParams: function () {
                                 return requestParams;
+                            },
+                            configuration: function () {
+                                return null;
                             }
                         }
                     });
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/VidApp.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/VidApp.js
index 6129fd96..e30bd385 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/VidApp.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/VidApp.js
@@ -73,6 +73,14 @@
 		  controller: 'ServiceProxyConfigController',

 		  templateUrl: 'app/vid/scripts/view-models/serviceProxyConfig.htm'

 	    })

+	  .when('/servicePlanning', {

+		  controller: 'iframeController',

+		  templateUrl: 'app/vid/scripts/view-models/iframe.htm'

+	  })

+	    .when('/instantiationStatus', {

+	    	controller: 'iframeController',

+			templateUrl: 'app/vid/scripts/view-models/iframe.htm'

+	    })

         .otherwise({

         	redirectTo: '/models/services'

         });

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js
index aeac7f33..164c71c7 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/aaiSubscriberController.js
@@ -20,8 +20,8 @@
 

 "use strict";

 

-appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER", "DataService", "PropertyService", "$scope", "$http", "$timeout", "$location", "$log", "$route", "$uibModal", "VIDCONFIGURATION", "UtilityService", "vidService", "AaiService", "MsoService", "OwningEntityService", "$q",

-    function (COMPONENT, FIELD, PARAMETER, DataService, PropertyService, $scope, $http, $timeout, $location, $log, $route, $uibModal, VIDCONFIGURATION, UtilityService, vidService, AaiService, MsoService, OwningEntityService, $q) {

+appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER", "DataService", "PropertyService", "$scope", "$http", "$timeout", "$location", "$log", "$route", "$uibModal", "VIDCONFIGURATION", "UtilityService", "vidService", "AaiService", "MsoService", "OwningEntityService", "AsdcService","featureFlags", "$q", "_",

+    function (COMPONENT, FIELD, PARAMETER, DataService, PropertyService, $scope, $http, $timeout, $location, $log, $route, $uibModal, VIDCONFIGURATION, UtilityService, vidService, AaiService, MsoService, OwningEntityService, AsdcService, featureFlags, $q, _) {

 

         $scope.showVnfDetails = function (vnf) {

             console.log("showVnfDetails");

@@ -44,6 +44,8 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
         $scope.serviceTypes = [FIELD.PROMPT.SELECT_SERVICE, COMPONENT.UCPE_VMS, COMPONENT.SDN_L3_BONDING, COMPONENT.SDN_ETHERNET_INTERNET];

         $scope.defaultSubscriberName = [FIELD.PROMPT.SELECT_SUB];

 

+        $scope.verifyButtonEnabled = true;

+

         var callbackFunction = function (response) {

             alert(response);

         };

@@ -223,7 +225,8 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                     $scope.createType = "a la carte";

                     var broadcastType = "createComponent";

 

-                    if (UtilityService.arrayContains(VIDCONFIGURATION.MACRO_SERVICES, serviceModel.service.invariantUuid)) {

+                    if (AsdcService.isMacro(serviceModel)) {

+                        DataService.setShouldExcludeMacroFromAsyncInstatiationFlow(AsdcService.shouldExcludeMacroFromAsyncInstatiationFlow(serviceModel));

                         DataService.setALaCarte(false);

                         $scope.createType = "Macro";

                         var convertedAsdcModel = UtilityService.convertModel(serviceModel);

@@ -464,6 +467,61 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
             $scope.setProgress(2); // Show "a little" progress

         }

 

+        function getRelatedInstanceGroupsByVnfId(genericVnf) {

+            var model = vidService.getModel();

+            if (model && model.vnfs && !_.isEmpty(model.vnfs)) {

+                Object.keys(model.vnfs).forEach(function (key) {

+                    var vnf = model.vnfs[key];

+                    if (vnf.vfcInstanceGroups && !_.isEmpty(vnf.vfcInstanceGroups)) {

+                        if (vnf.uuid === genericVnf.modelVersionId) {

+                            AaiService.getInstanceGroupsByVNFInstanceId(genericVnf.nodeId,

+                                function (response) { //success

+                                    handleGetRelatedInstanceGroupsResponseForVnf(response, genericVnf);

+                                },

+                                function (response) { //failure

+                                    $scope.showError(FIELD.ERROR.AAI);

+                                    $scope.errorMsg = FIELD.ERROR.FETCHING_SERVICE_INSTANCE_DATA + response.status;

+                                    $scope.errorDetails = response.data;

+                                }

+                            )

+                        }

+                    }

+                })

+            }

+        }

+

+        function resolveModelDataIfMissing(modelVersionId) {

+            var model = vidService.getModel();

+            if (model && model.service && model.service.uuid === modelVersionId) {

+                return $q.resolve(); // no need to resolve anything

+            } else {

+                // resolve model and value of isPermitted

+                return resolveIfIsPermitted()

+                    .then(function() {

+                        return getAsdcModelByVersionId(modelVersionId);

+                    })

+            }

+        }

+

+        function resolveIfIsPermitted() {

+            var deferred = $q.defer();

+            AaiService.searchServiceInstances(

+                '?subscriberId=' + $location.search().subscriberId +

+                '&serviceInstanceIdentifier=' + $location.search().serviceInstanceId)

+                .then(function (response) {

+                    if (response.displayData && response.displayData.length) {

+                        var first = response.displayData[0];

+                        $scope.isPermitted = first.isPermitted;

+                        deferred.resolve(first.isPermitted);

+                    } else {

+                        deferred.reject("some error while resolveIfIsPermitted")

+                    }

+                });

+

+            return deferred.promise;

+        }

+

+

         $scope.getComponentList = function (event, request) {

 

             $scope.isSpinnerVisible = true;

@@ -484,34 +542,70 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
 

             //$scope.getAsdcModel($location.search().modelUuid);

 

-            $scope.namedQueryId = VIDCONFIGURATION.COMPONENT_LIST_NAMED_QUERY_ID;

-            $scope.status = FIELD.STATUS.FETCHING_SERVICE_INST_DATA + $scope.serviceInstanceId;

-

-            AaiService.runNamedQuery($scope.namedQueryId, $scope.globalCustomerId, $scope.serviceType, $scope.serviceInstanceId,

-                function (response) { //success

-                    $scope.handleInitialResponseInventoryItems(response);

-                    $scope.setProgress(100); // done

-                    $scope.status = FIELD.STATUS.DONE;

-                    $scope.isSpinnerVisible = false;

-                },

-                function (response) { //failure

-                    $scope.showError(FIELD.ERROR.AAI);

-                    $scope.errorMsg = FIELD.ERROR.FETCHING_SERVICE_INSTANCE_DATA + response.status;

-                    $scope.errorDetails = response.data;

-                }

-            );

-

-        }

+            return getModelVersionIdForServiceInstance({

+                globalCustomerId: $location.search().subscriberId,

+                serviceInstanceId: $location.search().serviceInstanceId,

+                aaiModelVersionId: $location.search().aaiModelVersionId

+            })

+                .then(resolveModelDataIfMissing)

+                .then($scope.prepareScopeWithModel)

+                .then(function () {

+

+                    $scope.namedQueryId = VIDCONFIGURATION.COMPONENT_LIST_NAMED_QUERY_ID;

+                    $scope.status = FIELD.STATUS.FETCHING_SERVICE_INST_DATA + $scope.serviceInstanceId;

+

+                    return AaiService.runNamedQuery($scope.namedQueryId, $scope.globalCustomerId, $scope.serviceType, $scope.serviceInstanceId,

+                        function (response) { //success

+                            $scope.handleInitialResponseInventoryItems(response);

+                            $scope.setProgress(100); // done

+                            $scope.status = FIELD.STATUS.DONE;

+                            $scope.isSpinnerVisible = false;

+                            //TODO

+                        },

+                        function (response) { //failure

+                            $scope.showError(FIELD.ERROR.AAI);

+                            $scope.errorMsg = FIELD.ERROR.FETCHING_SERVICE_INSTANCE_DATA + response.status;

+                            $scope.errorDetails = response.data;

+                        }

+                    )

+                })

+        };

 

         $scope.handleServerError = function (response, status) {

             alert(response.statusText);

         }

 

+        function handleGetRelatedInstanceGroupsResponseForVnf(response, genericVnf) {

+            _.forEach(response.data, function (instanceGroup) {

+                var newInstanceGroup = {

+                    name: instanceGroup.name,

+                    type: instanceGroup.type

+                };

+                genericVnf.instanceGroups.push(newInstanceGroup);

+            })

+        }

+

+

+

         function getModelVersionIdForServiceInstance(instance) {

             if (UtilityService.hasContents(instance.aaiModelVersionId)) {

                 return $q.resolve(instance.aaiModelVersionId);

+            } else if ($scope.modelVersionIdForServiceInstance

+                && $scope.modelVersionIdForServiceInstance.globalCustomerId === instance.globalCustomerId

+                && $scope.modelVersionIdForServiceInstance.serviceInstanceId === instance.serviceInstanceId

+            ) {

+                return $q.resolve($scope.modelVersionIdForServiceInstance.aaiModelVersionId);

             } else {

-                return AaiService.getModelVersionId(instance.globalCustomerId, instance.serviceInstanceId);

+                $scope.status = FIELD.STATUS.FETCHING_SERVICE_INST_DATA + $scope.serviceInstanceId;

+                return AaiService.getModelVersionId(instance.globalCustomerId, instance.serviceInstanceId)

+                    .then(function (aaiModelVersionId) {

+                        $scope.modelVersionIdForServiceInstance = {

+                            globalCustomerId: instance.globalCustomerId,

+                            serviceInstanceId: instance.serviceInstanceId,

+                            aaiModelVersionId: aaiModelVersionId

+                        };

+                        return $q.resolve(aaiModelVersionId);

+                    });

             }

         }

 

@@ -529,6 +623,7 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                     COMPONENT.SUBSCRIBERNAME_SUB_PATH + disData.subscriberName +

                     COMPONENT.SERVICETYPE_SUB_PATH + disData.serviceType +

                     COMPONENT.SERVICEINSTANCEID_SUB_PATH + disData.serviceInstanceId +

+                    COMPONENT.MODELVERSIONID_SUB_PATH + disData.aaiModelVersionId +

                     COMPONENT.IS_PERMITTED_SUB_PATH + disData.isPermitted;

             }

         };

@@ -547,13 +642,22 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                 method: 'GET',

                 url: pathQuery

             }).then(function successCallback(response) {

-                vidService.setModel(response.data);

-                console.log("aaiSubscriber getAsdcModel DONE!!!!");

-            }, function errorCallback(response) {

+                if (response.headers()['content-type'].includes('json')) {

+                    vidService.setModel(response.data);

+                    console.log("aaiSubscriber getAsdcModel DONE!!!!");

+                } else {

+                    // the response is erroneous

+                    console.log("aaiSubscriber getAsdcModel BAD RESPONSE");

+                    errorCallback(response);

+                    return $q.reject()

+                }

+            }, errorCallback);

+

+            function errorCallback(response) {

                 $log.error("aaiSubscriber getAsdcModel - " + FIELD.ERROR.NO_MATCHING_MODEL_AAI + aaiModelVersionId);

                 $scope.errorMsg = FIELD.ERROR.NO_MATCHING_MODEL_AAI + aaiModelVersionId;

                 alert($scope.errorMsg);

-            });

+            }

         }

 

         function returnMatchingServiceSubscription(serviceSubs, serviceId){

@@ -580,15 +684,20 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                 });

         }

 

+        $scope.isConfigurationDataAvailiable = function (configuration) {

+            $log.debug(configuration);

+            return configuration.configData && (!configuration.configData.errorDescription);

+        }

+

         $scope.isActivateDeactivateEnabled = function(btnType) {

-            if ($scope.serviceOrchestrationStatus && $scope.service.model.service.serviceType.toLowerCase().indexOf('transport') != -1) {

+            if ($scope.serviceOrchestrationStatus) {

+                var status = $scope.serviceOrchestrationStatus.toLowerCase();

                 switch (btnType) {

                     case "activate":

-                        return $scope.serviceOrchestrationStatus === 'Created' ||

-                            $scope.serviceOrchestrationStatus.toLowerCase() === 'pendingdelete' || $scope.serviceOrchestrationStatus.toLowerCase() === 'pending-delete';

+                        return _.includes(COMPONENT.ACTIVATE_SERVICE_STATUSES, status);

                         break;

                     case "deactivate":

-                        return $scope.serviceOrchestrationStatus === 'Active';

+                        return status === 'active';

                         break;

                 }

             }

@@ -596,6 +705,58 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
             return false;

         };

 

+        $scope.isShowVerifyService = function () {

+            return featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_SHOW_VERIFY_SERVICE);

+        }

+

+        $scope.isEnableVerifyService = function () {

+            //Button should only be enabled when the service type is A la carte

+            if (DataService.getALaCarte()) {

+                return $scope.verifyButtonEnabled;

+            }

+            return false;

+        };

+

+        $scope.activateVerifyService = function () {

+            $scope.verifyButtonEnabled = false;

+            let url = COMPONENT.VERIFY_SERVICE_URL;

+

+            let config = {

+                headers: {

+                    'Content-Type': 'application/json'

+                }

+            };

+

+            let data = {

+                "serviceInstanceList": [

+                    {

+                        "serviceInstanceId": $scope.serviceInstanceId,

+                        "modelVersionId": $scope.service.model.service.uuid,

+                        "modelInvariantId": $scope.service.model.service.invariantUuid,

+                        "customerId": $scope.globalCustomerId,

+                        "serviceType": $scope.service.instance.serviceType,

+                    }

+                ]

+            };

+            AaiService.postPOMBAverificationRequest(url, data, config);

+

+        };

+

+        $scope.isShowAssignmentsEnabled = function () {

+            if (featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_SHOW_ASSIGNMENTS)) {

+                if ($scope.serviceOrchestrationStatus) {

+                    return $scope.serviceOrchestrationStatus.toLowerCase() === 'assigned';

+                }

+            }

+            return false;

+        };

+

+        $scope.isResumeShown = function (status) {

+            var vfModuleStatus = status.toLowerCase();

+            var serviceStatus = $scope.serviceOrchestrationStatus && $scope.serviceOrchestrationStatus.toLowerCase();

+            return _.includes(['pendingactivation', 'assigned'], vfModuleStatus) && !$scope.isActivateDeactivateEnabled("activate");

+        };

+

         $scope.handleInitialResponseInventoryItems = function (response) {

 

             $scope.inventoryResponseItemList = response.data[FIELD.ID.INVENTORY_RESPONSE_ITEM]; // get data from json

@@ -642,6 +803,7 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                         "configurations": []

                     };

 

+                    var portMirroringConfigurationIds = [];

                     if (inventoryResponseItem[FIELD.ID.INVENTORY_RESPONSE_ITEMS] != null) {

 

                         angular.forEach(inventoryResponseItem[FIELD.ID.INVENTORY_RESPONSE_ITEMS][FIELD.ID.INVENTORY_RESPONSE_ITEM], function (subInventoryResponseItem, key) {

@@ -693,12 +855,23 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                                     "nodeType": genericVnfObject[FIELD.ID.VNF_TYPE],

                                     "nodeId": genericVnfObject[FIELD.ID.VNF_ID],

                                     "nodeStatus": genericVnfObject[FIELD.ID.ORCHESTRATION_STATUS],

+                                    "modelVersionId" : genericVnfObject[FIELD.ID.MODEL_VERSION_ID],

                                     "object": genericVnfObject,

                                     "vfModules": [],

                                     "volumeGroups": [],

+                                    "instanceGroups": [],

                                     "availableVolumeGroups": []

                                 };

+                                if (featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_VLAN_TAGGING_VIEW_EDIT)) {

+

+                                    //TODO should be changed after integration

+                                    genericVnf["instanceGroups"] = [{"name":"a2"}];

+

+                                }

                                 $scope.service.instance[FIELD.ID.VNFS].push(genericVnf);

+                                getRelatedInstanceGroupsByVnfId(genericVnf);

+

+

 

                                 // look for volume-groups

                                 if (subInventoryResponseItem[FIELD.ID.INVENTORY_RESPONSE_ITEMS] != null) {

@@ -787,6 +960,7 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                                 }

                             }

 

+

                             if (subInventoryResponseItem[FIELD.ID.GENERIC_CONFIGURATION] != null) {

                                 var configObject = subInventoryResponseItem[FIELD.ID.GENERIC_CONFIGURATION];

                                 var config = {

@@ -800,36 +974,60 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                                     "modelVersionId": configObject[FIELD.ID.MODEL_VERSION_ID],

                                     "modelCustomizationId": configObject[FIELD.ID.MODEL_CUSTOMIZATION_ID],

                                     "object": configObject,

-                                    "ports": []

+                                    "ports": [],

+                                    "configData" : null

                                 };

+                                portMirroringConfigurationIds.push(configObject[FIELD.ID.CONFIGURATION_ID]);

 

                                 $scope.allowConfigurationActions = [FIELD.STATUS.AAI_ACTIVE, FIELD.STATUS.AAI_INACTIVE, FIELD.STATUS.AAI_CREATED].indexOf(config.nodeStatus) != -1;

 

-                                if (subInventoryResponseItem[FIELD.ID.INVENTORY_RESPONSE_ITEMS] != null) {

-                                    angular.forEach(subInventoryResponseItem[FIELD.ID.INVENTORY_RESPONSE_ITEMS][FIELD.ID.INVENTORY_RESPONSE_ITEM], function (subSubInventoryResponseItem, key) {

-                                        var port = {};

-                                        var portObject;

-                                        if (subSubInventoryResponseItem[FIELD.ID.PORT] != null) {

-                                            portObject = subSubInventoryResponseItem[FIELD.ID.PORT];

-                                            port = {

-                                                "portId": portObject[FIELD.ID.PORT_ID],

-                                                "portName": portObject[FIELD.ID.PORT_NAME],

-                                                "portStatus": portObject[FIELD.ID.PORT_MIRRORED] === true ? FIELD.STATUS.AAI_ENABLED : FIELD.ID.AAI_DISABLED,

-                                                "object": portObject

-                                            };

-                                            config.ports.push(port);

-                                        }

-                                    });

-                                }

                                 $scope.service.instance[FIELD.ID.CONFIGURATIONS].push(config);

                             }

 

                         });

+

+                        AaiService.getPortMirroringData(portMirroringConfigurationIds).then(function(result){

+                           angular.forEach($scope.service.instance[FIELD.ID.CONFIGURATIONS], function(config){

+                                config['configData'] = result.data[config['nodeId']]

+

+                               if (config.configData && config.configData.errorDescription) {

+                                   $scope.errorMsg = ($scope.errorMsg ? $scope.errorMsg + "\n" : "") +

+                                       "Cannot read cloud-region for configuration \"" + config.name + "\": " +

+                                       config.configData.errorDescription;

+                               }

+                           });

+                        });

+

+                        AaiService.getPortMirroringSourcePorts(portMirroringConfigurationIds).then(function(result){

+                           angular.forEach($scope.service.instance[FIELD.ID.CONFIGURATIONS], function(config){

+                                angular.forEach(result.data[config['nodeId']], function(port){

+                                   if (port.errorDescription) {

+                                       $scope.errorMsg = ($scope.errorMsg ? $scope.errorMsg + "\n" : "") +

+                                           "Cannot read a source port for configuration \"" + config.name + "\": " +

+                                           port.errorDescription;

+                                   } else {

+                                       config.ports.push({

+                                           "portId": port[FIELD.ID.PORT_ID],

+                                           "portName": port[FIELD.ID.PORT_NAME],

+                                           "portStatus": port[FIELD.ID.PORT_MIRRORED] === true ? FIELD.STATUS.AAI_ENABLED : FIELD.STATUS.AAI_DISABLED

+                                       });

+                                   }

+                               });

+                           });

+                        });

+

                     }

                 });

+

             });

+

+

+

         }

 

+

+

+

         $scope.handleInitialResponse = function (response) {

             try {

                 $scope.enableCloseButton(true);

@@ -977,7 +1175,7 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                 });

         };

 

-        var activateDeactivateServiceInstance = function(msoType) {

+        var activateDeactivateServiceInstance = function (msoType) {

             var requestParams = {

                 model: $scope.service.model,

                 instance: $scope.service.instance

@@ -997,73 +1195,111 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
             }

         };

 

-        $scope.activateMSOInstance = function() {

+        $scope.showAssignmentsSDNC = function () {

+

+            if ($scope.service && $scope.service.instance) {

+                return VIDCONFIGURATION.SDNC_SHOW_ASSIGNMENTS_URL.replace("<SERVICE_INSTANCE_ID>" , $scope.service.instance.id);

+            }

+            return null;

+        };

+

+        $scope.activateMSOInstance = function () {

 

             activateDeactivateServiceInstance(COMPONENT.MSO_ACTIVATE_SERVICE_REQ);

         };

 

-        $scope.deactivateMSOInstance = function() {

+        $scope.deactivateMSOInstance = function () {

 

             activateDeactivateServiceInstance(COMPONENT.MSO_DEACTIVATE_SERVICE_REQ);

         };

 

-        $scope.toggleConfigurationStatus = function (serviceObject, configuration) {

-

 

+        $scope.deleteConfiguration = function (serviceObject, configuration) {

             AaiService.getLoggedInUserID(function (response) {

-                    DataService.setLoggedInUserId(response.data);

-                    var requestParams = {

-                        serviceModel: {

-                            "modelType": "service",

-                            "modelInvariantId": serviceObject.model.service.invariantUuid,

-                            "modelVersionId": "uuid",

-                            "modelName": serviceObject.model.service.name,

-                            "modelVersion": serviceObject.model.service.version

-                        },

-                        configurationModel: {

-                            "modelType": "configuration",

-                            "modelInvariantId": configuration.modelInvariantId,

-                            "modelVersionId": configuration.modelVersionId,

-                            "modelCustomizationId": configuration.modelCustomizationId

-                        },

-                        serviceInstanceId: serviceObject.instance.serviceInstanceId,

-                        configurationId: configuration.nodeId,

-                        configStatus: configuration.nodeStatus,

-                        userId: DataService.getLoggedInUserId()

-                    };

+                DataService.setLoggedInUserId(response.data);

+                var requestParams = {

+                    serviceModel: {

+                        "modelType": "configuration",

+                        "modelInvariantId": serviceObject.model.service.invariantUuid,

+                        "modelVersionId": serviceObject.model.service.uuid,

+                        "modelName": serviceObject.model.service.name,

+                        "modelVersion": serviceObject.model.service.version

+                    },

+                    configurationModel: {

+                        "modelType": "configuration",

+                        "modelInvariantId": configuration.modelInvariantId,

+                        "modelVersionId": configuration.modelVersionId,

+                        "modelCustomizationId": configuration.modelCustomizationId

+                    },

+                    serviceInstanceId: serviceObject.instance.serviceInstanceId,

+                    configurationId: configuration.nodeId,

+                    configStatus: configuration.DELETE,

+                    userId: DataService.getLoggedInUserId()

+                };

 

-                    openMsoModal(COMPONENT.MSO_CHANGE_CONFIG_STATUS_REQ, requestParams);

-             });

+                openMsoModal(COMPONENT.MSO_DELETE_CONFIGURATION_REQ, requestParams, configuration);

+            });

 

         };

 

-        $scope.togglePortStatus = function(serviceObject, configuration, port) {

+        $scope.toggleConfigurationStatus = function (serviceObject, configuration) {

+            AaiService.getLoggedInUserID(function (response) {

+                DataService.setLoggedInUserId(response.data);

+                var requestParams = {

+                    serviceModel: {

+                        "modelType": "service",

+                        "modelInvariantId": serviceObject.model.service.invariantUuid,

+                        "modelVersionId": serviceObject.model.service.uuid,

+                        "modelName": serviceObject.model.service.name,

+                        "modelVersion": serviceObject.model.service.version

+                    },

+                    configurationModel: {

+                        "modelType": "configuration",

+                        "modelInvariantId": configuration.modelInvariantId,

+                        "modelVersionId": configuration.modelVersionId,

+                        "modelCustomizationId": configuration.modelCustomizationId

+                    },

+                    serviceInstanceId: serviceObject.instance.serviceInstanceId,

+                    configurationId: configuration.nodeId,

+                    configStatus: configuration.nodeStatus,

+                    userId: DataService.getLoggedInUserId()

+                };

+

+                openMsoModal(COMPONENT.MSO_CHANGE_CONFIG_STATUS_REQ, requestParams, configuration);

+            });

 

-            var requestParams = {

-                serviceInstanceId: serviceObject.instance.serviceInstanceId,

-                configurationId: configuration.nodeId,

-                portId: port.portId,

-                portStatus: port.portStatus,

-                serviceModel: {

-                    "modelType": "service",

-                    "modelInvariantId": serviceObject.model.service.invariantUuid,

-                    "modelVersionId": "uuid",

-                    "modelName": serviceObject.model.service.name,

-                    "modelVersion": serviceObject.model.service.version

-                },

-                configurationModel: {

-                    "modelType": "configuration",

-                    "modelInvariantId": configuration.modelInvariantId,

-                    "modelVersionId": configuration.modelVersionId,

-                    "modelCustomizationId": configuration.modelCustomizationId

-                },

-                userId: DataService.getLoggedInUserId()

-            };

+        };

 

-            openMsoModal(COMPONENT.MSO_CHANGE_PORT_STATUS_REQ, requestParams);

+        $scope.togglePortStatus = function (serviceObject, configuration, port) {

+            AaiService.getLoggedInUserID(function (response) {

+                DataService.setLoggedInUserId(response.data);

+

+                var requestParams = {

+                    serviceInstanceId: serviceObject.instance.serviceInstanceId,

+                    configurationId: configuration.nodeId,

+                    portId: port.portId,

+                    portStatus: port.portStatus,

+                    serviceModel: {

+                        "modelType": "service",

+                        "modelInvariantId": serviceObject.model.service.invariantUuid,

+                        "modelVersionId": serviceObject.model.service.uuid,

+                        "modelName": serviceObject.model.service.name,

+                        "modelVersion": serviceObject.model.service.version

+                    },

+                    configurationModel: {

+                        "modelType": "configuration",

+                        "modelInvariantId": configuration.modelInvariantId,

+                        "modelVersionId": configuration.modelVersionId,

+                        "modelCustomizationId": configuration.modelCustomizationId

+                    },

+                    userId: DataService.getLoggedInUserId()

+                };

+

+                openMsoModal(COMPONENT.MSO_CHANGE_PORT_STATUS_REQ, requestParams, configuration);

+            });

         };

 

-        $scope.dissociatePnf = function(pnfName) {

+        $scope.dissociatePnf = function (pnfName) {

 

             var jobInfo = {

                 status: "confirm",

@@ -1098,12 +1334,14 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                     };

 

                     if (DataService.getLoggedInUserId()) {

+                        requestParams.userId = DataService.getLoggedInUserId();

                         requestParams.attuuid = DataService.getLoggedInUserId();

                         openMsoModal(COMPONENT.MSO_REMOVE_RELATIONSHIP, requestParams);

                     } else {

                         AaiService.getLoggedInUserID(function (response) {

                             DataService.setLoggedInUserId(response.data);

 

+                            requestParams.userId = response.data;

                             requestParams.attuuid = response.data;

                             openMsoModal(COMPONENT.MSO_REMOVE_RELATIONSHIP, requestParams);

                         });

@@ -1114,35 +1352,38 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
 

         };

 

-        var openMsoModal = function (msoType, requestParams) {

+        var openMsoModal = function (msoType, requestParams, configuration) {

             var modalInstance = $uibModal.open({

                 templateUrl: 'app/vid/scripts/modals/mso-commit/mso-commit.html',

-                controller : "msoCommitModalController",

+                controller: "msoCommitModalController",

                 backdrop: false,

                 resolve: {

                     msoType: function () {

                         return msoType;

                     },

-                    requestParams: function() {

+                    requestParams: function () {

                         requestParams.callbackFunction = updateViewCallbackFunction;

                         return requestParams;

+                    },

+                    configuration: function () {

+                        return configuration;

                     }

                 }

             });

         };

 

-        var updateViewCallbackFunction = function(response) {

+        var updateViewCallbackFunction = function (response) {

             $scope.callbackResults = "";

             var color = FIELD.ID.COLOR_NONE;

             $scope.callbackStyle = {

-                "background-color" : color

+                "background-color": color

             };

 

             /*

              * This 1/2 delay was only added to visually highlight the status

              * change. Probably not needed in the real application code.

              */

-            $timeout(function() {

+            $timeout(function () {

                 $scope.callbackResults = UtilityService.getCurrentTime()

                     + FIELD.STATUS.IS_SUCCESSFUL + response.isSuccessful;

                 if (response.isSuccessful) {

@@ -1152,7 +1393,7 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                     color = FIELD.ID.COLOR_F88;

                 }

                 $scope.callbackStyle = {

-                    "background-color" : color

+                    "background-color": color

                 };

             }, 500);

         };

@@ -1198,7 +1439,8 @@ appDS2.controller("aaiSubscriberController", ["COMPONENT", "FIELD", "PARAMETER",
                     }

                 }

             };

-    }]).directive('restrictInput', function () {

+    }

+]).directive('restrictInput', function () {

 

     return {

 

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/change-management.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/change-management.controller.js
index 488ada69..e15ce5fd 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/change-management.controller.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/change-management.controller.js
@@ -8,6 +8,7 @@
 
         vm.lastTimeUpdated = "";
         vm.hasScheduler = !!VIDCONFIGURATION.SCHEDULER_PORTAL_URL;
+        vm.currModal = null;
 
         vm.init = function() {
             vm.lastTimeUpdated = $filter('date')(new Date(), "MM/dd/yyyy | HH:mm:ss");
@@ -15,11 +16,31 @@
             loadSchedulerChangeManagements();
         };
 
+        var fuseMsoAndSchedulerTaks = function() {
+            if (vm.changeManagements && vm.pendingChangeManagements) {
+                var requestIdToVnfName = {}
+                vm.pendingChangeManagements.forEach(function(schedulerItem) {
+                    if (schedulerItem.msoRequestId && schedulerItem.vnfName) {
+                        requestIdToVnfName[schedulerItem.msoRequestId] = schedulerItem.vnfName;
+                    }
+                })
+                $log.debug("requestIdToVnfName", requestIdToVnfName);
+
+                vm.changeManagements = vm.changeManagements.map(function(msoItem) {
+                    msoItem['vnfNameFromScheduler'] = requestIdToVnfName[msoItem.requestId];
+                    return msoItem;
+                })
+            }
+        };
+
         var loadMSOChangeManagements = function() {
             changeManagementService.getMSOChangeManagements()
                 .then(function(response) {
                     vm.changeManagements = response.data;
                 })
+                .then(function () {
+                    fuseMsoAndSchedulerTaks();
+                })
                 .catch(function (error) {
                     $log.error(error);
                 });
@@ -43,12 +64,16 @@
                         }
                     });
                 })
+                .then(function () {
+                    fuseMsoAndSchedulerTaks();
+                })
                 .catch(function(error) {
                     $log.error(error);
                 });
         };
 
         vm.createNewChange = function() {
+            vm.closeCurrentModalIfOpen();
             var modalInstance = $uibModal.open({
                 templateUrl: 'app/vid/scripts/modals/new-change-management/new-change-management.html',
                 controller: 'newChangeManagementModalController',
@@ -56,6 +81,8 @@
                 resolve: {}
             });
 
+            vm.currModal = modalInstance;
+
             modalInstance.result.then(function (result) {
                 console.log("This is the result of the new change management modal.", result);
             });
@@ -65,29 +92,18 @@
             console.log("function for searching changes: " + vm.searchChangesTerm)
         };
 
-        vm.openFailedModal = function(jobInfo) {
-            var modalInstance = $uibModal.open({
-                templateUrl: 'app/vid/scripts/modals/failed-change-management/failed-change-management.html',
-                controller: 'changeManagementManualTasksController',
-                controllerAs: 'vm',
-                resolve: {
-                    jobInfo: function () {
-                        return jobInfo;
-                    }
-                },
 
-            });
+        vm.openManualTasksPopup = function($event, jobInfo, templateUrl, message) {
 
-            modalInstance.result.then(function (result) {
-                console.log("This is the result of the failed change management modal.", result);
-            });
-        };
+            vm.closeCurrentModalIfOpen();
 
-        vm.openInProgressModal = function(jobInfo) {
             var modalInstance = $uibModal.open({
-                templateUrl: 'app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html',
+                templateUrl: templateUrl,
                 controller: 'changeManagementManualTasksController',
                 controllerAs: 'vm',
+                backdrop: false,
+                animation: true,
+                appendTo: angular.element($event.currentTarget).parent(),
                 resolve: {
                     jobInfo: function () {
                         return jobInfo;
@@ -96,31 +112,38 @@
             });
 
             modalInstance.result.then(function (result) {
-                console.log("This is the result of the in progress change management modal.", result);
+                console.log(message, result);
             });
+
+            vm.currModal = modalInstance;
         };
 
-        vm.openAlertModal = function(jobInfo) {
-            var modalInstance = $uibModal.open({
-                templateUrl: 'app/vid/scripts/modals/alert-change-management/alert-change-management.html',
-                controller: 'changeManagementManualTasksController',
-                controllerAs: 'vm',
-                resolve: {
-                    jobInfo: function () {
-                        return jobInfo;
-                    }
-                }
-            });
+        vm.openFailedModal = function($event, jobInfo) {
+            vm.openManualTasksPopup($event, jobInfo,
+                'app/vid/scripts/modals/failed-change-management/failed-change-management.html',
+                "This is the result of the failed change management modal.")
+        };
 
-            modalInstance.result.then(function (result) {
-                console.log("This is the result of the alert change management modal.", result);
-            });
+        vm.openInProgressModal = function($event, jobInfo) {
+            vm.openManualTasksPopup($event, jobInfo,
+                'app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html',
+                "This is the result of the in progress change management modal.")
+        };
+
+        vm.openAlertModal = function($event, jobInfo) {
+            vm.openManualTasksPopup($event, jobInfo,
+                'app/vid/scripts/modals/alert-change-management/alert-change-management.html',
+                "This is the result of the alert change management modal.")
         };
+
         vm.openBasicAlertModal = function(jobInfo) {
+            vm.closeCurrentModalIfOpen();
             var modalInstance = $uibModal.open({
                 templateUrl: 'app/vid/scripts/modals/alert-modal/alert-modal.html',
                 controller: 'alertModalController',
                 controllerAs: 'vm',
+                backdrop: false,
+                animation: true,
                 appendTo: angular.element(".jobs-table").eq(0),
                 resolve: {
                     jobInfo: function () {
@@ -128,12 +151,16 @@
                     }
                 }
             });
+            vm.currModal = modalInstance;
 
             modalInstance.result.then(function (result) {
                 console.log("This is the result of the alert change management modal.", result);
             });
         };
         vm.openPendingModal = function($event, changeManagement) {
+
+            vm.closeCurrentModalIfOpen();
+
             var modalInstance = $uibModal.open({
                 templateUrl: 'app/vid/scripts/modals/cancel-pending-workflow/cancel-pending-workflow.html',
                 controller: 'cancelPendingWorkflowController',
@@ -148,6 +175,8 @@
                 }
             });
 
+            vm.currModal = modalInstance;
+
             modalInstance.result.then(function (result) {
                 // send to service
              if(result){
@@ -173,6 +202,16 @@
             }});
 
         };
+        vm.isChangeManagementDeleted = function(changeManagement) {
+            return changeManagement.scheduleRequest.status!=='Deleted'
+        };
+
+        vm.closeCurrentModalIfOpen = function() {
+            if (vm.currModal != null) {
+                vm.currModal.close();
+                vm.currModal = null;
+            }
+        }
 
 
         vm.init();
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js
index 3d8cba5c..e8fa529f 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/creationDialogController.js
@@ -20,331 +20,357 @@
 

 "use strict";

 

-var creationDialogController = function( COMPONENT, FIELD, PARAMETER, $scope, $http, $timeout, $log,

-		CreationService, UtilityService, DataService,VIDCONFIGURATION) {

-

-	$scope.isDialogVisible = false;

-	$scope.summaryControl = {};

-	$scope.userProvidedControl = {};

-

-	var callbackFunction = undefined;

-	var componentId = undefined;

-

-	$scope.$on(COMPONENT.CREATE_COMPONENT, function(event, request) {

-

-		$scope.isSpinnerVisible = true;

-		$scope.isErrorVisible = false;

-		$scope.isDataVisible = false;

-		$scope.isConfirmEnabled = false;

-		$scope.isDialogVisible = true;

-		$scope.popup.isVisible = true;

-

-		callbackFunction = request.callbackFunction;

-		componentId = request.componentId;

-		CreationService.initializeComponent(request.componentId);

-

-		CreationService.setHttpErrorHandler(function(response) {

-			showError(FIELD.ERROR.SYSTEM_FAILURE, UtilityService

-					.getHttpErrorMessage(response));

-		});

-

-		$scope.componentName = CreationService.getComponentDisplayName();

-

-		CreationService.getParameters(handleGetParametersResponse);

-

-	});

-

-	var handleGetParametersResponse = function(parameters) {

-		$scope.summaryControl.setList(parameters.summaryList);

-		$scope.userProvidedControl.setList(parameters.userProvidedList);

-

-		$scope.isSpinnerVisible = false;

-		$scope.isDataVisible = true;

-		$scope.isConfirmEnabled = true;

-	};

-	

-	var validateInstanceName = function(iname) {

-		var patt1 = /^([a-z])+([0-9a-z\-_\.]*)$/i;

-		

-		if ( iname == null ){

-			return false;

-		}

-		if ( !iname.match(patt1) ) {

-			return false;

-		}

-		return true;

-	};

-	var validateMap = function(mname) {

-		var patt1 = /^{(\s*\w+\s*:\s*\w+\s*)(\s*,\s*\w+\s*:\s*\w+\s*)*}$/im;

-		if ( mname == null ){

-			return true;

-		}

-		if ( !mname.match(patt1) ) {

-			return false;

-		}

-		return true;

-	};

-	

-	var validateList = function(lname) {

-		var patt1 = /^\[(\s*\w+\s*)(\s*,\s*\w+\s*)*\]$/i;

-		if ( lname == null ){

-			return true;

-		}

-		if ( !lname.match(patt1) ) {

-			return false;

-		}

-		return true;

-	};

-		

-	$scope.userParameterChanged = function(id) {

-		CreationService.updateUserParameterList(id, $scope.userProvidedControl);

-	}

-

-	$scope.confirm = function() {

-

-		var requiredFields = $scope.userProvidedControl.getRequiredFields();

-		if (requiredFields !== "") {

-			showError(FIELD.ERROR.MISSING_DATA, requiredFields);

-			return;

-		}

-		

-		var isUploadAvailable = false;

-		var uploadIndex =0;

-		var paramList = $scope.userProvidedControl.getList();

-		var isAnyError = false;

-		for (var i = 0; i < paramList.length; i++) {

-			if (paramList[i].id === FIELD.ID.SUPPLEMENTORY_DATA_FILE) {

-				isUploadAvailable = true;

-				uploadIndex=i;

-			}

-			if (paramList[i].id === FIELD.ID.UPLOAD_SUPPLEMENTORY_DATA_FILE && paramList[i].value && document.getElementById(FIELD.ID.SUPPLEMENTORY_DATA_FILE).value=='' ) {

-				isAnyError = true;

-			}

-		}

-		

-		if(isUploadAvailable && isAnyError ){

-			showError(FIELD.ERROR.MISSING_DATA, FIELD.ERROR.MISSING_FILE);

-			return;

-		}else if(isUploadAvailable && document.getElementById(FIELD.ID.SUPPLEMENTORY_DATA_FILE).value!='' ){

-			var errorMsg = "";

-			var fileInput = document.getElementById(FIELD.ID.SUPPLEMENTORY_DATA_FILE);

-			var file = fileInput.files[0];

-			var reader = new FileReader();

-			reader.onload = function(e) {

-				try{

-					paramList[uploadIndex].value = JSON.parse(reader.result);

-					FIELD.PARAMETER.SUPPLEMENTORY_DATA_FILE['value'] = paramList[uploadIndex].value;

-					

-					var instanceName = "";

-

-					if ( DataService.getALaCarte() ) {

-						if ( paramList != null ) {

-							for (var i = 0; i < paramList.length; i++) {

-								if (paramList[i].id === FIELD.ID.INSTANCE_NAME) {

-									instanceName = paramList[i].value;

-									break;

-								}

-							}

-						}

-						var isValid = validateInstanceName (instanceName);

-						if ( isValid ) {

-							$scope.isErrorVisible = false;

-						} else {

-							showError(FIELD.ERROR.INVALID_INSTANCE_NAME + instanceName, 

-									FIELD.ERROR.INSTANCE_NAME_VALIDATE);

-							return;

-						}

-					}

-					var arbitraryParametersList = DataService.getArbitraryParameters();

-					var p = null;

-					if (UtilityService.hasContents (arbitraryParametersList)) {

-						for (var i = 0; i < arbitraryParametersList.length; i++) {

-							p = arbitraryParametersList[i];

-							if (p.type === PARAMETER.MAP) {

-								//validate a map: { <entry_key_1>: <entry_value_1>, ... , <entry_key_n>: <entry_value_n> }

-								// need to find the value in paramList

-								for (var j = 0; j < paramList.length; j++) {

-									if (paramList[j].id === p.id) {

-										p.value = paramList[j].value;

-										var isValid = validateMap (p.value);

-										if ( isValid ) {

-											$scope.isErrorVisible = false;

-											break;

-										} 

-										else {

-											showError(FIELD.ERROR.INVALID_MAP + p.id, 

-													FIELD.ERROR.MAP_VALIDATE);

-											return;

-										}	

-									}

-								}

-							} else if (p.type === PARAMETER.LIST) {

-								//validate a list: { value or a list of comma separated values }

-								// need to find the value in paramList

-								for (var j = 0; j < paramList.length; j++) {

-									if (paramList[j].id === p.id) {

-										p.value = paramList[j].value;

-										var isValid = validateList (p.value);

-										if ( isValid ) {

-											$scope.isErrorVisible = false;

-											break;

-										} 

-										else {

-											showError(FIELD.ERROR.INVALID_LIST + p.id, 

-													FIELD.ERROR.LIST_VALIDATE);

-											return;

-										}	

-									}

-								}

-							}

-						}

-					}

-					var requestDetails = CreationService

-							.getMsoRequestDetails($scope.userProvidedControl.getList());

-

-					$scope.isDialogVisible = false;

-

-					$scope.$broadcast(COMPONENT.MSO_CREATE_REQ, {

-						url : CreationService.getMsoUrl(),

-						requestDetails : requestDetails,

-						componentId: componentId,

-						callbackFunction : function(response) {

-							if (response.isSuccessful) {

-								$scope.popup.isVisible = false;

-								runCallback(response);

-							} else {

-								$scope.isDialogVisible = false;

-								$scope.popup.isVisible = false;

-							}

-						}

-					});

-					

-				}catch(e){

-				errorMsg = errorMsg+ FIELD.ERROR.INVALID_DATA_FORMAT;

-			}

-			if (errorMsg !== "") {

-				showError(FIELD.ERROR.SYSTEM_FAILURE, errorMsg);

-				return;

-			}

-			}

-			reader.readAsText(file);

-		}else{

-	

-			var paramList = $scope.userProvidedControl.getList();

-			var instanceName = "";

-

-			if ( DataService.getALaCarte() ) {

-				if ( paramList != null ) {

-					for (var i = 0; i < paramList.length; i++) {

-						if (paramList[i].id === FIELD.ID.INSTANCE_NAME) {

-							instanceName = paramList[i].value;

-							break;

-						}

-					}

-				}

-				var isValid = validateInstanceName (instanceName);

-				if ( isValid ) {

-					$scope.isErrorVisible = false;

-				} else {

-					showError(FIELD.ERROR.INVALID_INSTANCE_NAME + instanceName, 

-							FIELD.ERROR.INSTANCE_NAME_VALIDATE);

-					return;

-				}

-			}

-			var arbitraryParametersList = DataService.getArbitraryParameters();

-			var p = null;

-			if (UtilityService.hasContents (arbitraryParametersList)) {

-				for (var i = 0; i < arbitraryParametersList.length; i++) {

-					p = arbitraryParametersList[i];

-					if (p.type === PARAMETER.MAP) {

-						//validate a map: { <entry_key_1>: <entry_value_1>, ... , <entry_key_n>: <entry_value_n> }

-						// need to find the value in paramList

-						for (var j = 0; j < paramList.length; j++) {

-							if (paramList[j].id === p.id) {

-								p.value = paramList[j].value;

-								var isValid = validateMap (p.value);

-								if ( isValid ) {

-									$scope.isErrorVisible = false;

-									break;

-								} 

-								else {

-									showError(FIELD.ERROR.INVALID_MAP + p.id, 

-											FIELD.ERROR.MAP_VALIDATE);

-									return;

-								}	

-							}

-						}

-					} else if (p.type === PARAMETER.LIST) {

-						//validate a list: { value or a list of comma separated values }

-						// need to find the value in paramList

-						for (var j = 0; j < paramList.length; j++) {

-							if (paramList[j].id === p.id) {

-								p.value = paramList[j].value;

-								var isValid = validateList (p.value);

-								if ( isValid ) {

-									$scope.isErrorVisible = false;

-									break;

-								} 

-								else {

-									showError(FIELD.ERROR.INVALID_LIST + p.id, 

-											FIELD.ERROR.LIST_VALIDATE);

-									return;

-								}	

-							}

-						}

-					}

-				}

-			}

-			var requestDetails = CreationService

-					.getMsoRequestDetails($scope.userProvidedControl.getList());

-

-			$scope.isDialogVisible = false;

-

-			$scope.$broadcast(COMPONENT.MSO_CREATE_REQ, {

-				url : CreationService.getMsoUrl(),

-				requestDetails : requestDetails,

-				componentId: componentId,

-				callbackFunction : function(response) {

-					if (response.isSuccessful) {

-						$scope.popup.isVisible = false;

-						runCallback(response);

-					} else {

-						$scope.isDialogVisible = false;

-						$scope.popup.isVisible = false;

-					}

-				}

-			});

-		}

-	}

-

-	$scope.cancel = function() {

-		$scope.isDialogVisible = false;

-		$scope.popup.isVisible = false;

-		runCallback(false);

-	}

-

-	var runCallback = function(response) {

-		if (angular.isFunction(callbackFunction)) {

-			callbackFunction({

-				isSuccessful : response.isSuccessful,

-				control : $scope.userProvidedControl.getList(),

-				instanceId : response.instanceId

-			});

-		}

-	}

-

-	var showError = function(summary, details) {

-		var message = summary;

-		if (UtilityService.hasContents(details)) {

-			message += " (" + details + ")";

-		}

-		$scope.isSpinnerVisible = false;

-		$scope.isErrorVisible = true;

-		$scope.error = message;

-	}

-	

-}

-

-appDS2.controller("creationDialogController", [ "COMPONENT", "FIELD", "PARAMETER", "$scope", "$http",

-				"$timeout", "$log", "CreationService", "UtilityService", "DataService","VIDCONFIGURATION",

-				creationDialogController ]);

+var creationDialogController = function (COMPONENT, FIELD, PARAMETER, $scope, $http, $timeout, $log,

+                                         CreationService, UtilityService, DataService, VIDCONFIGURATION, $location) {

+

+    $scope.isDialogVisible = false;

+    $scope.summaryControl = {};

+    $scope.userProvidedControl = {};

+

+    var callbackFunction = undefined;

+    var componentId = undefined;

+

+    $scope.shouldShowOldPopup = function () {

+        return DataService.getALaCarte() || DataService.getShouldExcludeMacroFromAsyncInstatiationFlow()

+    };

+

+    function receiveMessage(event) {

+        if (event.data == 'closeIframe') {

+            window.removeEventListener("message", receiveMessage, false);

+

+            $scope.cancel();

+        }

+        else if (event.data.eventId == 'submitIframe') {

+            {

+                $location.path('/servicePlanning').search({serviceModelId: event.data.data.serviceModelId});

+            }

+        }

+        $scope.$apply();

+    }

+

+    $scope.$on(COMPONENT.CREATE_COMPONENT, function (event, request) {

+        $scope.isSpinnerVisible = true;

+        $scope.isErrorVisible = false;

+        $scope.isDataVisible = false;

+        $scope.isConfirmEnabled = false;

+        $scope.isDialogVisible = true;

+        $scope.popup.isVisible = true;

+

+

+        if (!$scope.shouldShowOldPopup()) {

+            $scope.url = COMPONENT.SERVICE_POPUP_IFRAME_URL + request.modelNameVersionId + "&isCreate=true&r=" + Math.random();

+            window.addEventListener("message", receiveMessage, false);

+

+        }

+        else {

+            callbackFunction = request.callbackFunction;

+            componentId = request.componentId;

+            CreationService.initializeComponent(request.componentId);

+

+            CreationService.setHttpErrorHandler(function (response) {

+                showError(FIELD.ERROR.SYSTEM_FAILURE, UtilityService

+                    .getHttpErrorMessage(response));

+            });

+

+            $scope.componentName = CreationService.getComponentDisplayName();

+

+            CreationService.getParameters(handleGetParametersResponse);

+        }

+

+    });

+

+    var handleGetParametersResponse = function (parameters) {

+        $scope.summaryControl.setList(parameters.summaryList);

+        $scope.userProvidedControl.setList(parameters.userProvidedList);

+

+        $scope.isSpinnerVisible = false;

+        $scope.isDataVisible = true;

+        $scope.isConfirmEnabled = true;

+    };

+

+    var validateInstanceName = function (iname) {

+        var patt1 = /^([a-z])+([0-9a-z\-_\.]*)$/i;

+

+        if (iname == null) {

+            return false;

+        }

+        if (!iname.match(patt1)) {

+            return false;

+        }

+        return true;

+    };

+    var validateMap = function (mname) {

+        var patt1 = /^{(\s*\w+\s*:\s*\w+\s*)(\s*,\s*\w+\s*:\s*\w+\s*)*}$/im;

+        if (mname == null) {

+            return true;

+        }

+        if (!mname.match(patt1)) {

+            return false;

+        }

+        return true;

+    };

+

+    var validateList = function (lname) {

+        var patt1 = /^\[(\s*\w+\s*)(\s*,\s*\w+\s*)*\]$/i;

+        if (lname == null) {

+            return true;

+        }

+        if (!lname.match(patt1)) {

+            return false;

+        }

+        return true;

+    };

+

+    $scope.userParameterChanged = function (id) {

+        CreationService.updateUserParameterList(id, $scope.userProvidedControl);

+    };

+

+    $scope.confirm = function () {

+

+        var requiredFields = $scope.userProvidedControl.getRequiredFields();

+        if (requiredFields !== "") {

+            showError(FIELD.ERROR.MISSING_DATA, requiredFields);

+            return;

+        }

+

+        var isUploadAvailable = false;

+        var uploadIndex = 0;

+        var paramList = $scope.userProvidedControl.getList();

+        var isAnyError = false;

+        for (var i = 0; i < paramList.length; i++) {

+            if (paramList[i].id === FIELD.ID.SUPPLEMENTORY_DATA_FILE) {

+                isUploadAvailable = true;

+                uploadIndex = i;

+            }

+            if (paramList[i].id === FIELD.ID.UPLOAD_SUPPLEMENTORY_DATA_FILE && paramList[i].value && document.getElementById(FIELD.ID.SUPPLEMENTORY_DATA_FILE).value == '') {

+                isAnyError = true;

+            }

+        }

+

+        if (isUploadAvailable && isAnyError) {

+            showError(FIELD.ERROR.MISSING_DATA, FIELD.ERROR.MISSING_FILE);

+

+        } else if (isUploadAvailable && document.getElementById(FIELD.ID.SUPPLEMENTORY_DATA_FILE).value != '') {

+            var errorMsg = "";

+            var fileInput = document.getElementById(FIELD.ID.SUPPLEMENTORY_DATA_FILE);

+            var file = fileInput.files[0];

+            var reader = new FileReader();

+            reader.onload = function (e) {

+                try {

+                    paramList[uploadIndex].value = JSON.parse(reader.result);

+                    FIELD.PARAMETER.SUPPLEMENTORY_DATA_FILE['value'] = paramList[uploadIndex].value;

+

+                    var instanceName = "";

+

+                    if (DataService.getALaCarte()) {

+                        if (paramList != null) {

+                            for (var i = 0; i < paramList.length; i++) {

+                                if (paramList[i].id === FIELD.ID.INSTANCE_NAME) {

+                                    instanceName = paramList[i].value;

+                                    break;

+                                }

+                            }

+                        }

+                        var isValid = validateInstanceName(instanceName);

+                        if (isValid) {

+                            $scope.isErrorVisible = false;

+                        } else {

+                            showError(FIELD.ERROR.INVALID_INSTANCE_NAME + instanceName,

+                                FIELD.ERROR.INSTANCE_NAME_VALIDATE);

+                            return;

+                        }

+                    }

+                    var arbitraryParametersList = DataService.getArbitraryParameters();

+                    var p = null;

+                    if (UtilityService.hasContents(arbitraryParametersList)) {

+                        for (var i = 0; i < arbitraryParametersList.length; i++) {

+                            p = arbitraryParametersList[i];

+                            if (p.type === PARAMETER.MAP) {

+                                //validate a map: { <entry_key_1>: <entry_value_1>, ... , <entry_key_n>: <entry_value_n> }

+                                // need to find the value in paramList

+                                for (var j = 0; j < paramList.length; j++) {

+                                    if (paramList[j].id === p.id) {

+                                        p.value = paramList[j].value;

+                                        var isValid = validateMap(p.value);

+                                        if (isValid) {

+                                            $scope.isErrorVisible = false;

+                                            break;

+                                        }

+                                        else {

+                                            showError(FIELD.ERROR.INVALID_MAP + p.id,

+                                                FIELD.ERROR.MAP_VALIDATE);

+                                            return;

+                                        }

+                                    }

+                                }

+                            } else if (p.type === PARAMETER.LIST) {

+                                //validate a list: { value or a list of comma separated values }

+                                // need to find the value in paramList

+                                for (var j = 0; j < paramList.length; j++) {

+                                    if (paramList[j].id === p.id) {

+                                        p.value = paramList[j].value;

+                                        var isValid = validateList(p.value);

+                                        if (isValid) {

+                                            $scope.isErrorVisible = false;

+                                            break;

+                                        }

+                                        else {

+                                            showError(FIELD.ERROR.INVALID_LIST + p.id,

+                                                FIELD.ERROR.LIST_VALIDATE);

+                                            return;

+                                        }

+                                    }

+                                }

+                            }

+                        }

+                    }

+                    var requestDetails = CreationService

+                        .getMsoRequestDetails($scope.userProvidedControl.getList());

+

+                    $scope.isDialogVisible = false;

+

+                    $scope.$broadcast(COMPONENT.MSO_CREATE_REQ, {

+                        url: CreationService.getMsoUrl(),

+                        requestDetails: requestDetails,

+                        componentId: componentId,

+                        callbackFunction: function (response) {

+                            if (response.isSuccessful) {

+                                $scope.popup.isVisible = false;

+                                runCallback(response);

+                            } else {

+                                $scope.isDialogVisible = false;

+                                $scope.popup.isVisible = false;

+                            }

+                        }

+                    });

+

+                } catch (e) {

+                    errorMsg = errorMsg + FIELD.ERROR.INVALID_DATA_FORMAT;

+                }

+                if (errorMsg !== "") {

+                    showError(FIELD.ERROR.SYSTEM_FAILURE, errorMsg);

+

+                }

+            };

+            reader.readAsText(file);

+        } else {

+

+            var paramList = $scope.userProvidedControl.getList();

+            var instanceName = "";

+

+            if (DataService.getALaCarte()) {

+                if (paramList != null) {

+                    for (var i = 0; i < paramList.length; i++) {

+                        if (paramList[i].id === FIELD.ID.INSTANCE_NAME) {

+                            instanceName = paramList[i].value;

+                            break;

+                        }

+                    }

+                }

+                var isValid = validateInstanceName(instanceName);

+                if (isValid) {

+                    $scope.isErrorVisible = false;

+                } else {

+                    showError(FIELD.ERROR.INVALID_INSTANCE_NAME + instanceName,

+                        FIELD.ERROR.INSTANCE_NAME_VALIDATE);

+                    return;

+                }

+            }

+            var arbitraryParametersList = DataService.getArbitraryParameters();

+            var p = null;

+            if (UtilityService.hasContents(arbitraryParametersList)) {

+                for (var i = 0; i < arbitraryParametersList.length; i++) {

+                    p = arbitraryParametersList[i];

+                    if (p.type === PARAMETER.MAP) {

+                        //validate a map: { <entry_key_1>: <entry_value_1>, ... , <entry_key_n>: <entry_value_n> }

+                        // need to find the value in paramList

+                        for (var j = 0; j < paramList.length; j++) {

+                            if (paramList[j].id === p.id) {

+                                p.value = paramList[j].value;

+                                var isValid = validateMap(p.value);

+                                if (isValid) {

+                                    $scope.isErrorVisible = false;

+                                    break;

+                                }

+                                else {

+                                    showError(FIELD.ERROR.INVALID_MAP + p.id,

+                                        FIELD.ERROR.MAP_VALIDATE);

+                                    return;

+                                }

+                            }

+                        }

+                    } else if (p.type === PARAMETER.LIST) {

+                        //validate a list: { value or a list of comma separated values }

+                        // need to find the value in paramList

+                        for (var j = 0; j < paramList.length; j++) {

+                            if (paramList[j].id === p.id) {

+                                p.value = paramList[j].value;

+                                var isValid = validateList(p.value);

+                                if (isValid) {

+                                    $scope.isErrorVisible = false;

+                                    break;

+                                }

+                                else {

+                                    showError(FIELD.ERROR.INVALID_LIST + p.id,

+                                        FIELD.ERROR.LIST_VALIDATE);

+                                    return;

+                                }

+                            }

+                        }

+                    }

+                }

+            }

+            var requestDetails = CreationService

+                .getMsoRequestDetails($scope.userProvidedControl.getList());

+

+            $scope.isDialogVisible = false;

+

+            $scope.$broadcast(COMPONENT.MSO_CREATE_REQ, {

+                url: CreationService.getMsoUrl(),

+                requestDetails: requestDetails,

+                componentId: componentId,

+                callbackFunction: function (response) {

+                    if (response.isSuccessful) {

+                        $scope.popup.isVisible = false;

+                        runCallback(response);

+                    } else {

+                        $scope.isDialogVisible = false;

+                        $scope.popup.isVisible = false;

+                    }

+                }

+            });

+        }

+    };

+

+    $scope.cancel = function () {

+        $scope.isDialogVisible = false;

+        $scope.popup.isVisible = false;

+        runCallback(false);

+    };

+

+

+    var runCallback = function (response) {

+        if (angular.isFunction(callbackFunction)) {

+            callbackFunction({

+                isSuccessful: response.isSuccessful,

+                control: $scope.userProvidedControl.getList(),

+                instanceId: response.instanceId

+            });

+        }

+    };

+

+    var showError = function (summary, details) {

+        var message = summary;

+        if (UtilityService.hasContents(details)) {

+            message += " (" + details + ")";

+        }

+        $scope.isSpinnerVisible = false;

+        $scope.isErrorVisible = true;

+        $scope.error = message;

+    }

+

+};

+

+appDS2.controller("creationDialogController", ["COMPONENT", "FIELD", "PARAMETER", "$scope", "$http",

+    "$timeout", "$log", "CreationService", "UtilityService", "DataService", "VIDCONFIGURATION", "$location",

+    creationDialogController]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/deleteResumeDialogController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/deleteResumeDialogController.js
index cdda3a14..e71f2ac1 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/deleteResumeDialogController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/deleteResumeDialogController.js
@@ -26,77 +26,76 @@ var deleteResumeDialogController = function( COMPONENT, FIELD, $scope, $http, $t
     $scope.isDialogVisible = false;
     $scope.summaryControl = {};
     $scope.userProvidedControl = {};
-    
+
     var callbackFunction = undefined;
     var componentId = undefined;
+    $scope.dialogMethod = COMPONENT.DELETE;
 
     $scope.$on(COMPONENT.DELETE_RESUME_COMPONENT, function(event, request) {
 
     $scope.isE2EService = false;
-    $scope.isDataVisible = false;
-	$scope.isSpinnerVisible = false;
-	$scope.isErrorVisible = false;
-	$scope.isDialogVisible = true;
-	$scope.popup.isVisible = true;
-	$scope.isConfirmEnabled = false;
-	$scope.dialogMethod = request.dialogMethod;
-	callbackFunction = request.callbackFunction;
-	componentId = request.componentId;
-    $scope.isServiceInstance = componentId === "service";
-
-    DeleteResumeService.initializeComponent(request.componentId);
+        $scope.isDataVisible = false;
+        $scope.isSpinnerVisible = false;
+        $scope.isErrorVisible = false;
+        $scope.isDialogVisible = true;
+        $scope.popup.isVisible = true;
+        $scope.isConfirmEnabled = false;
+        $scope.dialogMethod = request.dialogMethod;
+        $scope.serviceStatus = request.serviceStatus;
+        callbackFunction = request.callbackFunction;
+        componentId = request.componentId;
 
-	$scope.componentName = DeleteResumeService.getComponentDisplayName();
+        DeleteResumeService.initializeComponent(request.componentId);
 
-	$scope.summaryControl.setList(DeleteResumeService.getSummaryList());
+        $scope.componentName = DeleteResumeService.getComponentDisplayName();
+        $scope.summaryControl.setList(DeleteResumeService.getSummaryList());
 
-    DeleteResumeService.getParameters(handleGetParametersResponse);
+        DeleteResumeService.getParameters(handleGetParametersResponse);
 
     });
-    
+
     var handleGetParametersResponse = function(parameters, dontshow) {
-		$scope.summaryControl.setList(parameters.summaryList);
-		$scope.userProvidedControl.setList(parameters.userProvidedList);
-
-		$scope.isSpinnerVisible = false;
-		if (dontshow)
-		  $scope.isDataVisible = false;
-		else
-			$scope.isDataVisible = true;
-		$scope.isConfirmEnabled = true;
-	};
-
-	$scope.userParameterChanged = function(id) {
+        $scope.summaryControl.setList(parameters.summaryList);
+        $scope.userProvidedControl.setList(parameters.userProvidedList);
+
+        $scope.isSpinnerVisible = false;
+        if (dontshow)
+            $scope.isDataVisible = false;
+        else
+            $scope.isDataVisible = true;
+        $scope.isConfirmEnabled = true;
+    };
+
+    $scope.userParameterChanged = function(id) {
         DeleteResumeService.updateUserParameterList(id, $scope.userProvidedControl);
-	}
+    }
 
     $scope.confirm = function() {
         DataService.setE2EService($scope.isE2EService); //VoLTE support
+        var requiredFields = $scope.userProvidedControl.getRequiredFields();
+        if (requiredFields === "") {
+            $scope.isErrorVisible = false;
+        } else {
+            showError(FIELD.ERROR.MISSING_DATA, requiredFields);
+            return;
+        }
 
-    	var requiredFields = $scope.userProvidedControl.getRequiredFields();
-		if (requiredFields === "") {
-			$scope.isErrorVisible = false;
-		} else {
-			showError(FIELD.ERROR.MISSING_DATA, requiredFields);
-			return;
-		}
 
-		
 
-       var  callbackAfterMSO = function(isSuccessful) {
+        var  callbackAfterMSO = function(isSuccessful) {
             if (isSuccessful) {
                 $scope.popup.isVisible = false;
                 runCallback(true);
             } else {
-                 $scope.isDialogVisible = true;
+                $scope.isDialogVisible = true;
             }
         };
 
 
-		$scope.isDialogVisible = false;
+        $scope.isDialogVisible = false;
 
-		if ($scope.dialogMethod == COMPONENT.DELETE)
-		{
+        if ($scope.dialogMethod == COMPONENT.DELETE)
+        {
 
             var requestDetails = DeleteResumeService.getMsoRequestDetails($scope.userProvidedControl.getList());
 
@@ -105,13 +104,13 @@ var deleteResumeDialogController = function( COMPONENT, FIELD, $scope, $http, $t
             }
 
             $scope.$broadcast(COMPONENT.MSO_DELETE_REQ, {
-                url : DeleteResumeService.getMsoUrl(),
+                url : DeleteResumeService.getMsoUrl($scope.serviceStatus),
                 requestDetails : requestDetails,
-            	componentId: componentId,
+                componentId: componentId,
                 callbackFunction : callbackAfterMSO
             });
-		}
-		else
+        }
+        else
         if ($scope.dialogMethod == COMPONENT.RESUME)
         {
             CreationService.initializeComponent(componentId);
@@ -133,17 +132,17 @@ var deleteResumeDialogController = function( COMPONENT, FIELD, $scope, $http, $t
     }
 
     $scope.cancel = function() {
-	$scope.isDialogVisible = false;
-	$scope.popup.isVisible = false;
-	runCallback(false);
+        $scope.isDialogVisible = false;
+        $scope.popup.isVisible = false;
+        runCallback(false);
     }
 
     var runCallback = function(isSuccessful) {
-	if (angular.isFunction(callbackFunction)) {
-	    callbackFunction({
-		isSuccessful : isSuccessful
-	    });
-	}
+        if (angular.isFunction(callbackFunction)) {
+            callbackFunction({
+                isSuccessful : isSuccessful
+            });
+        }
     }
 }
 
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitModalController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitModalController.js
index 148b4cce..631d0122 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitModalController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/msoCommitModalController.js
@@ -21,7 +21,7 @@
 "use strict";
 
 var msoCommitModalController = function(COMPONENT, FIELD, $scope, $http, $timeout, $window, $log,
-		MsoService, PropertyService, UtilityService, DataService, $uibModalInstance, msoType, requestParams, vidService) {
+		MsoService, PropertyService, UtilityService, DataService, $uibModalInstance, msoType, requestParams, configuration, vidService, featureFlags) {
 
     $scope.isSpinnerVisible = true;
     $scope.isProgressVisible = true;
@@ -153,12 +153,14 @@ var msoCommitModalController = function(COMPONENT, FIELD, $scope, $http, $timeou
 
     var init = function(msoType) {
         switch(msoType) {
+            case COMPONENT.MSO_DELETE_CONFIGURATION_REQ :
+                return MsoService.deleteConfiguration(requestParams, configuration);
             case COMPONENT.MSO_CREATE_REQ:
                 return MsoService.createConfigurationInstance(requestParams);
             case  COMPONENT.MSO_CHANGE_CONFIG_STATUS_REQ:
-                return MsoService.toggleConfigurationStatus(requestParams);
+                return MsoService.toggleConfigurationStatus(requestParams, configuration);
             case COMPONENT.MSO_CHANGE_PORT_STATUS_REQ:
-                return MsoService.togglePortStatus(requestParams);
+                return MsoService.togglePortStatus(requestParams, configuration);
             case COMPONENT.MSO_CREATE_REALATIONSHIP:
                 return MsoService.associatePnf(requestParams);
             case COMPONENT.MSO_REMOVE_RELATIONSHIP:
@@ -223,6 +225,7 @@ var msoCommitModalController = function(COMPONENT, FIELD, $scope, $http, $timeou
 
     _this.msoRequestType = msoType;
 
+
     init(_this.msoRequestType)
         .then(function (response) {
             successCallbackFunction(response);
@@ -233,5 +236,5 @@ var msoCommitModalController = function(COMPONENT, FIELD, $scope, $http, $timeou
 };
 
 appDS2.controller("msoCommitModalController", [ "COMPONENT", "FIELD", "$scope", "$http", "$timeout",
-		"$window", "$log", "MsoService", "PropertyService", "UtilityService", "DataService", "$uibModalInstance", "msoType", "requestParams", "vidService",
+		"$window", "$log", "MsoService", "PropertyService", "UtilityService", "DataService", "$uibModalInstance", "msoType", "requestParams", "configuration", "vidService", "featureFlags",
     msoCommitModalController ]);
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/pnfSearchAssociationController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/pnfSearchAssociationController.js
index 22a20abf..04717c5f 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/pnfSearchAssociationController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/pnfSearchAssociationController.js
@@ -94,6 +94,9 @@ appDS2.controller("pnfSearchAssociationController", ["COMPONENT", "$log", "FIELD
                     requestParams: function () {
                         requestParams.callbackFunction = updateViewCallbackFunction;
                         return requestParams;
+                    },
+                    configuration: function () {
+                        return null;
                     }
                 }
             })
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/controller/testEnvironmentsController.js b/vid-app-common/src/main/webapp/app/vid/scripts/controller/testEnvironmentsController.js
index f5c3a0e0..63ddac2f 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/controller/testEnvironmentsController.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/controller/testEnvironmentsController.js
@@ -53,7 +53,7 @@
                         _.find(relatedEcompEnv.relationshipData, {"relationshipKey": "operational-environment.operational-environment-id"})
                             .relationshipValue;
                     var relatedInstanceName =
-                        _.find(relatedEcompEnv.relatedToProperty, {"propertyKey": "operational-environment.operational-name"})
+                        _.find(relatedEcompEnv.relatedToProperty, {"propertyKey": "operational-environment.operational-environment-name"})
                             .propertyValue;
                     var workloadContext = testEnv.workloadContext;
 
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/filters/change-managements-by-statuses.filter.js b/vid-app-common/src/main/webapp/app/vid/scripts/filters/change-managements-by-statuses.filter.js
index 6f0ae2c6..82dbebcb 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/filters/change-managements-by-statuses.filter.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/filters/change-managements-by-statuses.filter.js
@@ -7,12 +7,16 @@
             var result = [];
             if(changeManagements && metadata && metadata.statuses) {
                 angular.forEach(changeManagements, function(changeManagement) {
-                    angular.forEach(metadata.statuses, function(status) {
-                        if(changeManagement.requestStatus.requestState === status) {
-                            result.push(changeManagement);
-                            return;
-                        }
-                    });
+                    var found = metadata.statuses
+                        .map(function(c) { return c.toLowerCase(); })
+                        .indexOf(changeManagement.requestStatus.requestState.toLowerCase()) !== -1;
+
+                    if (metadata.notContains && !found) {
+                        result.push(changeManagement);
+                    }
+                    if (! metadata.notContains && found) {
+                        result.push(changeManagement);
+                    }
                 });
             }
 
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html
index 60596f49..6988aab9 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/alert-change-management/alert-change-management.html
@@ -1,5 +1,6 @@
 <link rel="stylesheet" type="text/css" href="app/vid/styles/modal-create-new.css" />
 <link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/alert-change-management/alert-change-management.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/css/manual-task-popup.css" />
 <div class="modal-header">
     <h3 class="modal-title" id="alert-modal-header">On Hold</h3>
     <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">&times;</span>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/cancel-pending-workflow/cancel-pending-workflow.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/cancel-pending-workflow/cancel-pending-workflow.html
index 6dca76d2..7ae4ba9b 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/cancel-pending-workflow/cancel-pending-workflow.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/cancel-pending-workflow/cancel-pending-workflow.html
@@ -2,9 +2,9 @@
 <link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/cancel-pending-workflow/cancel-pending-workflow.css"/>
 <div class="modal-header">
     <span class="modal-title" id="pending-modal-header">Pending</span>
-    <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">&times;</span>
+    <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true" data-tests-id="pull_right_modal_close">&times;</span>
 </div>
-<div class="modal-body" id="modal-body">
+<div class="modal-body" id="modal-body" data-tests-id="btn-cancel-workflow">
     Are you sure you want to delete workflow
     <br/>
     {{vm.workflow.scheduleRequest.scheduleName}}?
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js
index 91bac569..daf593e3 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/change-management-manual-tasks-controller/change-management-manual-tasks.controller.js
@@ -10,6 +10,8 @@
         vm.manualTasks = [];
         vm.MANUAL_TASKS = COMPONENT.MANUAL_TASKS;
         var init = function() {
+            vm.requestState = jobInfo.requestState;
+
             if (jobInfo && jobInfo.details) {
                 vm.content = jobInfo.details;
             } else {
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/css/manual-task-popup.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/css/manual-task-popup.css
new file mode 100644
index 00000000..f2e7d8bf
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/css/manual-task-popup.css
@@ -0,0 +1,10 @@
+.modal {
+    position: inherit;
+    text-align: left;
+}
+.modal-dialog {
+    position: absolute;
+    right: 0;
+    display: inline;
+    margin-top: -200px;
+}
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html
index d51620d0..cc22f700 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/failed-change-management/failed-change-management.html
@@ -1,7 +1,8 @@
 <link rel="stylesheet" type="text/css" href="app/vid/styles/modal-create-new.css" />
 <link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/failed-change-management/failed-change-management.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/css/manual-task-popup.css" />
 <div class="modal-header">
-    <h3 class="modal-title" id="failed-modal-header">Failed</h3>
+    <h3 class="modal-title" id="failed-modal-header">{{vm.requestState || 'Failed' }}</h3>
     <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">&times;</span>
 </div>
 <div class="modal-body">
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html
index 615c95ce..57166700 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.html
@@ -1,5 +1,6 @@
 <link rel="stylesheet" type="text/css" href="app/vid/styles/modal-create-new.css" />
 <link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/in-progress-modal-management/in-progress-change-management.css" />
+<link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/css/manual-task-popup.css" />
 <div class="modal-header">
     <h3 class="modal-title" id="in-progress-modal-header">In Progress</h3>
     <span id="cancel" ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">&times;</span>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/mso-commit/mso-commit.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/mso-commit/mso-commit.html
index 7698981c..50b53ce3 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/mso-commit/mso-commit.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/mso-commit/mso-commit.html
@@ -39,7 +39,7 @@
 
     </div>
 
-    <pre class="log">{{log}}</pre>
+    <pre class="log" data-tests-id="msoCommitLog">{{log}}</pre>
 
     <div class="buttonRow">
         <button data-tests-id="msoCommitDialogCloseButton" ngx-enabled="{{isCloseEnabled}}" att-button size="small"
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
index e4ff1a06..39182191 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.controller.js
@@ -2,9 +2,9 @@
     'use strict';
 
     appDS2.controller("newChangeManagementModalController", ["$uibModalInstance", "$uibModal",'$q', "AaiService", "changeManagementService", "Upload",
-        "$log", "$scope", "_", "COMPONENT", "VIDCONFIGURATION", newChangeManagementModalController]);
+        "$log", "$scope", "_", "COMPONENT", "VIDCONFIGURATION","DataService","featureFlags", newChangeManagementModalController]);
 
-    function newChangeManagementModalController($uibModalInstance, $uibModal,$q, AaiService, changeManagementService, Upload, $log, $scope, _, COMPONENT, VIDCONFIGURATION) {
+    function newChangeManagementModalController($uibModalInstance, $uibModal,$q, AaiService, changeManagementService, Upload, $log, $scope, _, COMPONENT, VIDCONFIGURATION, DataService, featureFlags) {
 
         var vm = this;
         vm.hasScheduler = !!VIDCONFIGURATION.SCHEDULER_PORTAL_URL;
@@ -23,11 +23,29 @@
 
         vm.softwareVersionRegex = "[-a-zA-Z0-9\.]+";
 
+        var attuid;
+
+        function fetchAttUid() {
+            var defer = $q.defer();
+            if (attuid) {
+                defer.resolve(attuid);
+            } else {
+                AaiService.getLoggedInUserID(function (response) {
+                        attuid = response.data;
+                        defer.resolve(attuid);
+                    },
+                    function (err) {
+                        defer.reject(err);
+                    });
+            }
+            return defer.promise;
+        }
+
         var init = function () {
             vm.changeManagement = {};
 
             loadServicesCatalog();
-            registerVNFNamesWatcher();
+            fetchAttUid().then(registerVNFNamesWatcher);
             vm.loadSubscribers();
         };
 
@@ -115,14 +133,11 @@
                     modelCustomizationName: csarVNF.modelCustomizationName,
                     modelCustomizationId: csarVNF.customizationUuid
                 },
-                cloudConfiguration: {
-                    lcpCloudRegionId: "mdt1",
-                    tenantId: "88a6ca3ee0394ade9403f075db23167e"
-                },
+                cloudConfiguration: selectionVNF.cloudConfiguration || {},
                 requestInfo: {
                     source: "VID",
                     suppressRollback: false,
-                    requestorId: "az2016"
+                    requestorId: attuid
                 },
                 relatedInstanceList: [
                     {
@@ -161,13 +176,13 @@
                     return data;
                 }]
             })
-            .then(function (configUpdateResponse) {
-                vm.changeManagement.configUpdateFile = configUpdateResponse && JSON.parse(configUpdateResponse.data).payload;
-                defer.resolve(true);
-            })
-            .catch(function (error) {
-                defer.resolve(false);
-            });
+                .then(function (configUpdateResponse) {
+                    vm.changeManagement.configUpdateFile = configUpdateResponse && JSON.parse(configUpdateResponse.data).payload;
+                    defer.resolve(true);
+                })
+                .catch(function (error) {
+                    defer.resolve(false);
+                });
             return defer.promise;
         };
 
@@ -350,6 +365,9 @@
 				vm.changeManagement.policyYN = "Y";
 				vm.changeManagement.sniroYN = "Y";
 
+			            if (featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_ADD_MSO_TESTAPI_FIELD)) {
+			                vm.changeManagement.testApi = DataService.getMsoRequestParametersTestApi();
+			            }
 				var data = {
 					widgetName: 'Portal-Common-Scheduler',
 					widgetData: vm.changeManagement,
@@ -456,11 +474,13 @@
             vm.serviceInstancesToGetVersions = [];
             var versions = [];
             _.forEach(vm.vnfs, function (vnf) {
-                if (vnf.properties['nf-role'] === vm.changeManagement['vnfType']) {
-
+                if (vnf.properties['nf-role'] === vm.changeManagement['vnfType']
+                && vnf.properties["model-invariant-id"]
+                && vnf.properties["model-version-id"]) {
                     vm.serviceInstancesToGetVersions.push({
-                        "model-invariant-id": vnf.properties["model-invariant-id"],
-                        "model-version-id": vnf.properties["model-version-id"] }
+                            "model-invariant-id": vnf.properties["model-invariant-id"],
+                            "model-version-id": vnf.properties["model-version-id"]
+                        }
                     );
 
                     versions.push(vnf.properties["model-invariant-id"]);
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
index 9954d5ae..5679af41 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-change-management/new-change-management.html
@@ -71,15 +71,15 @@
         </div>
         <div ng-if="vm.shouldShowVnfInPlaceFields()">
             <div class="form-group">
-                <label class="control-label">operations-timeout</label>
+                <label class="control-label">Operations timeout</label>
                 <input class="form-control" ng-model="vm.changeManagement.operationTimeout" name="operationTimeout" type="text" id="operations-timeout" pattern="[0-9]+" required>
             </div>
             <div class="form-group">
-                <label class="control-label">existing-software-version</label>
+                <label class="control-label">Existing software version</label>
                 <input class="form-control" ng-model="vm.changeManagement.existingSoftwareVersion" name="existingSoftwareVersion" type="text" id="existing-software-version" pattern="{{vm.softwareVersionRegex}}" required>
             </div>
             <div class="form-group">
-                <label class="control-label">new-software-version</label>
+                <label class="control-label">New software version</label>
                 <input class="form-control" ng-model="vm.changeManagement.newSoftwareVersion" name="newSoftwareVersion" type="text" id="new-software-version" pattern="{{vm.softwareVersionRegex}}" required>
             </div>
 
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-test-environment/new-test-environment.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-test-environment/new-test-environment.html
index cd14a76c..a1f1e2fc 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-test-environment/new-test-environment.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/new-test-environment/new-test-environment.html
@@ -21,7 +21,7 @@
             <input id="ecompInstanceName" class="form-control" ng-model="vm.newEnvironment.ecompInstanceName" name="ecompInstanceName" data-tests-id="ecomp-instance-name" required disabled>
         </div>
         <div class="form-group">
-            <label class="control-label" for="tenantContext">Select VSP</label>
+            <label class="control-label" for="tenantContext">Tenant Context</label>
             <input id="tenantContext" class="form-control" ng-model="vm.newEnvironment.tenantContext" name="tenantContext" data-tests-id="tenant-context" required disabled>
         </div>
         <div class="form-group">
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/aaiService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/aaiService.js
index 4b1d7713..ceb5a754 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/aaiService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/aaiService.js
@@ -20,7 +20,7 @@
 

 "use strict";

 

-var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONENT, FIELD, $q) {

+var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONENT, FIELD, $q, featureFlags) {

 

     function getServiceInstance(serviceInstanceIdentifier, findBy) {

         serviceInstanceIdentifier.trim();

@@ -44,9 +44,7 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
             });

 

         return deferred.promise;

-    };

-

-

+    }

     function getGlobalCustomerIdFromServiceInstanceResponse(response) {

         var globalCustomerId = "";

         if (angular.isArray(response.data[FIELD.ID.RESULT_DATA])) {

@@ -69,7 +67,7 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
             timeout : PropertyService.getServerResponseTimeoutMsec()

         }).then(function (response) {

             var displayData = response.data[FIELD.ID.SERVICE_INSTANCES];

-            if (!displayData.length) {

+            if (!displayData || !displayData.length) {

                 displayData = [{

                     globalCustomerId 	: null,

                     subscriberName   	: null,

@@ -115,7 +113,7 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
                 COMPONENT.FORWARD_SLASH + encodeURIComponent(globalCustomerId) +

                 COMPONENT.FORWARD_SLASH + encodeURIComponent(serviceType) +

                 COMPONENT.FORWARD_SLASH + encodeURIComponent(serviceInstanceId);

-            $http.get(url, {}, {

+            return $http.get(url, {}, {

 

 

                 timeout : PropertyService.getServerResponseTimeoutMsec()

@@ -169,6 +167,26 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
             });

         },

 

+        getCRInformationByInstanceId : function (serviceInstanceId) {

+

+            var deferred = $q.defer();

+

+            var url = COMPONENT.AAI_GET_CR_INSTANCE +

+                COMPONENT.FORWARD_SLASH + encodeURIComponent(serviceInstanceId);

+            $http.get(url, {}, {

+                timeout : PropertyService.getServerResponseTimeoutMsec()

+            }).then(function(response) {

+                if (response.data != null) {

+                    deferred.resolve(response);

+                } else {

+                    deferred.resolve(response);

+                }

+            }, function(response) {

+                deferred.resolve(response);

+            });

+            return deferred.promise;

+        },

+

         searchServiceInstances: searchServiceInstances,

 

         getModelVersionId: function (subscriberId, instanceId) {

@@ -329,6 +347,44 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
             });

         },

 

+        getPortMirroringData : function (ids) {

+            var defer = $q.defer();

+            if(featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_REGION_ID_FROM_REMOTE)){

+                var url = COMPONENT.AAI_GET_PORT_MIRRORING_CONFIGS_DATA +'?configurationIds=' +  ids.join(',');

+                $http.get(url).then(function(res){

+                    defer.resolve(res);

+                }).catch(function(err) {

+                    $log.error(err);

+                    defer.resolve({});

+                });

+            }else {

+                var staticConfigurationData = {};

+                angular.forEach(ids, function(id) {

+                    staticConfigurationData[id] = {

+                        "cloudRegionId": "mdt1"

+                    }

+                });

+                defer.resolve({

+                    "data": staticConfigurationData

+                });

+            }

+

+            return defer.promise;

+

+        },

+

+        getPortMirroringSourcePorts : function (ids) {

+            var defer = $q.defer();

+            var url = COMPONENT.AAI_GET_PORT_MIRRORING_SOURCE_PORTS +'?configurationIds=' +  ids.join(',');

+            $http.get(url).then(function(res){

+                defer.resolve(res);

+            }).catch(function(err) {

+                $log.error(err);

+                defer.resolve({});

+            });

+            return defer.promise;

+        },

+

         getSubscriptionServiceTypeList : function(globalCustomerId,

                                                   successCallbackFunction) {

             $log

@@ -444,11 +500,12 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
                 } else {

                     successCallbackFunction([]);

                 }

-            },function(failure){console.log("failure")})["catch"]

-                if(catchCallbackFunction) {

+            })["catch"] (function(response, status) {

+                if (catchCallbackFunction) {

                     catchCallbackFunction();

                 }

-            (UtilityService.runHttpErrorHandler);

+                UtilityService.runHttpErrorHandler(response, status);

+            })

         },

         getServices : function(successCallbackFunction) {

             $log

@@ -565,7 +622,7 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
             var deferred = $q.defer();

 

             if (UtilityService.hasContents(modelInvariantId)) {

-                var body = {"versions" : modelInvariantId}

+                var body = {"versions": modelInvariantId};

                 $http.post(( COMPONENT.AAI_GET_VERSION_BY_INVARIANT_ID),body)

 

                     .success(function (response) {

@@ -657,8 +714,36 @@ var AaiService = function ($http, $log, PropertyService, UtilityService, COMPONE
             });

 

             return deferred.promise;

+        },

+

+        getInstanceGroupsByVNFInstanceId: function (vnf_instance_id, successCallback, errorCallback) {

+            var url = COMPONENT.AAI_GET_INSTANCE_GROUPS_BY_VNF_INSTANCE_ID_PATH + "/" + vnf_instance_id;

+

+            $http.get(url, {}, {

+                timeout: PropertyService.getServerResponseTimeoutMsec()

+            }).then(function (response) {

+                successCallback(response);

+            }, function (response) {

+                errorCallback(response);

+            });

+        },

+

+        postPOMBAverificationRequest: function (url, data, config) {

+            $http.post(url, data, config)

+                .success(function (data, status, headers, config) {

+                    //If at some point in the future the result should be handled - this should be the entry point.

+                    log.debug("POMBA was called successfully with data: " + data);

+                })

+                .error(function (data, status, header, config) {

+                    log.debug("Error: " +

+                        "Data: " + data +

+                        "status: " + status +

+                        "headers: " + header +

+                        "config: " + config);

+                });

         }

-    }};

+    }

+};

 

 appDS2.factory("AaiService", ["$http", "$log", "PropertyService",

-    "UtilityService", "COMPONENT", "FIELD", "$q", AaiService]);

+    "UtilityService", "COMPONENT", "FIELD", "$q", "featureFlags", AaiService]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/asdcService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/asdcService.js
index 68fdce44..753f9fd1 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/asdcService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/asdcService.js
@@ -20,21 +20,56 @@
 

 "use strict";

 

-var AsdcService = function($http, $log, PropertyService, UtilityService) {

+var AsdcService = function ($http, $log, PropertyService, UtilityService, VIDCONFIGURATION, COMPONENT, featureFlags) {

     return {

-	getModel : function(modelId, successCallbackFunction) {

-	    $log.debug("AsdcService:getModel: modelId: " + modelId);

-	    $http.get(

-		     "asdc/getModel/" + modelId

-			    + "?r=" + Math.random(),

-		    {

-			timeout : PropertyService

-				.getServerResponseTimeoutMsec()

-		    }).then(successCallbackFunction)["catch"]

-		    (UtilityService.runHttpErrorHandler);

-	}

+        getModel: function (modelId, successCallbackFunction) {

+            $log.debug("AsdcService:getModel: modelId: " + modelId);

+            $http.get(

+                "asdc/getModel/" + modelId

+                + "?r=" + Math.random(),

+                {

+                    timeout: PropertyService

+                        .getServerResponseTimeoutMsec()

+                }).then(successCallbackFunction)["catch"]

+            (UtilityService.runHttpErrorHandler);

+        },

+

+        shouldExcludeMacroFromAsyncInstatiationFlow: function(serviceModel){

+            if (!featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_ASYNC_INSTANTIATION))

+                return true;

+            if (!_.isEmpty(serviceModel.pnfs))

+                return true;

+            if (!_.isEmpty(serviceModel.collectionResource))

+                return true;

+            if (!_.isEmpty(serviceModel.networks) && !featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_NETWORK_TO_ASYNC_INSTANTIATION))

+                return true;

+            if(serviceModel.service.instantiationType === "ClientConfig")

+                return true;

+            return false;

+        },

+

+        isMacro: function (serviceModel) {

+            if (serviceModel && serviceModel.service) {

+                switch (serviceModel.service.instantiationType) {

+                    case 'Macro':

+                    case 'Both':

+                        return true;

+                    case 'A-La-Carte':

+                        return false;

+                    case 'ClientConfig':

+                        console.debug("Looking for " + serviceModel.service.invariantUuid + " by Client Config");

+                        return UtilityService.arrayContains(VIDCONFIGURATION.MACRO_SERVICES, serviceModel.service.invariantUuid);

+                    default:

+                        console.debug("Unexpected serviceModel.service.instantiationType: " + serviceModel.service.instantiationType);

+                        return true;

+                }

+            } else {

+                $log.debug("isMscro=false, because serviceModel.service is undefined");

+                return false;

+            }

+        }

     }

 }

 

-appDS2.factory("AsdcService", [ "$http", "$log", "PropertyService",

-	"UtilityService", AsdcService ]);

+appDS2.factory("AsdcService", ["$http", "$log", "PropertyService",

+    "UtilityService", "VIDCONFIGURATION","COMPONENT", "featureFlags", AsdcService]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/creationService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/creationService.js
index 0e7dbe46..f2a77e22 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/creationService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/creationService.js
@@ -30,10 +30,9 @@
  */

 

 var CreationService = function($log, AaiService, AsdcService, DataService,VIDCONFIGURATION,

-                               ComponentService, COMPONENT, FIELD, PARAMETER, UtilityService, OwningEntityService) {

+                               ComponentService, COMPONENT, FIELD, PARAMETER, UtilityService, OwningEntityService,featureFlags) {

 

     var _this = this;

-

     var getAsyncOperationList = function() {

         if (DataService.getLoggedInUserId() == null) {

             getLoggedInUserID();

@@ -660,6 +659,11 @@ var CreationService = function($log, AaiService, AsdcService, DataService,VIDCON
                 userParams : getArbitraryParameters(parameterList)

             }

         };

+        if (featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_ADD_MSO_TESTAPI_FIELD)) {

+            if ((_this.componentId != COMPONENT.SERVICE) || ( DataService.getALaCarte() )) {

+                requestDetails.requestParameters.testApi = DataService.getMsoRequestParametersTestApi();

+            }

+        }

         if ( (_this.componentId != COMPONENT.SERVICE) || ( !DataService.getALaCarte() ) ) {

             // include cloud region for everything but service create alacarte

             var lcpRegion = getValueFromList(FIELD.ID.LCP_REGION, parameterList);

@@ -673,6 +677,7 @@ var CreationService = function($log, AaiService, AsdcService, DataService,VIDCON
             };

         }

         switch (_this.componentId) {

+

             case COMPONENT.SERVICE:

                 requestDetails.subscriberInfo = {

                     globalSubscriberId : DataService.getGlobalCustomerId(),

@@ -1285,4 +1290,4 @@ var CreationService = function($log, AaiService, AsdcService, DataService,VIDCON
 

 appDS2.factory("CreationService", [ "$log", "AaiService", "AsdcService",

     "DataService","VIDCONFIGURATION", "ComponentService", "COMPONENT", "FIELD", "PARAMETER",

-    "UtilityService", "OwningEntityService", CreationService ]);

+    "UtilityService", "OwningEntityService","featureFlags", CreationService ]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/dataService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/dataService.js
index 77523e9c..0e163551 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/dataService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/dataService.js
@@ -257,6 +257,9 @@ var DataService = function($log, DataService) {
 		getServiceInstanceToCustomer : function() {

 			return _this.serviceInstanceToCustomer;

 		},

+        getMsoRequestParametersTestApi: function(){

+            return sessionStorage.getItem("msoRequestParametersTestApiValue");

+		},

 		setALaCarte : function(aval) {

 			_this.aLaCarte = aval;

 		},

@@ -267,6 +270,15 @@ var DataService = function($log, DataService) {
 			}

 			return _this.aLaCarte;

 		},

+		setShouldExcludeMacroFromAsyncInstatiationFlow: function (val) {

+			_this.shouldExcludeMacroFromAsyncInstatiationFlow = val;

+        },

+        getShouldExcludeMacroFromAsyncInstatiationFlow: function(){

+            if (_this.shouldExcludeMacroFromAsyncInstatiationFlow === undefined) {

+                return false;

+            }

+            return _this.shouldExcludeMacroFromAsyncInstatiationFlow;

+		},

 		setMacro : function(aval) {

 			_this.macro = aval;

 		},

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/deleteResumeService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/deleteResumeService.js
index 3255bc9a..416096a1 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/deleteResumeService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/deleteResumeService.js
@@ -21,7 +21,7 @@
 "use strict";
 
 var DeleteResumeService = function($log, AaiService, AsdcService, DataService,
-	ComponentService, COMPONENT, FIELD, UtilityService) {
+	ComponentService, COMPONENT, FIELD, UtilityService,featureFlags) {
 
     var _this = this;
 
@@ -255,7 +255,7 @@ var DeleteResumeService = function($log, AaiService, AsdcService, DataService,
 	}
     };
 
-    var getMsoUrl = function() {
+    var getMsoUrl = function(serviceStatus) {
 		switch (_this.componentId) {
 			case COMPONENT.CONFIGURATION:
 				return "mso_delete_configuration/"
@@ -269,7 +269,7 @@ var DeleteResumeService = function($log, AaiService, AsdcService, DataService,
 				if(DataService.getE2EService() === true)
 					return "mso_delete_e2e_svc_instance/"+ DataService.getServiceInstanceId();
 				else
-					return "mso_delete_svc_instance/"+ DataService.getServiceInstanceId();
+					return "mso_delete_svc_instance" + "/" + DataService.getServiceInstanceId() + "?serviceStatus="  + serviceStatus;
 			case COMPONENT.VNF:
 				return "mso_delete_vnf_instance/"
 					+ DataService.getServiceInstanceId() + "/vnfs/"
@@ -330,12 +330,21 @@ var DeleteResumeService = function($log, AaiService, AsdcService, DataService,
 					requestorId: requestorloggedInId
 				}
 		};
+        if (featureFlags.isOn(COMPONENT.FEATURE_FLAGS.FLAG_ADD_MSO_TESTAPI_FIELD)) {
+            if ((_this.componentId != COMPONENT.SERVICE) || ( DataService.getALaCarte() )) {
+                // a-la-carte services AND *any* non-service
+                requestDetails.requestParameters = {
+                    testApi : DataService.getMsoRequestParametersTestApi()
+                };
+            }
+        }
 		
 		switch (_this.componentId) {
 			case COMPONENT.SERVICE:
-				requestDetails.requestParameters = {
-					aLaCarte : DataService.getALaCarte()
-				};
+				if (!requestDetails.requestParameters) {
+                    requestDetails.requestParameters = {};
+                }
+				requestDetails.requestParameters.aLaCarte = DataService.getALaCarte();
 				if ( !(DataService.getALaCarte()) ) {
 					// for macro delete include cloud config.
 					var lcpRegion = getValueFromList(FIELD.ID.LCP_REGION, parameterList);
@@ -530,4 +539,4 @@ var DeleteResumeService = function($log, AaiService, AsdcService, DataService,
 
 appDS2.factory("DeleteResumeService", [ "$log", "AaiService", "AsdcService",
 	"DataService", "ComponentService", "COMPONENT", "FIELD",
-	"UtilityService", DeleteResumeService ]);
+	"UtilityService","featureFlags", DeleteResumeService ]);
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/detailsService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/detailsService.js
index 37220ffd..044b5b91 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/detailsService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/detailsService.js
@@ -20,79 +20,101 @@
 

 "use strict";

 

-var DetailsService = function($log, DataService, ComponentService, COMPONENT,

-	FIELD, UtilityService) {

+var DetailsService = function ($log, DataService, ComponentService, COMPONENT,

+                               FIELD, UtilityService) {

 

     var _this = this;

 

-    var getSummaryList = function() {

-	switch (_this.componentId) {

-	case COMPONENT.NETWORK:

-	case COMPONENT.SERVICE:

-	case COMPONENT.VNF:

-	case COMPONENT.VF_MODULE:

-	case COMPONENT.VOLUME_GROUP:

-	    return [ {

-		name : FIELD.NAME.SUBSCRIBER_NAME,

-		value : DataService.getSubscriberName()

-	    }, {

-		name : FIELD.NAME.SERVICE_INSTANCE_ID,

-		value : DataService.getServiceInstanceId()

-	    }, {

-		name : FIELD.NAME.SERVICE_TYPE,

-		value : DataService.getServiceType()

-	    } ];

-	}

+    var getSummaryList = function () {

+        var model = DataService.getModelInfo(COMPONENT.SERVICE);

+        switch (_this.componentId) {

+            case COMPONENT.NETWORK:

+            case COMPONENT.SERVICE:

+            case COMPONENT.VNF:

+            case COMPONENT.VF_MODULE:

+            case COMPONENT.VOLUME_GROUP:

+                return [{

+                    name: FIELD.NAME.SUBSCRIBER_NAME,

+                    value: DataService.getSubscriberName()

+                }, {

+                    name: FIELD.NAME.SERVICE_INSTANCE_ID,

+                    value: DataService.getServiceInstanceId()

+                }, {

+                    name: FIELD.NAME.SERVICE_TYPE,

+                    value: DataService.getServiceType()

+                }, {

+                    name: FIELD.NAME.MODEL_NAME,

+                    value: model.modelName

+                }, {

+                    name: FIELD.NAME.MODEL_VERSION,

+                    value: model.modelVersion

+                }];

+        }

     };

 

-    var getDetailsList = function() {

-    	switch (_this.componentId) {

-    	case COMPONENT.NETWORK:

-    	case COMPONENT.SERVICE:

-    	case COMPONENT.VNF:

-    	case COMPONENT.VF_MODULE:

-    	case COMPONENT.VOLUME_GROUP:

-    	    return ComponentService.getDisplayNames(ComponentService

-    		    .getInventoryParameterList(_this.componentId, DataService

-    			    .getInventoryItem(), false));

-    	}

+    var getDetailsList = function () {

+        switch (_this.componentId) {

+            case COMPONENT.NETWORK:

+            case COMPONENT.SERVICE:

+            case COMPONENT.VNF:

+            case COMPONENT.VF_MODULE:

+            case COMPONENT.VOLUME_GROUP:

+                var model = DataService.getModelInfo(_this.componentId);

+                var metaData = ComponentService.getDisplayNames(ComponentService

+                    .getInventoryParameterList(_this.componentId, DataService

+                        .getInventoryItem(), false));

+                if (model && !UtilityService.isObjectEmpty(model.modelName) && !UtilityService.isObjectEmpty(model.modelVersion)) {

+                    metaData = metaData.concat([

+                        {

+                            id: FIELD.NAME.MODEL_NAME,

+                            name: FIELD.NAME.MODEL_NAME,

+                            value: model.modelName

+                        }, {

+                            id: FIELD.NAME.MODEL_VERSION,

+                            name: FIELD.NAME.MODEL_VERSION,

+                            value: model.modelVersion

+                        }

+                    ]);

+                }

+                return metaData;

+        }

     };

 

-    var getMsoFilterString = function() {

+    var getMsoFilterString = function () {

 

-	var instanceId = "";

+        var instanceId = "";

 

-	switch (_this.componentId) {

-	case COMPONENT.NETWORK:

-	    instanceId = DataService.getNetworkInstanceId();

-	    break;

-	case COMPONENT.SERVICE:

-	    instanceId = DataService.getServiceInstanceId();

-	    break;

-	case COMPONENT.VNF:

-	    instanceId = DataService.getVnfInstanceId();

-	    break;

-	case COMPONENT.VF_MODULE:

-	    instanceId = DataService.getVfModuleInstanceId();

-	    break;

-	case COMPONENT.VOLUME_GROUP:

-	    instanceId = DataService.getVolumeGroupInstanceId();

-	}

+        switch (_this.componentId) {

+            case COMPONENT.NETWORK:

+                instanceId = DataService.getNetworkInstanceId();

+                break;

+            case COMPONENT.SERVICE:

+                instanceId = DataService.getServiceInstanceId();

+                break;

+            case COMPONENT.VNF:

+                instanceId = DataService.getVnfInstanceId();

+                break;

+            case COMPONENT.VF_MODULE:

+                instanceId = DataService.getVfModuleInstanceId();

+                break;

+            case COMPONENT.VOLUME_GROUP:

+                instanceId = DataService.getVolumeGroupInstanceId();

+        }

 

-	return "filter=" + _this.componentId + "InstanceId:EQUALS:"

-		+ instanceId;

+        return "filter=" + _this.componentId + "InstanceId:EQUALS:"

+            + instanceId;

     };

 

     return {

-	initializeComponent : function(componentId) {

-	    _this.componentId = ComponentService.initialize(componentId);

-	},

-	getComponentDisplayName : ComponentService.getComponentDisplayName,

-	getSummaryList : getSummaryList,

-	getDetailsList : getDetailsList,

-	getMsoFilterString : getMsoFilterString

+        initializeComponent: function (componentId) {

+            _this.componentId = ComponentService.initialize(componentId);

+        },

+        getComponentDisplayName: ComponentService.getComponentDisplayName,

+        getSummaryList: getSummaryList,

+        getDetailsList: getDetailsList,

+        getMsoFilterString: getMsoFilterString

     }

 }

 

-appDS2.factory("DetailsService", [ "$log", "DataService", "ComponentService",

-	"COMPONENT", "FIELD", "UtilityService", DetailsService ]);

+appDS2.factory("DetailsService", ["$log", "DataService", "ComponentService",

+    "COMPONENT", "FIELD", "UtilityService", DetailsService]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/msoService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/msoService.js
index 67211d48..273f8e9e 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/msoService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/msoService.js
@@ -20,7 +20,7 @@
 

 "use strict";

 

-var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityService, COMPONENT, FIELD) {

+var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityService, COMPONENT, FIELD, moment) {

 

     var _this = this;

 

@@ -36,7 +36,7 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
             timeout : PropertyService.getServerResponseTimeoutMsec()

         }).then(successCallbackFunction)["catch"]

         (UtilityService.runHttpErrorHandler);

-    }

+    };

 

     var checkValidStatus = function(response) {

         if (response.data.status < 200 || response.data.status > 202) {

@@ -55,7 +55,7 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
         }

     };

 

-    var buildPayloadForServiceActivateDeactivate = function (model, userId, aicZone) {

+    var buildPayloadForServiceActivateDeactivate = function (model, userId) {

         var requestDetails = {

                 "modelInfo": {

                     "modelType": "service",

@@ -69,10 +69,8 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
                     "requestorId": userId

                 },

                 "requestParameters": {

-                    "userParams": [{

-                        "name": "aic_zone",

-                        "value": aicZone

-                    }]

+                    // aicZone was sent from here

+                    "userParams": []

                 }

         };

 

@@ -83,14 +81,14 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
     };

 

     var activateInstance = function(requestParams) {

-        var requestDetails = buildPayloadForServiceActivateDeactivate(requestParams.model, requestParams.userId, requestParams.aicZone);

+        var requestDetails = buildPayloadForServiceActivateDeactivate(requestParams.model, requestParams.userId);

 

         return sendPostRequest(COMPONENT.MSO_ACTIVATE_INSTANCE.replace('@serviceInstanceId', requestParams.instance.serviceInstanceId),

             requestDetails);

     };

 

     var deactivateInstance = function(requestParams) {

-        var requestDetails = buildPayloadForServiceActivateDeactivate(requestParams.model, requestParams.userId, requestParams.aicZone);

+        var requestDetails = buildPayloadForServiceActivateDeactivate(requestParams.model, requestParams.userId);

 

         return sendPostRequest(COMPONENT.MSO_DEACTIVATE_INSTANCE.replace('@serviceInstanceId', requestParams.instance.serviceInstanceId),

             requestDetails);

@@ -154,7 +152,7 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
             UtilityService.checkUndefined(COMPONENT.STATUS, response.data.status);

             checkValidStatus(response);

 

-            var list = response.data.entity.requestList

+            var list = response.data.entity.requestList;

             UtilityService.checkUndefined(FIELD.ID.REQUEST_LIST, list);

 

             var message = "";

@@ -168,8 +166,10 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
                 if (status === undefined) {

                     message += addListEntry(FIELD.ID.REQUEST_STATUS, undefined) + "\n";

                 } else {

-                    message += addListEntry(FIELD.ID.TIMESTAMP, status.timestamp)

-                        + ",\n";

+                    if(status.finishTime) {

+                        message += addListEntry(FIELD.ID.TIMESTAMP, moment(new Date(status.finishTime)).format("ddd, DD MMM YYYY HH:mm:ss"))

+                            + ",\n";

+                    }

                     message += addListEntry(FIELD.ID.REQUEST_STATE, status.requestState)

                         + ",\n";

                     message += addListEntry(FIELD.ID.REQUEST_STATUS,

@@ -203,7 +203,7 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
                 if (status === undefined) {

                     message += addListEntry(FIELD.ID.REQUEST_STATUS, undefined) + "\n";

                 } else {

-                    message += addListEntry(FIELD.ID.TIMESTAMP, status.timestamp)

+                    message += addListEntry(FIELD.ID.TIMESTAMP, moment(new Date()).format("ddd, DD MMM YYYY HH:mm:ss"))

                         + ",\n";

                     message += addListEntry(FIELD.ID.REQUEST_STATE, status.requestState)

                         + ",\n";

@@ -272,7 +272,7 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
                     showFunction(FIELD.ERROR.SYSTEM_FAILURE, error.message);

                     break;

                 case "msoFailure":

-                    showFunction(FIELD.ERROR.MSO, "")

+                    showFunction(FIELD.ERROR.MSO, "");

                     break;

                 default:

                     showFunction(FIELD.ERROR.SYSTEM_FAILURE);

@@ -341,15 +341,16 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
                             }

                         },

                         {

-                            "relatedInstance": {

-                                "instanceId": requestParams.configurationByPolicy ?

-                                    requestParams.portMirroringConfigFields.destinationInstance.properties['pnfName']:

-                                    requestParams.portMirroringConfigFields.destinationInstance.properties['vnf-id'],

+                            "relatedInstance": requestParams.configurationByPolicy ? {

+                                "instanceName": requestParams.portMirroringConfigFields.destinationInstance.properties['pnfName'],

                                 "instanceDirection": "destination",

-                                "modelInfo":

-                                    requestParams.configurationByPolicy ?

-                                        {"modelType": "pnf"} :

-                                        modelInfoOf(requestParams.portMirroringConfigFields.destinationInstance)

+                                "modelInfo": {

+                                    "modelType": "pnf"

+                                }

+                            } : {

+                                "instanceId": requestParams.portMirroringConfigFields.destinationInstance.properties['vnf-id'],

+                                "instanceDirection": "destination",

+                                "modelInfo": modelInfoOf(requestParams.portMirroringConfigFields.destinationInstance)

                             }

                         }

                     ],

@@ -375,13 +376,31 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
             });

             return deferred.promise;

         },

+        deleteConfiguration: function(requestParams, configuration) {

+

+            var requestDetails = {

+                "modelInfo": requestParams.configurationModel,

+                "cloudConfiguration": {

+                    "lcpCloudRegionId": configuration.configData.cloudRegionId

+                },

+                "requestInfo": {

+                    "source": "VID",

+                    "requestorId": requestParams.userId

+                },

+                "requestParameters": {

+                    "userParams": []

+                }

+            };

 

-        toggleConfigurationStatus: function(requestParams) {

+            var url = "mso/mso_delete_configuration/" + requestParams.serviceInstanceId + "/configurations/" + requestParams.configurationId;

+            return sendPostRequest(url, requestDetails);

+        },

+        toggleConfigurationStatus: function(requestParams, configuration) {

 

             var requestDetails = {

                 "modelInfo": requestParams.configurationModel,

                 "cloudConfiguration": {

-                    "lcpCloudRegionId": "mdt1"

+                    "lcpCloudRegionId": configuration && configuration.configData ? configuration.configData.cloudRegionId : null

                 },

                 "requestInfo": {

                     "source": "VID",

@@ -412,11 +431,12 @@ var MsoService = function($http, $log, $q, PropertyService, AaiService, UtilityS
             return sendPostRequest(url, requestDetails);

         },

 

-        togglePortStatus: function(requestParams) {

+        togglePortStatus: function(requestParams, configuration, defaultParams) {

+

             var requestDetails = {

                 "modelInfo": requestParams.configurationModel,

                 "cloudConfiguration": {

-                    "lcpCloudRegionId": "mdt1"

+                    "lcpCloudRegionId": configuration && configuration.configData ? configuration.configData.cloudRegionId : null

                 },

                 "requestInfo": {

                     "source": "VID",

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/services/utilityService.js b/vid-app-common/src/main/webapp/app/vid/scripts/services/utilityService.js
index 942bd795..b8ef406a 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/services/utilityService.js
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/services/utilityService.js
@@ -63,29 +63,24 @@
  * string for some known conditions.

  */

 

-var UtilityService = function($log, DataService, PARAMETER) {

+var UtilityService = function($log, DataService, PARAMETER, _) {

 

     var _this = this;

+

+    function hasCustomizationUuidFields(mapOfVfs) {

+        return _.some(mapOfVfs, function (o) {

+            return _.has(o, "customizationUuid");

+        });

+    }

+

     var convertModel = function (serviceModel) {

 

-        var isNewFlow = false;

+        var isNewFlow =

+			hasCustomizationUuidFields(serviceModel.networks)

+			|| hasCustomizationUuidFields(serviceModel.pnfs)

+			|| hasCustomizationUuidFields(serviceModel.vnfs)

+			|| hasCustomizationUuidFields(serviceModel.configurations);

 

-        for (var networkCustomizationName in serviceModel.networks) {

-            var networkModel = serviceModel.networks[networkCustomizationName];

-            if ( networkModel.customizationUuid != null ) {

-                isNewFlow = true;

-                break;

-            }

-        }

-        if ( !isNewFlow ) {

-            for (var vnfCustomizationName in serviceModel.vnfs) {

-                var vnfModel = serviceModel.vnfs[vnfCustomizationName];

-                if ( vnfModel.customizationUuid != null ) {

-                    isNewFlow = true;

-                    break;

-                }

-            }

-        }

         if ( isNewFlow ) {

             return (convertNewModel (serviceModel) );

         }

@@ -179,7 +174,7 @@ var UtilityService = function($log, DataService, PARAMETER) {
         	element.isPnf= true;

         	element.modelCustomizationName= key;

         });

-        var mergedVnfs = Object.assign(serviceModel.vnfs, serviceModel.configurations, serviceModel.pnfs);

+        var mergedVnfs = Object.assign({}, serviceModel.vnfs, serviceModel.configurations, serviceModel.pnfs);

 

 		for (var vnfCustomizationName in mergedVnfs) {

 			var vnfModel = mergedVnfs[vnfCustomizationName];

@@ -279,13 +274,13 @@ var UtilityService = function($log, DataService, PARAMETER) {
 				convertedAsdcModel.vnfs[vnfCustomizationUuid]["nfFunction"] = vnf_function;

 				convertedAsdcModel.vnfs[vnfCustomizationUuid]["nfCode"] = vnf_code;

 				//

-				for (var vfModuleCustomizationName in serviceModel.vnfs[vnfCustomizationName].vfModules) {

-					var vfModuleModel = serviceModel.vnfs[vnfCustomizationName].vfModules[vfModuleCustomizationName];

+				for (var vfModuleCustomizationName in vnfModel.vfModules) {

+					var vfModuleModel = vnfModel.vfModules[vfModuleCustomizationName];

 					convertedAsdcModel.vnfs[vnfCustomizationUuid].vfModules[vfModuleModel.customizationUuid] = vfModuleModel;

 				}

 				

-				for (var volumeGroupCustomizationName in serviceModel.vnfs[vnfCustomizationName].volumeGroups) {

-					var volumeGroupModel = serviceModel.vnfs[vnfCustomizationName].volumeGroups[volumeGroupCustomizationName];

+				for (var volumeGroupCustomizationName in mergedVnfs[vnfCustomizationName].volumeGroups) {

+					var volumeGroupModel = mergedVnfs[vnfCustomizationName].volumeGroups[volumeGroupCustomizationName];

 					convertedAsdcModel.vnfs[vnfCustomizationUuid].volumeGroups[volumeGroupModel.customizationUuid] = volumeGroupModel;

 				}

 			}

@@ -391,7 +386,7 @@ var UtilityService = function($log, DataService, PARAMETER) {
             element.isPnf= true;

             element.modelCustomizationName= key;

         });

-        var mergedVnfs = Object.assign(serviceModel.vnfs, serviceModel.configurations, serviceModel.pnfs);

+        var mergedVnfs = Object.assign({}, serviceModel.vnfs, serviceModel.configurations, serviceModel.pnfs);

 

 		for (var vnfCustomizationName in mergedVnfs) {

 			var vnfModel = mergedVnfs[vnfCustomizationName];

@@ -458,13 +453,13 @@ var UtilityService = function($log, DataService, PARAMETER) {
 				convertedAsdcModel.vnfs[vnfModel.uuid].displayInputs=vnfModelDisplayInputs;

 			}

 			

-			for (var vfModuleCustomizationName in serviceModel.vnfs[vnfCustomizationName].vfModules) {

-				var vfModuleModel = serviceModel.vnfs[vnfCustomizationName].vfModules[vfModuleCustomizationName];

+			for (var vfModuleCustomizationName in vnfModel.vfModules) {

+				var vfModuleModel = vnfModel.vfModules[vfModuleCustomizationName];

 				convertedAsdcModel.vnfs[vnfModel.uuid].vfModules[vfModuleModel.uuid] = vfModuleModel;

 			}

 			

-			for (var volumeGroupCustomizationName in serviceModel.vnfs[vnfCustomizationName].volumeGroups) {

-				var volumeGroupModel = serviceModel.vnfs[vnfCustomizationName].volumeGroups[volumeGroupCustomizationName];

+			for (var volumeGroupCustomizationName in vnfModel.volumeGroups) {

+				var volumeGroupModel = vnfModel.volumeGroups[volumeGroupCustomizationName];

 				convertedAsdcModel.vnfs[vnfModel.uuid].volumeGroups[volumeGroupModel.uuid] = volumeGroupModel;

 			}

 		}

@@ -682,4 +677,4 @@ var UtilityService = function($log, DataService, PARAMETER) {
 }

 

 //app.factory("UtilityService", UtilityService);

-appDS2.factory("UtilityService", [ "$log", "DataService", "PARAMETER", UtilityService ]);

+appDS2.factory("UtilityService", [ "$log", "DataService", "PARAMETER", "_", UtilityService ]);

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/change-management.html b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/change-management.html
index 65c8ec71..4f7cc3c0 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/change-management.html
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/change-management.html
@@ -1,3 +1,4 @@
+<script src="../controller/change-management.controller.js"></script>
 <link rel="stylesheet" type="text/css" href="app/vid/styles/change-management.css" />
 <link rel="stylesheet" type="text/css" href="app/vid/styles/change-management-icons.css" />
 <div class="changes-management">
@@ -46,20 +47,29 @@
                             </thead>
                             <tbody ng-show="!collapseInProgress">
 
-                                <tr  data-tests-id="active-table-cm-row" ng-repeat="changeManagement in vm.changeManagements | changeManagementsByStatuses:{statuses: ['FAILED', 'IN_PROGRESS', 'PENDING']}">
-                                    <th scope="row">{{changeManagement.instanceReferences.vnfInstanceName || 'No-Instance-Name'}}</th>
+                                <tr  data-tests-id="active-table-cm-row" ng-repeat="changeManagement in vm.changeManagements | changeManagementsByStatuses:{statuses: ['COMPLETE'], notContains: true}">
+                                    <th scope="row">{{
+                                        changeManagement.vnfNameFromScheduler ||
+                                        changeManagement.instanceReferences.vnfInstanceId ||
+                                        'No-Instance-Name'
+                                        }}</th>
                                     <td>{{changeManagement.requestScope}}</td>
                                     <td>{{changeManagement.requestType}}</td>
                                     <td>{{changeManagement.startTime}}</td>
-                                    <td class="centered" ng-if="changeManagement.requestStatus.requestState == 'FAILED'"><span class="icon-x" ng-click="vm.openFailedModal({details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
-                                    <td class="centered" ng-if="changeManagement.requestStatus.requestState == 'IN_PROGRESS'"><span class="icon-process" ng-click="vm.openInProgressModal({details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
-                                    <td class="centered" ng-if="changeManagement.requestStatus.requestState == 'PENDING'"><span class="icon-alert" ng-click="vm.openAlertModal({details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
+                                    <td class="centered" ng-if="changeManagement.requestStatus.requestState.toUpperCase() === 'FAILED'"><span class="icon-x" ng-click="vm.openFailedModal($event, {details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
+                                    <td class="centered" ng-if="changeManagement.requestStatus.requestState.toUpperCase() === 'IN_PROGRESS'"><span class="icon-process" ng-click="vm.openInProgressModal($event, {details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
+                                    <td class="centered"
+                                        ng-if="['PENDING_MANUAL_TASK','PENDING'].indexOf(changeManagement.requestStatus.requestState.toUpperCase()) !== -1"
+                                    ><span class="icon-alert" ng-click="vm.openAlertModal($event, {details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
+                                    <td class="centered"
+                                        ng-if="['FAILED','IN_PROGRESS','PENDING_MANUAL_TASK','PENDING'].indexOf(changeManagement.requestStatus.requestState.toUpperCase()) == -1"
+                                    ><span class="icon-alert" ng-click="vm.openFailedModal($event, {requestState: changeManagement.requestStatus.requestState, details: changeManagement.requestStatus.statusMessage, job: changeManagement})"></span></td>
                                 </tr>
                             </tbody>
                         </table>
                         </div>
                         <div class="table-wrapper">
-                        <table ng-if="vm.hasScheduler" class="table table-bordered"  data-tests-id="pending-table-cm" id="pending-table">
+                        <table class="table table-bordered"  data-tests-id="pending-table-cm" id="pending-table">
                             <thead ng-click="collapsePending=!collapsePending">
                             <tr class="table-headline-row">
                                 <th class="col-md-6">
@@ -96,8 +106,12 @@
                                     <td>{{changeManagement.scheduleRequest.domainData[1].value}}</td>
                                     <td>{{changeManagement.scheduleRequest.createDateTime }}</td><!--| date:"MM/dd/yyyy HH:mm:ss"-->
                                     <td>{{changeManagement.scheduleRequest.status}}</td>
-                                    <td class="centered"><span class="cancel-action" ng-class="{'icon-pending':changeManagement.scheduleRequest.status!=='Deleted', 'icon-deleted': changeManagement.scheduleRequest.status=='Deleted'}"
-                                                                ng-click="vm.openPendingModal($event, changeManagement)"></span></td>
+                                    <td class="centered"><span class="cancel-action"
+                                                               ng-class="{'icon-pending':changeManagement.scheduleRequest.status!=='Deleted', 'icon-deleted': changeManagement.scheduleRequest.status=='Deleted'}"
+                                                               ng-click="vm.openPendingModal($event, changeManagement)"
+                                                               ng-show="vm.isChangeManagementDeleted(changeManagement)"
+                                                               data-tests-id="icon-status-{{changeManagement.scheduleRequest.scheduleId}}"></span>
+                                    </td>
                                 </tr>
                             </tbody>
                         </table>
@@ -127,7 +141,11 @@
                                 <th></th>
                             </tr>
                             <tr ng-repeat="changeManagement in vm.changeManagements | changeManagementsByStatuses:{statuses: ['COMPLETE']}">
-                                <th scope="row">{{changeManagement.instanceReferences.vnfInstanceName || 'No-Instance-Name'}}</th>
+                                <th scope="row">{{
+                                    changeManagement.vnfNameFromScheduler ||
+                                    changeManagement.instanceReferences.vnfInstanceId ||
+                                    'No-Instance-Name'
+                                    }}</th>
                                 <td>{{changeManagement.requestScope}}</td>
                                 <td>{{changeManagement.requestType}}</td>
                                 <td>{{changeManagement.startTime}}</td>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
index ca13ca2b..75f6b68a 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/creationDialog.htm
@@ -1,40 +1,42 @@
-<div ng-controller="creationDialogController">

-

+<div  ng-controller="creationDialogController">

 	<div ng-show="isDialogVisible">

-		<div class="titleLine">

-			<img src="app/vid/images/spinner.gif"

-				ngx-visible="{{isSpinnerVisible}}"></img>

-			<h3 data-tests-id="create-modal-title">Create {{componentName}} -- {{createType}}</h3>

-		</div>

-

-		<div class="error" ng-show="isErrorVisible">

-			<img src="app/vid/images/error.png"></img>{{error}}

-		</div>

+		<iframe class="popup" scrolling="no" ng-if="!shouldShowOldPopup()" id="iframe_callback"  ng-src={{url}}></iframe>

+		<div ng-if="shouldShowOldPopup()">

+			<div class="titleLine">

+				<img src="app/vid/images/spinner.gif"

+					ngx-visible="{{isSpinnerVisible}}"></img>

+				<h3 data-tests-id="create-modal-title">Create {{componentName}} -- {{createType}}</h3>

+			</div>

 

-		<div ngx-visible="{{isDataVisible}}">

-			<parameter-block control="summaryControl"></parameter-block>

-			<h4>

-				User Provided Data (<img class="requiredIndicator"

-					src="app/vid/images/asterisk.png" height='10' width='10'></img> indicates required field)

-			</h4>

-			<parameter-block control="userProvidedControl"

-				callback="userParameterChanged(id);" editable></parameter-block>

-			<div class="prompt">

-				<p>

-					Enter Data and <span>Confirm</span> to<br />Create <span>{{componentName}}</span>

-				</p>

-				<p>

-					<span>Cancel</span> to Return to Previous Page.<br />Data entered

-					will be lost

-				</p>

+			<div class="error" ng-show="isErrorVisible">

+				<img src="app/vid/images/error.png"></img>{{error}}

 			</div>

 

-		</div>

-		<div class="buttonRow">

-			<button data-tests-id="confirmButton" ngx-enabled="{{isConfirmEnabled}}" att-button size="small"

-				ng-click="confirm();">Confirm</button>

-			<button type="button" data-tests-id="cancelButton" ng-click="cancel();" att-button

-				btn-type="primary" size="small">Cancel</button>

+			<div ngx-visible="{{isDataVisible}}">

+				<parameter-block control="summaryControl"></parameter-block>

+				<h4>

+					User Provided Data (<img class="requiredIndicator"

+						src="app/vid/images/asterisk.png" height='10' width='10'></img> indicates required field)

+				</h4>

+				<parameter-block control="userProvidedControl"

+					callback="userParameterChanged(id);" editable></parameter-block>

+				<div class="prompt">

+					<p>

+						Enter Data and <span>Confirm</span> to<br />Create <span>{{componentName}}</span>

+					</p>

+					<p>

+						<span>Cancel</span> to Return to Previous Page.<br />Data entered

+						will be lost

+					</p>

+				</div>

+

+			</div>

+			<div class="buttonRow">

+				<button data-tests-id="confirmButton" ngx-enabled="{{isConfirmEnabled}}" att-button size="small"

+					ng-click="confirm();">Confirm</button>

+				<button type="button" data-tests-id="cancelButton" ng-click="cancel();" att-button

+					btn-type="primary" size="small">Cancel</button>

+			</div>

 		</div>

 	</div>

 

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm
index 0e72e772..7aebfd38 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/detailsDialog.htm
@@ -38,10 +38,10 @@
 

 	<h4>Instantiation Transactions</h4>

 

-	<pre class="log">{{log}}</pre>

+	<pre data-tests-id="detailsLog" class="log">{{log}}</pre>

 

 	<div class="buttonRow">

-		<button type="button" ng-click="close();" att-button

+			<button type="button" ng-click="close();" att-button data-tests-id="detailsCloseBtn"

 			btn-type="primary" size="small">Close</button>

 	</div>

 

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/iframe.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/iframe.htm
new file mode 100644
index 00000000..a708af99
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/iframe.htm
@@ -0,0 +1 @@
+<iframe ng-src="{{url}}"></iframe>
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/iframeDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/iframeDialog.htm
new file mode 100644
index 00000000..3b2da52f
--- /dev/null
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/iframeDialog.htm
@@ -0,0 +1,6 @@
+<div  ng-controller="iframeDialogController">
+	<div ng-if="isDialogVisible">
+		<iframe class="popup iframeDialog" scrolling="no" id="iframe_callback"  ng-src={{url}}></iframe>
+	</div>
+	<div ng-include="'app/vid/scripts/view-models/msoCommit.htm'"></div>
+</div>
\ No newline at end of file
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm
index 0740c07e..64f71325 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/instantiate.htm
@@ -18,7 +18,7 @@
   ============LICENSE_END=========================================================

   -->

 

-<div ng-controller="InstantiationController">

+<div>

 

 	<div popup-window class="popupContents" ngx-show="{{popup.isVisible}}"

 		 ng-cloak>

@@ -26,6 +26,7 @@
 		<div ng-include="'app/vid/scripts/view-models/deleteResumeDialog.htm'"></div>

 		<div ng-include="'app/vid/scripts/view-models/detailsDialog.htm'"></div>

 		<div ng-include="'app/vid/scripts/view-models/statusDialog.htm'"></div>

+	    <div ng-include="'app/vid/scripts/view-models/iframeDialog.htm'"></div>

 	</div>

 	<div ng-controller="aaiSubscriberController" ng-init="getComponentList() ">

 		<div class="statusLine" ng-class="{true:'aaiVisible', false:'aaiHidden'}[isSpinnerVisible]">

@@ -33,272 +34,441 @@
 			<label>Status:</label><span class="status">{{status}}</span>

 		</div>

 

-		<div ng-if="errorMsg != null"><font color='red'>{{errorMsg}}<pre>{{errorDetails | json}}</pre></font></div>

-

-		<h1 class="heading1" style="margin-top: 20px;">{{isPermitted ? "View/Edit" : "View"}} Service Instance</h1>

-		<a class="btn btn-primary btn-xs pull-right" ng-click="reloadRoute();" ><span class="glyphicon glyphicon-refresh"></span></a>

-

-		<br>

-

-		<center>

-			<table att-table border="1" ng-model="service">

-				<tr>

-					<th style="text-align: center" width="33%">SUBSCRIBER:

-						{{service.instance.subscriberName}}</th>

-					<th style="text-align: center" width="34%">SERVICE TYPE:

-						{{service.instance.serviceType}}</th>

-					<th data-tests-id="service-instanceId-th-id" style="text-align: center" width="33%">SERVICE INSTANCE

-						ID: {{service.instance.serviceInstanceId}}</th>

-				<tr>

-				<tr>

-					<td colspan='3' style="text-align: center">Service Instance

-						Name: {{service.instance.name || "Not defined"}}

-					</td>

-				<tr>

-			</table>

-

-		</center>

-

-		<div ui-tree data-drag-enabled="false" data-nodrop-enabled="true" style="margin: 30px">

-

-			<ol ui-tree-nodes="" ng-model="service"  >

-				<li ng-repeat="aService in [service]" ui-tree-node>

-					<div ui-tree-handle class="tree-node tree-node-content">

-						<a class="btn btn-success btn-xs" ng-if="(aService.instance.vnfs && aService.instance.vnfs.length > 0) ||(aService.instance.pnfs && aService.instance.pnfs.length > 0) || (aService.instance.networks && aService.instance.networks.length > 0)" data-nodrag ng-click="this.toggle()">

-							<span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

-						</a>

-						SERVICE INSTANCE: {{aService.instance.name}} | ORCH STATUS: {{serviceOrchestrationStatus}}

-						<a ng-if="((isMacro()) ||  (isObjectEmpty(aService.instance.vnfs) && isObjectEmpty(aService.instance.networks) && isObjectEmpty(aService.instance.pnfs))) && isPermitted" data-tests-id="deleteServiceButton" class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteService(aService.instance);">

-							<span class="glyphicon glyphicon-remove"></span>

-						</a>

-						<div class="pull-right btn-group" ng-if="(aService.convertedModel.vnfs||aService.convertedModel.vnfs) &&(!isObjectEmpty(aService.convertedModel.pnfs)||!isObjectEmpty(aService.convertedModel.pnfs))  && !aService.convertedModel.isNewFlow && isPermitted">

-							<button type="button" data-tests-id="addVNFButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-								Add node instance<span class="caret"></span>

-							</button>

-							<ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs">

-								<a role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs" data-tests-id="addVNFOption-{{vnf.modelCustomizationName}}" ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}}</a>

-

-							</ul>

-						</div>

-						<div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs && !isObjectEmpty(aService.convertedModel.vnfs) && aService.convertedModel.isNewFlow && isPermitted">

-							<button type="button" data-tests-id="addVNFButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-								Add node instance<span class="caret"></span>

-							</button>

-							<ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs" data-tests-id="addVnfsDropdown">

-								<li role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs">

-									<a data-tests-id="addVNFOption-{{vnf.modelCustomizationName}}" ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}} {{vnf.nfType}} {{vnf.nfRole}} {{vnf.nfFunction}} {{vnf.nfCode}}</a>

-								</li>

-							</ul>

-						</div>

-						<!--  <div class="pull-right btn-group" ng-if="aService.model.networks && !equals(aService.model.networks, {})">-->

-						<div class="pull-right btn-group" ng-if="aService.convertedModel.networks && (!(isObjectEmpty(aService.convertedModel.networks))) && isPermitted">

-							<!--<div class="pull-right btn-group" ng-if="aService.model.networks">-->

-							<button type="button" data-tests-id="addNetworkButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-								Add Network<span class="caret"></span>

-							</button>

-							<ul class="dropdown-menu" ng-model="aService.convertedModel.networks">

-								<li ng-repeat="(networkUuid, network) in aService.convertedModel.networks">

-									<a data-tests-id="addNetworkOption-{{network.modelCustomizationName}}" ng-click="addNetworkInstance(network, aService.instance.vnfs)">{{network.modelCustomizationName}}</a>

-								</li>

-							</ul>

-						</div>

-						<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeService(aService.instance)" style="margin-right: 8px;">

-							<span class="glyphicon glyphicon-info-sign"></span>

-						</a>

-						<a data-tests-id="deactivateButton" ng-disabled="!isActivateDeactivateEnabled('deactivate')" class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="deactivateMSOInstance()" style="margin-right: 8px;">

-							Deactivate

-						</a>

-						<a data-tests-id="activateButton" ng-disabled="!isActivateDeactivateEnabled('activate')" class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="activateMSOInstance()" style="margin-right: 8px;">

-							Activate

-						</a>

-					</div>

-					<ol ui-tree-nodes="" ng-model="aService.instance.vnfs" ng-class="{hidden: collapsed}">

-						<li ng-repeat="vnf in aService.instance.vnfs" ui-tree-node>

-							<div ui-tree-handle class="tree-node tree-node-content">

-								<a class="btn btn-success btn-xs" ng-if="(vnf.vfModules && vnf.vfModules.length > 0) || (vnf.volumeGroups && vnf.volumeGroups.length > 0)" data-nodrag ng-click="this.toggle()">

-									<span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

-								</a>

-								VNF: {{vnf.name}} | TYPE: {{vnf.nodeType}} | ORCH STATUS: {{vnf.nodeStatus}}

-

-								<a ng-if="(vnf.vfModules.length == 0) && (vnf.volumeGroups.length == 0) && isPermitted" data-tests-id="deleteVNFButton" class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVnf(aService.instance, vnf)">

-									<span class="glyphicon glyphicon-remove"></span>

-								</a>

-								<!--  <div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs[vnf.object['model-invariant-id']][vnf.object['model-version-id']].vfModules">-->

-								<div class="pull-right btn-group" ng-if="(hasVfModules(vnf.object) && (aService.convertedModel.isNewFlow)) && isPermitted">

-

-									<button type="button" data-tests-id="addVFModuleButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-										Add VF-Module<span class="caret"></span>

-									</button>

-									<ul class="dropdown-menu" ng-model="vfModule" >

-										<a ng-repeat="(vfModuleCustomizationUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].vfModules" data-tests-id="addVFModuleOption-{{vfModule.modelCustomizationName}}" ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}} </a>

-									</ul>

-								</div>

-

-

-								<div class="pull-right btn-group" ng-if="(hasVfModules(vnf.object) && (!(aService.convertedModel.isNewFlow))) && isPermitted">

-

-									<button type="button" data-tests-id="addVFModuleButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-										Add VF-Module<span class="caret"></span>

-									</button>

-									<ul class="dropdown-menu" ng-model="vnf">

-										<a ng-repeat="(vfModuleUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-version-id']].vfModules" data-tests-id="addVFModuleOption-{{vfModule.modelCustomizationName}}" ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}}</a>

-										</li>

-									</ul>

-

-								</div>

-

-								<div class="pull-right btn-group" ng-if="(hasVolumeGroups(vnf.object) && (aService.convertedModel.isNewFlow)) && isPermitted">

-									<button type="button" data-tests-id="addVolumeGroupButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-										Add Volume Group<span class="caret"></span>

-									</button>

-									<ul class="dropdown-menu" ng-model="volumeGroup" >

-										<a ng-repeat="(volumeGroupCustomizationUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].volumeGroups" data-tests-id="addVolumeGroupOption-{{volumeGroup.modelCustomizationName}}" ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>

-									</ul>

-								</div>

-

-								<div class="pull-right btn-group" ng-if="(hasVolumeGroups(vnf.object) && (!(aService.convertedModel.isNewFlow))) && isPermitted">

-

-									<button type="button" data-tests-id="addVolumeGroupButton" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-										Add Volume Group<span class="caret"></span>

-									</button>

-									<ul class="dropdown-menu" ng-model="vnf">

-										<a ng-repeat="(volumeGroupUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-version-id']].volumeGroups" data-tests-id="addVolumeGroupOption-{{volumeGroup.modelCustomizationName}}" ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>

-										</li>

-									</ul>

-

-								</div>

-

-								<!-- VID-374/378 - switching-off feature <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="getStatusOfVnf(aService.instance, vnf)" style="margin-right: 8px;">

-                                    <span class="glyphicon glyphicon-exclamation-sign"></span>

-                                </a>  -->

-								<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVnf(aService.instance, vnf)" style="margin-right: 8px;">

-									<span class="glyphicon glyphicon-info-sign"></span>

-								</a>

-							</div>

-							<ol ui-tree-nodes="" ng-model="vnf.vfModules" ng-class="{hidden: collapsed}">

-								<li ng-repeat="vfModule in vnf.vfModules" ui-tree-node>

-									<div ui-tree-handle class="tree-node tree-node-content">

-										<a class="btn btn-success btn-xs" ng-if="(vfModule.volumeGroups && vfModule.volumeGroups.length > 0)" data-nodrag ng-click="this.toggle()">

-											<span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

-										</a>

-										VFMODULE: {{vfModule.name}} | TYPE: {{vfModule.nodeType}} | ORCH STATUS: {{vfModule.nodeStatus}}

-										<!--  -->

-										<a class="pull-right btn btn-danger btn-xs" ng-if="isPermitted" data-tests-id="deleteVFModuleButton-{{vfModule.name}}" data-nodrag ng-click="deleteVfModule(aService.instance, vfModule, vnf)">

-											<span class="glyphicon glyphicon-remove"></span>

-										</a>

-										<div class="pull-right btn-group">

-											<!--   <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

-                                                Attach Volume Group<span class="caret"></span>

-                                              </button>

-                                              <ul class="dropdown-menu" ng-model="vnf.volumeGroups">

-                                                <li ng-repeat="volumeGroup in vnf.availableVolumeGroups">

-                                                    <a ng-click="attachVolumeGroupInstance(vfModule, volumeGroup)">{{volumeGroup.name}}</a>

-                                                </li>

-                                              </ul> -->

-										</div>

-										<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVfModule(aService.instance, vfModule, vnf)" style="margin-right: 8px;">

-											<span class="glyphicon glyphicon-info-sign"></span>

-										</a>

-										<div class="resume" ng-if="isPermitted&&(vfModule.nodeStatus==resumeStatus)">

-											<a data-tests-id="resumeVFModuleButton-{{vfModule.name}}" class="pull-right btn btn-success btn-xs button-margin" ng-click="resume(aService.instance, vfModule, vnf)" >

-												Resume

-											</a>

-										</div>

-

-									</div>

-									<ol ui-tree-nodes="" ng-model="vfModule.volumeGroups" ng-class="{hidden: collapsed}">

-										<li ng-repeat="volumeGroup in vfModule.volumeGroups" ui-tree-node>

-											<div ui-tree-handle class="tree-node tree-node-content">

-												VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}} | ORCH STATUS: {{volumeGroup.nodeStatus}}

-												<!-- <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVolumeGroup(aService.instance, vnf, vfModule, volumeGroup)">

-                                                    <span class="glyphicon glyphicon-remove"></span>

-                                                </a> -->

-												<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)" style="margin-right: 8px;">

-													<span class="glyphicon glyphicon-info-sign"></span>

-												</a>

-											</div>

-										</li>

-									</ol>

-								</li>

-							</ol>

-							<ol ui-tree-nodes="" ng-model="vnf.availableVolumeGroups" ng-class="{hidden: collapsed}">

-								<li ng-repeat="volumeGroup in vnf.availableVolumeGroups" ui-tree-node>

-									<div ui-tree-handle class="tree-node tree-node-content">

-										VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}} | ORCH STATUS: {{volumeGroup.nodeStatus}}

-										<a class="pull-right btn btn-danger btn-xs" ng-if="isPermitted" data-tests-id="deleteVNFVolumeGroupButton" data-nodrag ng-click="deleteVnfVolumeGroup(aService.instance, vnf, volumeGroup)">

-											<span class="glyphicon glyphicon-remove"></span>

-										</a>

-										<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)" style="margin-right: 8px;">

-											<span class="glyphicon glyphicon-info-sign"></span>

-										</a>

-									</div>

-								</li>

-							</ol>

-						</li>

-					</ol>

-

-					<ol ui-tree-nodes="" ng-model="aService.instance.networks" ng-class="{hidden: collapsed}">

-						<li ng-repeat="network in aService.instance.networks" ui-tree-node>

-							<div ui-tree-handle class="tree-node tree-node-content">

-								NETWORK: {{network.name}} | TYPE: {{network.nodeType}} | ORCH	STATUS: {{network.nodeStatus}}

-

-								<a class="pull-right btn btn-danger btn-xs" ng-if="!isMacro() && isPermitted" data-tests-id="deleteNetworkButton" data-nodrag ng-click="deleteNetwork(aService.instance, network)">

-									<span class="glyphicon glyphicon-remove"></span>

-								</a>

-								<!--  <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteNetwork(aService.instance, network)">

-                                   <span class="glyphicon glyphicon-remove"></span>

-                               </a>-->

-								<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="describeNetwork(aService.instance, network)" style="margin-right: 8px;">

-									<span class="glyphicon glyphicon-info-sign"></span>

-								</a>

-							</div>

-						</li>

-					</ol>

-

-

-					<ol ui-tree-nodes="" ng-model="aService.instance.configurations" ng-class="{hidden: collapsed}">

-						<li ng-repeat="configuration in aService.instance.configurations" ui-tree-node>

-							<div ui-tree-handle class="tree-node tree-node-content">

-								<a class="btn btn-success btn-xs" ng-if="(configuration.ports && configuration.ports.length > 0)" data-nodrag ng-click="this.toggle()">

-									<span class="glyphicon" ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

-								</a>

-								CONFIGURATION: {{configuration.name}} | TYPE: {{configuration.nodeType}} | ORCH	STATUS: {{configuration.nodeStatus}}

-

-								<a class="pull-right btn btn-danger btn-xs" ng-if="!isMacro() && isPermitted && configuration.nodeStatus === STATUS_CONSTANTS.AAI_INACTIVE" data-tests-id="deleteConfigurationButton" data-nodrag ng-click="deleteConfiguration(aService.instance, configuration)">

-									<span class="glyphicon glyphicon-remove"></span>

-								</a>

-

-								<a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="toggleConfigurationStatus(aService, configuration)" ng-if="isPermitted && allowConfigurationActions">

-									{{configuration.nodeStatus === STATUS_CONSTANTS.AAI_ACTIVE ? "Deactivate" : "Activate"}}

-								</a>

-							</div>

-							<ol ui-tree-nodes="" ng-model="configuration.ports" ng-class="{hidden: collapsed}">

-								<li ng-repeat="port in configuration.ports" ui-tree-node>

-									<div ui-tree-handle class="tree-node tree-node-content">

-										PORT: {{port.portName}} | ORCH STATUS: {{port.portStatus}}

-

-										<button type="button" class="pull-right btn btn-primary btn-xs" ng-if="configuration.nodeStatus == STATUS_CONSTANTS.AAI_ACTIVE" ng-click="togglePortStatus(aService, configuration, port)">

-											{{port.portStatus === STATUS_CONSTANTS.AAI_ENABLED ? "Disable" : "Enable"}}

-										</button>

-									</div>

-								</li>

-							</ol>

-						</li>

-					</ol>

-

-					<ol id="pnfs-tree" ui-tree-nodes="" ng-model="pnfs" ng-class="{hidden: collapsed || pnf.length === 0}">

-						<li ng-repeat="pnf in pnfs" ui-tree-node>

-							<div ui-tree-handle class="tree-node tree-node-content">

-								PNF: {{pnf}}

-

-								<a class="dissociate-pnf pull-right btn btn-primary btn-xs" data-nodrag ng-click="dissociatePnf(pnf)" style="margin-right: 8px;">

-									<span>Dissociate</span>

-								</a>

-							</div>

-						</li>

-					</ol>

-				</li>

-			</ol>

-		</div>

-	</div>

+        <div ng-if="errorMsg != null" style="white-space: pre-line"><font color='red'>{{errorMsg}}

+            <pre>{{errorDetails | json}}</pre>

+        </font></div>

+

+        <h1 class="heading1" style="margin-top: 20px;">{{isPermitted ? "View/Edit" : "View"}} Service Instance</h1>

+        <a class="btn btn-primary btn-xs pull-right" ng-click="reloadRoute();"><span

+                class="glyphicon glyphicon-refresh"></span></a>

+

+        <br>

+

+        <center>

+            <table att-table border="1" ng-model="service">

+                <tr>

+                    <th style="text-align: center" width="33%">SUBSCRIBER:

+                        {{service.instance.subscriberName}}

+                    </th>

+                    <th style="text-align: center" width="34%">SERVICE TYPE:

+                        {{service.instance.serviceType}}

+                    </th>

+                    <th data-tests-id="service-instanceId-th-id" style="text-align: center" width="33%">SERVICE INSTANCE

+                        ID: {{service.instance.serviceInstanceId}}

+                    </th>

+                <tr>

+                <tr>

+                    <td colspan='3' style="text-align: center">Service Instance

+                        Name: {{service.instance.name || "Not defined"}}

+                    </td>

+                <tr>

+            </table>

+

+        </center>

+

+        <div ui-tree data-drag-enabled="false" data-nodrop-enabled="true" style="margin: 30px">

+

+            <ol ui-tree-nodes="" ng-model="service">

+                <li ng-repeat="aService in [service]" ui-tree-node>

+

+                    <div ng-if="isCR && collectionResource != null">

+                        <div ui-tree-handle class="tree-node tree-node-content">

+                            <a class="btn btn-success btn-xs" data-nodrag ng-click="this.toggle()">

+                                <span class="glyphicon"

+                                      ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

+                            </a>

+                            SERVICE INSTANCE: {{aService.instance.name}} | ORCH STATUS: {{serviceOrchestrationStatus}}

+                            <a ng-if="isPermitted" data-tests-id="deleteServiceButton"

+                               class="pull-right btn btn-danger btn-xs" data-nodrag

+                               ng-click="deleteService(aService.instance);">

+                                <span class="glyphicon glyphicon-remove"></span>

+                            </a>

+

+                            <a class="pull-right btn btn-primary btn-xs" data-tests-id="infoServiceButton" data-nodrag

+                               ng-click="describeService(aService.instance)" style="margin-right: 8px;">

+                                <span class="glyphicon glyphicon-info-sign service-info"></span>

+                            </a>

+                        </div>

+                        <ol ui-tree-nodes="" ng-model="collections" ng-class="{hidden: collapsed}">

+                            <li ng-repeat="collection in collections" ui-tree-node>

+                                <div ui-tree-handle class="tree-node tree-node-content" data-tests-id="collectionDiv">

+                                    <a class="btn btn-success btn-xs" data-nodrag ng-click="this.toggle()">

+                                        <span class="glyphicon"

+                                              ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

+                                    </a>

+                                    COLLECTION: {{collection["collection-name"]}} | TYPE:

+                                    {{collection["collection-type"]}}

+                                </div>

+                                <ol ui-tree-nodes="" ng-model="networks" ng-class="{hidden: collapsed}">

+                                    <li ng-repeat="network in networks" ui-tree-node>

+                                        <div ui-tree-handle class="tree-node tree-node-content"

+                                             data-tests-id="collectionNetworkDiv">

+                                            NETWORK INSTANCE GROUP: {{network["network-id"]}} | ROLE:

+                                            {{network["network-role"]}} | TYPE: {{network["network-type"]}} | # OF

+                                            NETWORKS: {{collectionResource.networks.length}}

+                                        </div>

+                                    </li>

+                                </ol>

+                            </li>

+                        </ol>

+                    </div>

+                    <div ng-if="!isCR">

+                        <div ui-tree-handle class="tree-node tree-node-content">

+                            <a class="btn btn-success btn-xs"

+                               ng-if="(aService.instance.vnfs && aService.instance.vnfs.length > 0) ||(aService.instance.pnfs && aService.instance.pnfs.length > 0) || (aService.instance.networks && aService.instance.networks.length > 0)"

+                               data-nodrag ng-click="this.toggle()">

+                                <span class="glyphicon"

+                                      ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

+                            </a>

+                            SERVICE INSTANCE: {{aService.instance.name}} | ORCH STATUS: {{serviceOrchestrationStatus}}

+                            <a ng-if="((isMacro()) ||  (isObjectEmpty(aService.instance.vnfs) && isObjectEmpty(aService.instance.networks) && isObjectEmpty(aService.instance.pnfs))) && isPermitted"

+                               data-tests-id="deleteServiceButton" class="pull-right btn btn-danger btn-xs" data-nodrag

+                               ng-click="deleteService(aService.instance, serviceOrchestrationStatus);">

+                                <span class="glyphicon glyphicon-remove"></span>

+                            </a>

+                            <div class="pull-right btn-group"

+                                 ng-if="(aService.convertedModel.vnfs||aService.convertedModel.vnfs) &&(!isObjectEmpty(aService.convertedModel.pnfs)||!isObjectEmpty(aService.convertedModel.pnfs))  && !aService.convertedModel.isNewFlow && isPermitted">

+                                <button type="button" data-tests-id="addVNFButton"

+                                        class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                        aria-haspopup="true" aria-expanded="false">

+                                    Add node instance<span class="caret"></span>

+                                </button>

+                                <ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs">

+                                    <a role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs"

+                                       data-tests-id="addVNFOption-{{vnf.modelCustomizationName}}"

+                                       ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}}</a>

+

+                                </ul>

+                            </div>

+                            <div class="pull-right btn-group"

+                                 ng-if="aService.convertedModel.vnfs && !isObjectEmpty(aService.convertedModel.vnfs) && aService.convertedModel.isNewFlow && isPermitted">

+                                <button type="button" data-tests-id="addVNFButton"

+                                        class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                        aria-haspopup="true" aria-expanded="false">

+                                    Add node instance<span class="caret"></span>

+                                </button>

+                                <ul class="dropdown-menu" ng-model="aService.convertedModel.vnfs"

+                                    data-tests-id="addVnfsDropdown">

+                                    <li role="menuitem" ng-repeat="(vnfUuid, vnf) in aService.convertedModel.vnfs">

+                                        <a data-tests-id="addVNFOption-{{vnf.modelCustomizationName}}"

+                                           ng-click="addVnfInstance(vnf, aService.instance.vnfs)">{{vnf.modelCustomizationName}}

+                                            {{vnf.nfType}} {{vnf.nfRole}} {{vnf.nfFunction}} {{vnf.nfCode}}</a>

+                                    </li>

+                                </ul>

+                            </div>

+                            <!--  <div class="pull-right btn-group" ng-if="aService.model.networks && !equals(aService.model.networks, {})">-->

+                            <div class="pull-right btn-group"

+                                 ng-if="aService.convertedModel.networks && (!(isObjectEmpty(aService.convertedModel.networks))) && isPermitted">

+                                <!--<div class="pull-right btn-group" ng-if="aService.model.networks">-->

+                                <button type="button" data-tests-id="addNetworkButton"

+                                        class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                        aria-haspopup="true" aria-expanded="false">

+                                    Add Network<span class="caret"></span>

+                                </button>

+                                <ul class="dropdown-menu" ng-model="aService.convertedModel.networks">

+                                    <li ng-repeat="(networkUuid, network) in aService.convertedModel.networks">

+                                        <a data-tests-id="addNetworkOption-{{network.modelCustomizationName}}"

+                                           ng-click="addNetworkInstance(network, aService.instance.vnfs)">{{network.modelCustomizationName}}</a>

+                                    </li>

+                                </ul>

+                            </div>

+                            <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                               ng-click="describeService(aService.instance)" style="margin-right: 8px;">

+                                <span class="glyphicon glyphicon-info-sign service-info"></span>

+                            </a>

+                            <a data-tests-id="deactivateButton" ng-disabled="!isActivateDeactivateEnabled('deactivate')"

+                               class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="deactivateMSOInstance()"

+                               style="margin-right: 8px;">

+                                Deactivate

+                            </a>

+                            <a data-tests-id="activateButton" ng-disabled="!isActivateDeactivateEnabled('activate')"

+                               class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="activateMSOInstance()"

+                               style="margin-right: 8px;">

+                                Activate

+                            </a>

+                            <a data-tests-id="showAssignmentsButton" ng-disabled="!isShowAssignmentsEnabled()"

+                               class="pull-right btn btn-primary btn-xs" data-nodrag style="margin-right: 8px;"

+                               target="_blank" ng-href="{{showAssignmentsSDNC()}}">

+                                Show Assignments

+                            </a>

+                            <a data-tests-id="verifyServiceButton" ng-if="isShowVerifyService()" ng-disabled="!isEnableVerifyService()"

+                               class="pull-right btn btn-primary btn-xs" data-nodrag style="margin-right: 8px;"

+                               target="_blank" ng-click="activateVerifyService()">

+                                Verify Service

+                            </a>

+                        </div>

+                        <ol ui-tree-nodes="" ng-model="aService.instance.vnfs" ng-class="{hidden: collapsed}">

+                            <li ng-repeat="vnf in aService.instance.vnfs" ui-tree-node>

+                                <div ui-tree-handle class="tree-node tree-node-content">

+                                    <a class="btn btn-success btn-xs"

+                                       ng-if="(vnf.vfModules && vnf.vfModules.length > 0) || (vnf.volumeGroups && vnf.volumeGroups.length > 0)"

+                                       data-nodrag ng-click="this.toggle()">

+                                        <span class="glyphicon"

+                                              ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

+                                    </a>

+                                    VNF: {{vnf.name}} | TYPE: {{vnf.nodeType}} | ORCH STATUS: {{vnf.nodeStatus}}

+

+                                    <a ng-if="(vnf.vfModules.length == 0) && (vnf.volumeGroups.length == 0) && isPermitted"

+                                       data-tests-id="deleteVNFButton" class="pull-right btn btn-danger btn-xs"

+                                       data-nodrag ng-click="deleteVnf(aService.instance, vnf)">

+                                        <span class="glyphicon glyphicon-remove"></span>

+                                    </a>

+                                    <!--  <div class="pull-right btn-group" ng-if="aService.convertedModel.vnfs[vnf.object['model-invariant-id']][vnf.object['model-version-id']].vfModules">-->

+                                    <div class="pull-right btn-group"

+                                         ng-if="(hasVfModules(vnf.object) && (aService.convertedModel.isNewFlow)) && isPermitted">

+

+                                        <button type="button" data-tests-id="addVFModuleButton"

+                                                class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                                aria-haspopup="true" aria-expanded="false">

+                                            Add VF-Module<span class="caret"></span>

+                                        </button>

+                                        <ul class="dropdown-menu" ng-model="vfModule">

+                                            <a ng-repeat="(vfModuleCustomizationUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].vfModules"

+                                               data-tests-id="addVFModuleOption-{{vfModule.modelCustomizationName}}"

+                                               ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}} </a>

+                                        </ul>

+                                    </div>

+

+

+                                    <div class="pull-right btn-group"

+                                         ng-if="(hasVfModules(vnf.object) && (!(aService.convertedModel.isNewFlow))) && isPermitted">

+

+                                        <button type="button" data-tests-id="addVFModuleButton"

+                                                class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                                aria-haspopup="true" aria-expanded="false">

+                                            Add VF-Module<span class="caret"></span>

+                                        </button>

+                                        <ul class="dropdown-menu" ng-model="vnf">

+                                            <a ng-repeat="(vfModuleUuid, vfModule) in aService.convertedModel.vnfs[vnf.object['model-version-id']].vfModules"

+                                               data-tests-id="addVFModuleOption-{{vfModule.modelCustomizationName}}"

+                                               ng-click="addVfModuleInstance(vnf, vfModule)">{{vfModule.modelCustomizationName}}</a>

+                                            </li>

+                                        </ul>

+

+                                    </div>

+

+                                    <div class="pull-right btn-group"

+                                         ng-if="(hasVolumeGroups(vnf.object) && (aService.convertedModel.isNewFlow)) && isPermitted">

+                                        <button type="button" data-tests-id="addVolumeGroupButton"

+                                                class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                                aria-haspopup="true" aria-expanded="false">

+                                            Add Volume Group<span class="caret"></span>

+                                        </button>

+                                        <ul class="dropdown-menu" ng-model="volumeGroup">

+                                            <a ng-repeat="(volumeGroupCustomizationUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-customization-id']].volumeGroups"

+                                               data-tests-id="addVolumeGroupOption-{{volumeGroup.modelCustomizationName}}"

+                                               ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>

+                                        </ul>

+                                    </div>

+

+                                    <div class="pull-right btn-group"

+                                         ng-if="(hasVolumeGroups(vnf.object) && (!(aService.convertedModel.isNewFlow))) && isPermitted">

+

+                                        <button type="button" data-tests-id="addVolumeGroupButton"

+                                                class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown"

+                                                aria-haspopup="true" aria-expanded="false">

+                                            Add Volume Group<span class="caret"></span>

+                                        </button>

+                                        <ul class="dropdown-menu" ng-model="vnf">

+                                            <a ng-repeat="(volumeGroupUuid, volumeGroup) in aService.convertedModel.vnfs[vnf.object['model-version-id']].volumeGroups"

+                                               data-tests-id="addVolumeGroupOption-{{volumeGroup.modelCustomizationName}}"

+                                               ng-click="addVolumeGroupInstance(vnf, volumeGroup)">{{volumeGroup.modelCustomizationName}}</a>

+                                            </li>

+                                        </ul>

+

+                                    </div>

+

+                                    <!-- VID-374/378 - switching-off feature <a class="pull-right btn btn-primary btn-xs" data-nodrag ng-click="getStatusOfVnf(aService.instance, vnf)" style="margin-right: 8px;">

+                                        <span class="glyphicon glyphicon-exclamation-sign"></span>

+                                    </a>  -->

+                                    <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                                       ng-click="describeVnf(aService.instance, vnf)" style="margin-right: 8px;">

+                                        <span class="glyphicon glyphicon-info-sign vnf-info"></span>

+                                    </a>

+                                </div>

+                                <ol ui-tree-nodes="" ng-model="vnf.instanceGroups" ng-class="{hidden: collapsed}">

+                                    <li ng-repeat="instanceGroup in vnf.instanceGroups" ui-tree-node>

+                                        <div ui-tree-handle class="tree-node tree-node-content"

+                                             ng-class="'instanceGroupTreeNode'">

+                                            INSTANCE-GROUP: {{instanceGroup.name}} | TYPE: Instance-Group

+                                        </div>

+

+                                    </li>

+                                </ol>

+

+                                <ol ui-tree-nodes="" ng-model="vnf.vfModules" ng-class="{hidden: collapsed}">

+                                    <li ng-repeat="vfModule in vnf.vfModules" ui-tree-node>

+                                        <div ui-tree-handle class="tree-node tree-node-content"

+                                             ng-class="'vfModuleTreeNode-' + vfModule.nodeStatus.toLowerCase()">

+                                            <a class="btn btn-success btn-xs"

+                                               ng-if="(vfModule.volumeGroups && vfModule.volumeGroups.length > 0)"

+                                               data-nodrag ng-click="this.toggle()">

+                                                <span class="glyphicon"

+                                                      ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

+                                            </a>

+                                            VFMODULE: {{vfModule.name}} | TYPE: {{vfModule.nodeType}} | ORCH STATUS:

+                                            {{vfModule.nodeStatus}}

+                                            <!--  -->

+                                            <a class="pull-right btn btn-danger btn-xs" ng-if="isPermitted"

+                                               data-tests-id="deleteVFModuleButton-{{vfModule.name}}" data-nodrag

+                                               ng-click="deleteVfModule(aService.instance, vfModule, vnf)">

+                                                <span class="glyphicon glyphicon-remove"></span>

+                                            </a>

+                                            <div class="pull-right btn-group">

+                                                <!--   <button type="button" class="btn btn-success btn-xs dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">

+                                                    Attach Volume Group<span class="caret"></span>

+                                                  </button>

+                                                  <ul class="dropdown-menu" ng-model="vnf.volumeGroups">

+                                                    <li ng-repeat="volumeGroup in vnf.availableVolumeGroups">

+                                                        <a ng-click="attachVolumeGroupInstance(vfModule, volumeGroup)">{{volumeGroup.name}}</a>

+                                                    </li>

+                                                  </ul> -->

+                                            </div>

+                                            <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                                               ng-click="describeVfModule(aService.instance, vfModule, vnf)"

+                                               style="margin-right: 8px;">

+                                                <span class="glyphicon glyphicon-info-sign vfmodule-info"></span>

+                                            </a>

+                                            <div class="resume"

+                                                 ng-if="isPermitted && isResumeShown(vfModule.nodeStatus)">

+                                                <a data-tests-id="resumeVFModuleButton-{{vfModule.name}}"

+                                                   class="pull-right btn btn-success btn-xs button-margin"

+                                                   ng-click="resume(aService.instance, vfModule, vnf)">

+                                                    Resume

+                                                </a>

+                                            </div>

+

+                                        </div>

+                                        <ol ui-tree-nodes="" ng-model="vfModule.volumeGroups"

+                                            ng-class="{hidden: collapsed}">

+                                            <li ng-repeat="volumeGroup in vfModule.volumeGroups" ui-tree-node>

+                                                <div ui-tree-handle class="tree-node tree-node-content">

+                                                    VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}}

+                                                    | ORCH STATUS: {{volumeGroup.nodeStatus}}

+                                                    <!-- <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteVolumeGroup(aService.instance, vnf, vfModule, volumeGroup)">

+                                                        <span class="glyphicon glyphicon-remove"></span>

+                                                    </a> -->

+                                                    <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                                                       ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)"

+                                                       style="margin-right: 8px;">

+                                                        <span class="glyphicon glyphicon-info-sign"></span>

+                                                    </a>

+                                                </div>

+                                            </li>

+                                        </ol>

+                                    </li>

+                                </ol>

+                                <ol ui-tree-nodes="" ng-model="vnf.availableVolumeGroups"

+                                    ng-class="{hidden: collapsed}">

+                                    <li ng-repeat="volumeGroup in vnf.availableVolumeGroups" ui-tree-node>

+                                        <div ui-tree-handle class="tree-node tree-node-content">

+                                            VOLUME GROUP: {{volumeGroup.name}} | TYPE: {{volumeGroup.nodeType}} | ORCH

+                                            STATUS: {{volumeGroup.nodeStatus}}

+                                            <a class="pull-right btn btn-danger btn-xs" ng-if="isPermitted"

+                                               data-tests-id="deleteVNFVolumeGroupButton" data-nodrag

+                                               ng-click="deleteVnfVolumeGroup(aService.instance, vnf, volumeGroup)">

+                                                <span class="glyphicon glyphicon-remove"></span>

+                                            </a>

+                                            <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                                               ng-click="describeVolumeGroup(aService.instance, vnf, volumeGroup)"

+                                               style="margin-right: 8px;">

+                                                <span class="glyphicon glyphicon-info-sign volume-group-info"></span>

+                                            </a>

+                                        </div>

+                                    </li>

+                                </ol>

+                            </li>

+                        </ol>

+

+                        <ol ui-tree-nodes="" ng-model="aService.instance.networks" ng-class="{hidden: collapsed}">

+                            <li ng-repeat="network in aService.instance.networks" ui-tree-node>

+                                <div ui-tree-handle class="tree-node tree-node-content">

+                                    NETWORK: {{network.name}} | TYPE: {{network.nodeType}} | ORCH STATUS:

+                                    {{network.nodeStatus}}

+

+                                    <a class="pull-right btn btn-danger btn-xs" ng-if="!isMacro() && isPermitted"

+                                       data-tests-id="deleteNetworkButton" data-nodrag

+                                       ng-click="deleteNetwork(aService.instance, network)">

+                                        <span class="glyphicon glyphicon-remove"></span>

+                                    </a>

+                                    <!--  <a class="pull-right btn btn-danger btn-xs" data-nodrag ng-click="deleteNetwork(aService.instance, network)">

+                                       <span class="glyphicon glyphicon-remove"></span>

+                                   </a>-->

+                                    <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                                       ng-click="describeNetwork(aService.instance, network)"

+                                       style="margin-right: 8px;">

+                                        <span class="glyphicon glyphicon-info-sign network-info"></span>

+                                    </a>

+                                </div>

+                            </li>

+                        </ol>

+

+                        <ol ui-tree-nodes="" ng-model="aService.instance.configurations" ng-class="{hidden: collapsed}">

+                            <li ng-repeat="configuration in aService.instance.configurations" ui-tree-node>

+                                <div ui-tree-handle class="tree-node tree-node-content">

+                                    <a class="btn btn-success btn-xs"

+                                       ng-if="(configuration.ports && configuration.ports.length > 0)" data-nodrag

+                                       ng-click="this.toggle()">

+                                        <span class="glyphicon"

+                                              ng-class="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}"></span>

+                                    </a>

+                                    CONFIGURATION: {{configuration.name}} | TYPE: {{configuration.nodeType}} | ORCH

+                                    STATUS: {{configuration.nodeStatus}}

+

+                                    <a class="pull-right btn btn-danger btn-xs"

+                                       ng-if="!isMacro() && isPermitted && configuration.nodeStatus !== STATUS_CONSTANTS.AAI_ACTIVE"

+                                       ng-disabled="!isConfigurationDataAvailiable(configuration)"

+                                       data-tests-id="deleteConfigurationButton"

+                                       data-nodrag

+                                       ng-click="deleteConfiguration(aService, configuration)">

+                                        <span class="glyphicon glyphicon-remove"></span>

+                                    </a>

+

+

+                                    <a class="pull-right btn btn-primary btn-xs" data-nodrag

+                                       ng-click="toggleConfigurationStatus(aService, configuration)"

+                                       ng-if="isPermitted && allowConfigurationActions"

+                                       ng-disabled="!isConfigurationDataAvailiable(configuration)"

+                                       data-tests-id="activateDeactivateButton">

+                                        {{configuration.nodeStatus === STATUS_CONSTANTS.AAI_ACTIVE ? "Deactivate" :

+                                        "Activate"}}

+                                    </a>

+                                </div>

+                                <ol ui-tree-nodes="" ng-model="configuration.ports" ng-class="{hidden: collapsed}">

+                                    <li ng-repeat="port in configuration.ports" ui-tree-node>

+                                        <div ui-tree-handle class="tree-node tree-node-content">

+                                            PORT: {{port.portName}} | ORCH STATUS: {{port.portStatus}}

+

+                                            <button type="button" data-tests-id="enableDisableButton"

+                                                    class="pull-right btn btn-primary btn-xs"

+                                                    ng-if="configuration.nodeStatus == STATUS_CONSTANTS.AAI_ACTIVE"

+                                                    ng-disabled="!isConfigurationDataAvailiable(configuration)"

+                                                    ng-click="togglePortStatus(aService, configuration, port)">

+                                                {{port.portStatus === STATUS_CONSTANTS.AAI_ENABLED ? "Disable" :

+                                                "Enable"}}

+                                            </button>

+                                        </div>

+                                    </li>

+                                </ol>

+                            </li>

+                        </ol>

+

+                        <ol id="pnfs-tree" ui-tree-nodes="" ng-model="pnfs"

+                            ng-class="{hidden: collapsed || pnf.length === 0}">

+                            <li ng-repeat="pnf in pnfs" ui-tree-node>

+                                <div ui-tree-handle class="tree-node tree-node-content">

+                                    PNF: {{pnf}}

+

+                                    <a class="dissociate-pnf pull-right btn btn-primary btn-xs" data-nodrag

+                                       ng-click="dissociatePnf(pnf)" style="margin-right: 8px;">

+                                        <span>Dissociate</span>

+                                    </a>

+                                </div>

+                            </li>

+                        </ol>

+                    </div>

+                </li>

+            </ol>

+        </div>

+    </div>

 </div>

diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/previousVersionDialog.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/previousVersionDialog.htm
index 2912c70b..10cf3396 100644
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/previousVersionDialog.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/previousVersionDialog.htm
@@ -10,7 +10,7 @@
 		<div class="error" ng-show="isTableErrorVisible">
 			<img src="app/vid/images/error.png"></img>{{error}}
 		</div>
-		<table att-table table-data="tableData" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage">
+		<table att-table table-data="tableData" data-tests-id="Previous-version-pop-up-table" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage">
 		    <thead  att-table-row type="header">
 				<tr>
 					<th att-table-header key="action">Action</th>
@@ -25,8 +25,8 @@
 		        </tr>
 		    </thead>
 		    <tbody att-table-row type="body" row-repeat="row in tableData">
-		        <tr>
-		        	<td att-table-body ><button type=button ng-click="deployService(row)" att-button btn-type="{{deployButtonType}}" size="small">Deploy</button></td>
+		        <tr data-tests-id="Previous-version-pop-up-uuid-{{row['uuid']}}">
+		        	<td att-table-body ><button type=button data-tests-id="deploy-{{row['uuid']}}" ng-click="deployService(row)" att-button btn-type="{{deployButtonType}}" size="small">Deploy</button></td>
 	            	<td att-table-body ng-bind="row['uuid']"></td>
 	            	<td att-table-body ng-bind="row['invariantUUID']"></td>
 	            	<td att-table-body ng-bind="row['name']"></td>
@@ -41,7 +41,7 @@
 		
 		
 		<div class="buttonRow">
-			<button type="button" ng-click="cancelTable();" att-button
+			<button type="button" id="cancel" ng-click="cancelTable();" att-button
 				btn-type="primary" size="small">Cancel</button>
 		</div>
 	</div>
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
index 17b87bfd..44638759 100755
--- a/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
+++ b/vid-app-common/src/main/webapp/app/vid/scripts/view-models/serviceModels.htm
@@ -17,7 +17,6 @@
   limitations under the License.

   ============LICENSE_END=========================================================

   -->

-

 <link rel="stylesheet" type="text/css" href="app/vid/styles/serviceModels.css" />

 <div popup-window class="popupContents" ngx-show="{{popup.isTablePopUpVisible}}" ng-cloak>

 	<div ng-include="'app/vid/scripts/view-models/previousVersionDialog.htm'"/>

@@ -42,8 +41,7 @@
 

 	<h1 class="heading1" style="margin-top:20px;">Browse SDC Service Models</h1>

 	<div style="margin-top:30px" ng-init="getServiceModels();">

-		

-		<table att-table table-data="services" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage">

+		<table data-tests-id="serviceModelsTable" id="sdcModelsTable" att-table table-data="services" view-per-page="viewPerPage" current-page="currentPage" search-category="searchCategory" search-string="searchString" total-page="totalPage">

 		    <thead  att-table-row type="header">

 				<tr>

 					<th att-table-header key="action">Action</th>

@@ -58,21 +56,21 @@
 					<th att-table-header key="actions">Action</th>

 		        </tr>

 		    </thead>

-		    <tbody att-table-row type="body" row-repeat="service in services">

-		        <tr>

-		        	<td att-table-body ><button class="deploy-service-class" type=button data-tests-id="deploy-{{service['uuid']}}" ng-click="deployService(service)" att-button btn-type="{{deployButtonType}}" size="small">Deploy</button></td>

-	            	<td att-table-body ng-bind="service['uuid']"></td>

-	            	<td att-table-body ng-bind="service['invariantUUID']"></td>

-	            	<td att-table-body ng-bind="service['name']"></td>

-	            	<td att-table-body ng-bind="service['version']"></td>

-	            	<td att-table-body ng-bind="service['category']"></td>

-	            	<td att-table-body ng-bind="service['distributionStatus']"></td>

-	            	<td att-table-body ng-bind="service['lastUpdaterUserId']"></td>

-	            	<td att-table-body ng-bind="service['toscaModelUrl']"></td>

-					<td att-table-body ng-show="service.hasPreviousVersion"><button type=button ng-click="loadPreviousVersionData(service['invariantUUID'],service['name'],service['version'])" att-button btn-type="primary" size="small">Previous Versions</button></td>

-	            	<td att-table-body ng-show="!service.hasPreviousVersion">&nbsp;</td>

-		        </tr>     

-		    </tbody>	  

+			<tbody att-table-row type="body" row-repeat="service in services">

+				<tr class="sdcServiceModel" data-tests-id="Browse_SDC_Service_Models-uuid-{{service['uuid']}}">

+					<td class="deploy" att-table-body ><button class="deploy-service-class" type=button data-tests-id="deploy-{{service['uuid']}}" ng-click="deployService(service)" att-button btn-type="{{deployButtonType}}" size="small">Deploy</button></td>

+					<td class="uuid" att-table-body ng-bind="service['uuid']"></td>

+					<td class="invariantUUID" att-table-body data-tests-id="Invariant-{{service['invariantUUID']}}" ng-bind="service['invariantUUID']"></td>

+					<td class="name" att-table-body ng-bind="service['name']"></td>

+					<td class="version" att-table-body ng-bind="service['version']"></td>

+					<td class="category" att-table-body ng-bind="service['category']"></td>

+					<td class="distributionStatus" att-table-body ng-bind="service['distributionStatus']"></td>

+					<td class="lastUpdaterUserId" att-table-body ng-bind="service['lastUpdaterUserId']"></td>

+					<td class="toscaModelUrl" att-table-body ng-bind="service['toscaModelUrl']"></td>

+					<td class="PreviousVersion" att-table-body data-tests-id="PreviousVersion-{{service['invariantUUID']}}" ng-show="service.hasPreviousVersion"><button type=button ng-click="loadPreviousVersionData(service['invariantUUID'],service['name'],service['version'])" att-button btn-type="primary" size="small">Previous Versions</button></td>

+					<td class="hasPreviousVersion" att-table-body ng-show="!service.hasPreviousVersion">&nbsp;</td>

+				</tr>

+			</tbody>

 		</table>

 		<table width='100%'>

 			<tr>

@@ -91,7 +89,7 @@
 					</td>

 			</tr>

 		</table>

-		

+

 	</div>

 	</div>