[PORTAL-16 PORTAL-18] Widget ms; staging

Remove staging repositories from poms.
Add widget microservice code base.
Add portal unit tests.
Repair defects.
Normalize line endings.

Change-Id: Ia5e48da2a3141b352439ecd548cddf918f4df585
Signed-off-by: Christopher Lott (cl778h) <clott@research.att.com>

4 files changed, 633 insertions, 626 deletions

diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html
index a8b20739..40b6fb30 100644
--- a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html
+++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.html
@@ -1,205 +1,211 @@
-<!--

-  ================================================================================

-  ECOMP Portal

-  ================================================================================

-  Copyright (C) 2017 AT&T Intellectual Property

-  ================================================================================

-  Licensed under the Apache License, Version 2.0 (the "License");

-  you may not use this file except in compliance with the License.

-  You may obtain a copy of the License at

-  

-       http://www.apache.org/licenses/LICENSE-2.0

-  

-  Unless required by applicable law or agreed to in writing, software

-  distributed under the License is distributed on an "AS IS" BASIS,

-  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

-  See the License for the specific language governing permissions and

-  limitations under the License.

-  ================================================================================

-  -->

-<div class="microservice-add-details-model">

-	<div id="microservice-add-details-title" class="title">microservice Details</div>

-

-	<div id="microservices" class="microservice-scrolling-table">

-		<div class="microservice-properties-main"

-			scroll-top="microserviceAddDetails.scrollApi">

-			<form id="microservices-details-form" name="serviceForm" novalidate

-				autocomplete="off">

-				<div class="item required">

-					<div class="item-label">microservice Name</div>

-					<input id="microservice-details-input-name" class="table-search-field"

-						type="text" name="name" ng-pattern="/^[\w -]*$/" maxlength="100"

-						ng-model="microserviceAddDetails.service.name"

-						ng-change="microserviceAddDetails.updateServiceName()"

-						ng-disabled="microserviceAddDetails.isEditMode" required />

-

-					<div class="error-container"

-						ng-show="(microserviceAddDetails.emptyServiceName || serviceForm.name.$dirty)">

-						<div ng-messages="serviceForm.name.$error" class="error-container">

-							<small id="microservices-details-input-name-required"

-								class="err-message" ng-message="required">Microservice

-								Name is required</small> <small

-								id="microservices-details-input-name-pattern"

-								class="err-message" ng-message="pattern">Microservice

-								Name must be letters, numbers, or underscore</small>

-						</div>

-					</div>

-

-					<div class="error-container"

-						ng-show="microserviceAddDetails.isEditMode == false && microserviceAddDetails.dupliateName == true">

-						<small id="microservices-details-input-name-dupliated"

-							class="err-message">Name not available - choose different

-							name </small>

-					</div>

-				</div>

-

-				<div class="item required">

-					<div class="item-label">microservice Description</div>

-					<textarea b2b-reset b2b-reset-textarea id="widgets-details-input-desc"

-						name="desc" ng-model="microserviceAddDetails.service.desc"

-						ng-change="microserviceAddDetails.updateDesc()"></textarea>

-					<div class="error-container"

-						ng-show="(microserviceAddDetails.emptyServiceDesc 

-					|| (serviceForm.desc.$dirty && microserviceAddDetails.service.desc == ''))">

-						<small id="microservices-details-input-desc-required"

-							class="err-message">Microservice Description is required</small>

-					</div>

-				</div>

-

-

-

-				<div class="item"

-					ng-show="microserviceAddDetails.isEditMode && microserviceAddDetails.availableWidgets.length > 0">

-					<div class="item-label">Client Widgets</div>

-					<div ng-repeat="widget in microserviceAddDetails.availableWidgets">{{widget.name}}</div>

-				</div>

-

-				<div class="item required">

-					<div class="item-label">Application Name</div>

-					<div class="service-select">					

-						<div class="table-dropdown">

-							<select id="microservice-details-input-app" name="app" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.application.name" ng-change="microserviceAddDetails.updateApp()">

-				            	<option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableApps" value="{{d.name}}">{{d.name}}</option>

-				            </select>

-						</div>

-					</div>

-

-					<div class="error-container"

-						ng-show="(microserviceAddDetails.emptyServiceApp 

-					|| (serviceForm.app.$dirty && microserviceAddDetails.service.application == null))">

-						<small id="microservices-details-input-url-required"

-							class="err-message">Please select microservice

-							Application</small>

-					</div>

-				</div>

-

-				<div class="item required">

-					<div class="item-label">microservice Endpoint URL</div>

-					<input id="microservice-details-input-endpoint-url"

-						class="table-search-field" ng-model="microserviceAddDetails.service.url"

-						ng-change="microserviceAddDetails.updateURL()" type="text"

-						name="url" maxlength="200" />

-

-					<div class="error-container"

-						ng-show="(microserviceAddDetails.emptyServiceURL 

-					|| (serviceForm.url.$dirty && microserviceAddDetails.service.url == ''))">

-						<small id="microservices-details-input-url-required"

-							class="err-message">Microservice Endpoint URL is required</small>

-					</div>

-				</div>

-

-				<div class="item required">

-					<div class="item-label">Security Type</div>

-					<div class="service-select">					

-						<div class="table-dropdown">

-							<select id="microservice-details-input-security-type" name="microservice-details-input-security-type" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.security.name" ng-change="microserviceAddDetails.updateApp()">

-				            	<option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableSecurityTypes" value="{{d.name}}">{{d.name}}</option>				            	

-				            </select>

-						</div>

-					</div>				

-				</div>

-

-				<div class="item"

-					ng-show="microserviceAddDetails.service.security.id == 1">

-					<div class="item-label">Username</div>

-					<input id="microservice-details-input-username" class="table-search-field"

-						type="text" name="username" maxlength="100"

-						ng-model="microserviceAddDetails.service.username" />

-				</div>

-

-				<div class="item"

-					ng-show="microserviceAddDetails.service.security.id == 1">

-					<div class="item-label">Password</div>

-					<input id="microservice-details-input-password" class="table-search-field"

-						type="password" name="password" maxlength="100"

-						ng-model="microserviceAddDetails.service.password" />

-				</div>

-

-

-				<div class="item" ng-show="microserviceAddDetails.isEditMode">

-					<div class="left-test-item">

-						<div class="item-label">Test Microservice</div>

-					</div>

-					<div class="right-test-item">

-						<div id="microservice-details-test-button" class="test-button"

-							ng-click="microserviceAddDetails.testServiceURL()">Test</div>

-					</div>

-				</div>

-

-				<div class="item" ng-show="microserviceAddDetails.isEditMode">

-					<div class="item-label">JSON output</div>

-					<textarea id="microservice-details-input-json" class="json-field"

-						name="json"></textarea>

-				</div>

-

-				<div class="add-para-item">

-					<div class="item-label add-label-left">Add User Parameter</div>

-					<div class="icon-primary-accordion-plus"

-						ng-click="microserviceAddDetails.addParameter()"></div>

-				</div>

-				<div class="item">

-					<div class="para-label-item-left"

-						ng-show="microserviceAddDetails.service.parameterList.length > 0">

-						Parameter Key</div>

-					<div class="para-label-item-right"

-						ng-show="microserviceAddDetails.service.parameterList.length > 0">

-						Parameter Default Value</div>

-

-					<div id="microservice-details-user-paramters"

-						ng-repeat="parameter in microserviceAddDetails.service.parameterList">

-

-						<div class="para-item-left">

-							<input id="microservice-details-input-user-parameter-key"

-								class="table-search-field" type="text" name="param-key" maxlength="200"

-								ng-model="parameter.para_key" />

-						</div>

-						<div class="para-item-middle">

-							<input id="microservice-details-input-user-parameter-value"

-								class="table-search-field" type="text" name="param-value"

-								maxlength="200" ng-model="parameter.para_value" />

-						</div>

-

-						<div class="icon-primary-accordion-minus para-item-right"

-							ng-click="microserviceAddDetails.removeParamItem(parameter)"></div>

-					</div>

-

-					<div class="microservice-property">

-						<input id="microservices-checkbox-app-is-enabled" type="checkbox"

-							class="checkbox-field"

-							ng-model="microserviceAddDetails.service.active" />

-						<div class="property-label checkbox-label">Active</div>

-					</div>

-					

-				</div>

-					

-				<div id="microservice-scroll-end"></div>

-				<div class="dialog-control">

-					<button class="btn btn-alt btn-small" id="microservice-details-save-button" ng-click="microserviceAddDetails.saveChanges()">Save</button>				

-					<button class="btn btn-alt btn-small" id="microservice-details-close-button" ng-click="microserviceAddDetails.closeThisDialog()">Close</button>	

-				</div>

-			</form>

-		</div>

-

-

-	</div>

-</div>

+<!--
+  ================================================================================
+  ECOMP Portal
+  ================================================================================
+  Copyright (C) 2017 AT&T Intellectual Property
+  ================================================================================
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+  
+       http://www.apache.org/licenses/LICENSE-2.0
+  
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+  ================================================================================
+  -->
+<div class="microservice-add-details-model">
+	<div id="microservice-add-details-title" class="title">Microservice Details</div>
+
+	<div id="microservices" class="microservice-scrolling-table">
+		<div class="microservice-properties-main"
+			scroll-top="microserviceAddDetails.scrollApi">
+			<form id="microservices-details-form" name="serviceForm" novalidate
+				autocomplete="off">
+				<div class="item required">
+					<div class="item-label">Microservice Name</div>
+					<input id="microservice-details-input-name" class="table-search-field"
+						type="text" name="name" ng-pattern="/^[\w -]*$/" maxlength="100"
+						ng-model="microserviceAddDetails.service.name"
+						ng-change="microserviceAddDetails.updateServiceName()"
+						required />
+
+					<div class="error-container"
+						ng-show="(microserviceAddDetails.emptyServiceName || serviceForm.name.$dirty)">
+						<div ng-messages="serviceForm.name.$error" class="error-container">
+							<small id="microservices-details-input-name-required"
+								class="err-message" ng-message="required">Microservice
+								Name is required</small> <small
+								id="microservices-details-input-name-pattern"
+								class="err-message" ng-message="pattern">Microservice
+								Name must be letters, numbers, or underscore</small>
+						</div>
+					</div>
+
+					<div class="error-container"
+						ng-show="microserviceAddDetails.dupliateName == true">
+						<small id="microservices-details-input-name-dupliated"
+							class="err-message">Name not available - choose different
+							name </small>
+					</div>
+				</div>
+
+				<div class="item required">
+					<div class="item-label">Microservice Description</div>
+					<textarea b2b-reset b2b-reset-textarea id="widgets-details-input-desc"
+						name="desc" ng-model="microserviceAddDetails.service.desc"
+						ng-change="microserviceAddDetails.updateDesc()"></textarea>
+					<div class="error-container"
+						ng-show="(microserviceAddDetails.emptyServiceDesc 
+					|| (serviceForm.desc.$dirty && microserviceAddDetails.service.desc == ''))">
+						<small id="microservices-details-input-desc-required"
+							class="err-message">Microservice Description is required</small>
+					</div>
+				</div>
+
+
+
+				<div class="item"
+					ng-show="microserviceAddDetails.isEditMode && microserviceAddDetails.availableWidgets.length > 0">
+					<div class="item-label">Client Widgets</div>
+					<div ng-repeat="widget in microserviceAddDetails.availableWidgets">{{widget.name}}</div>
+				</div>
+
+				<div class="item required">
+					<div class="item-label">Application Name</div>
+					<div class="service-select">					
+						<div class="table-dropdown">
+							<select id="microservice-details-input-app" name="app" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.application.name" ng-change="microserviceAddDetails.updateApp()">
+				            	<option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableApps" value="{{d.name}}">{{d.name}}</option>
+				            </select>
+						</div>
+					</div>
+
+					<div class="error-container"
+						ng-show="(microserviceAddDetails.emptyServiceApp 
+					|| (serviceForm.app.$dirty && microserviceAddDetails.service.application == null))">
+						<small id="microservices-details-input-url-required"
+							class="err-message">Please select microservice
+							Application</small>
+					</div>
+				</div>
+
+				<div class="item required">
+					<div class="item-label">Microservice Endpoint URL</div>
+					<input id="microservice-details-input-endpoint-url"
+						class="table-search-field" ng-model="microserviceAddDetails.service.url"
+						ng-change="microserviceAddDetails.updateURL()" type="text"
+						name="url" maxlength="200" />
+
+					<div class="error-container"
+						ng-show="(microserviceAddDetails.emptyServiceURL 
+					|| (serviceForm.url.$dirty && microserviceAddDetails.service.url == ''))">
+						<small id="microservices-details-input-url-required"
+							class="err-message">Microservice Endpoint URL is required</small>
+					</div>
+				</div>
+
+				<div class="item required">
+					<div class="item-label">Security Type</div>
+					<div class="service-select">					
+						<div class="table-dropdown">
+							<select id="microservice-details-input-security-type" name="microservice-details-input-security-type" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.security.name" ng-change="microserviceAddDetails.updateApp()">
+				            	<option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableSecurityTypes" value="{{d.name}}">{{d.name}}</option>				            	
+				            </select>
+						</div>
+					</div>				
+				</div>
+
+				<div class="item"
+					ng-show="microserviceAddDetails.service.security.id == 1">
+					<div class="item-label">Username</div>
+					<input id="microservice-details-input-username" class="table-search-field"
+						type="text" name="username" maxlength="100"
+						ng-model="microserviceAddDetails.service.username" />
+				</div>
+
+				<div class="item"
+					ng-show="microserviceAddDetails.service.security.id == 1">
+					<div class="item-label">Password</div>
+					<input id="microservice-details-input-password" class="table-search-field"
+						type="password" name="password" maxlength="100"
+						ng-model="microserviceAddDetails.service.password" />
+				</div>
+
+
+				<div class="item" ng-show="microserviceAddDetails.isEditMode">
+					<div class="left-test-item">
+						<div class="item-label">Test Microservice</div>
+					</div>
+					<div class="right-test-item">
+						<div id="microservice-details-test-button" class="test-button"
+							ng-click="microserviceAddDetails.testServiceURL()">Test</div>
+					</div>
+				</div>
+
+				<div class="item" ng-show="microserviceAddDetails.isEditMode">
+					<div class="item-label">JSON output</div>
+					<textarea id="microservice-details-input-json" class="json-field"
+						name="json"></textarea>
+				</div>
+
+				<div class="add-para-item">
+					<div class="item-label add-label-left">Add User Parameter</div>
+					<div class="icon-primary-accordion-plus"
+						ng-click="microserviceAddDetails.addParameter()"></div>
+				</div>
+				<div class="item">
+					<div class="para-label-item-left"
+						ng-show="microserviceAddDetails.service.parameterList.length > 0">
+						Parameter Key</div>
+					<div class="para-label-item-right"
+						ng-show="microserviceAddDetails.service.parameterList.length > 0">
+						Parameter Default Value</div>
+
+					<div id="microservice-details-user-paramters"
+						ng-repeat="parameter in microserviceAddDetails.service.parameterList">
+
+						<div class="para-item-left">
+							<input id="microservice-details-input-user-parameter-key"
+								class="table-search-field" type="text" name="param-key" maxlength="200"
+								ng-model="parameter.para_key" />
+						</div>
+						<div class="para-item-middle">
+							<input id="microservice-details-input-user-parameter-value"
+								class="table-search-field" type="text" name="param-value"
+								maxlength="200" ng-model="parameter.para_value" />
+						</div>
+
+						<div class="icon-primary-accordion-minus para-item-right"
+							ng-click="microserviceAddDetails.removeParamItem(parameter)"></div>
+					</div>
+
+					<div class="microservice-property">
+						<input id="microservices-checkbox-app-is-enabled" type="checkbox"
+							class="checkbox-field"
+							ng-model="microserviceAddDetails.service.active" />
+						<div class="property-label checkbox-label">Active</div>
+					</div>
+					
+				</div>
+					
+				<div id="microservice-scroll-end"></div>
+				<div class="dialog-control">
+					<button class="btn btn-alt btn-small" id="microservice-details-save-button" ng-click="microserviceAddDetails.saveChanges()">Save</button>				
+					<button class="btn btn-alt btn-small" id="microservice-details-close-button" ng-click="microserviceAddDetails.closeThisDialog()">Close</button>	
+				</div>
+			</form>
+		</div>
+
+
+	</div>
+</div>
+
+<script>
+$(document).ready(function(){
+    $(".ngdialog-close").attr('id','dialog-close');
+});
+</script>
diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js
index f6123349..8ce9be64 100644
--- a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js
+++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-add-details/microservice-add-details.js
@@ -1,336 +1,337 @@
-/*-

- * ================================================================================

- * ECOMP Portal

- * ================================================================================

- * Copyright (C) 2017 AT&T Intellectual Property

- * ================================================================================

- * Licensed under the Apache License, Version 2.0 (the "License");

- * you may not use this file except in compliance with the License.

- * You may obtain a copy of the License at

- * 

- *      http://www.apache.org/licenses/LICENSE-2.0

- * 

- * Unless required by applicable law or agreed to in writing, software

- * distributed under the License is distributed on an "AS IS" BASIS,

- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

- * See the License for the specific language governing permissions and

- * limitations under the License.

- * ================================================================================

- */

-'use strict';

-(function () {

-    class MicroserviceAddDetailsCtrl {

-        constructor($scope, $log, $interval, widgetsCatalogService, applicationsService, adminsService, microserviceService, errorMessageByCode, ECOMP_URL_REGEX, $window,userProfileService, confirmBoxService, $cookies) {

-     	    

-          

-            let getAvailableApps = () => {       

-            	applicationsService.getAppsForSuperAdminAndAccountAdmin().then(apps => {

-            		this.availableApps=[];

-            		apps.unshift({

-                        id: 1,

-                        name: "ECOMP Portal"

-                    });

-            		for(var i = 0; i < apps.length; i++) {

-                        this.availableApps.push({

-                            id: apps[i].id,

-                            name: apps[i].name

-                        });

-                        if(this.isEditMode == true && this.service.appId == apps[i].id){

-                        	this.service.application = this.availableApps[i];

-                        }

-                    }

-            	}).catch(err => {

-                    $log.error(err);

-                });

-            };

-            

-            let getAvailableWidgets = () => {       

-            	microserviceService.getWidgetListByService(this.service.id).then(widgets =>{

-            		this.availableWidgets = [];

-            		for(var i = 0; i < widgets.length; i++){

-            			this.availableWidgets.push({

-            				name: widgets[i]

-            			})

-            		}

-            	}).catch(err => {

-                    $log.error(err);

-                });

-            };

-            

-            

-            let getAvailableSecurityTypes = () => {   

-            	this.availableSecurityTypes = [];

-            	this.availableSecurityTypes.push({

-            		id: 0,

-            		name: 'No Authentication'

-            	});

-            	this.availableSecurityTypes.push({

-            		id: 1,

-            		name: 'Basic Authentication'

-            	});

-            	this.availableSecurityTypes.push({

-            		id: 2,

-            		name: 'Cookie based Authentication'

-            	});

-            }

-

-            let init = () => {

-            	$log.info('MicroserviceAddDetailsCtrl::init');

-                this.service = [];

-                this.service.parameterList = [];

-                this.service.active = true;

-                this.emptyServiceName = false;

-                this.emptyServiceDesc = false;

-                this.emptyServiceURL = false;

-                this.emptyServiceApp = false;

-                this.dupliateName = false;

-                this.serviceList = $scope.ngDialogData.list;

-                

-                if ($scope.ngDialogData && $scope.ngDialogData.service) {

-                	

-                    this.isEditMode = true;

-                    this.service = _.clone($scope.ngDialogData.service);

-                    

-                    console.log(this.service);

-                    if(this.service.active == 'Y')

-                    	this.service.active = true;

-                    else

-                    	this.service.active = false;

-                } else {

-                    this.isEditMode = false;

-                } 

-                getAvailableApps();

-                getAvailableSecurityTypes();

-                //getAvailableWidgets();

-                

-                /**

-				 * 0: Basic Authentication

-				 * 

-				 * TODO: change the structure

-				 */

-                if(this.service.securityType == "No Authentication"){

-                	this.service.security = this.availableSecurityTypes[0];

-                }else if(this.service.securityType == "Basic Authentication"){

-                	this.service.security = this.availableSecurityTypes[1];

-                }else if(this.service.securityType == "Cookie based Authentication"){

-                	this.service.security = this.availableSecurityTypes[2];

-                }

-            };

-             

-            this.ECOMP_URL_REGEX = ECOMP_URL_REGEX;

-            this.conflictMessages = {};

-            this.scrollApi = {};

-

-            let resetConflict = fieldName => {

-                delete this.conflictMessages[fieldName];

-                if($scope.widgetForm[fieldName]){

-                    $scope.widgetForm[fieldName].$setValidity('conflict', true);

-                }

-            };

-

-            this.addParameter = () => {

-            	document.getElementById('microservice-scroll-end').scrollIntoView();

-            	this.service.parameterList.push({}); 

-            }

-            

-            this.closeThisDialog = () => {

-            	$scope.closeThisDialog(true);

-            }

-            

-            this.removeParamItem = (parameter) => {

-            	microserviceService.getUserParameterById(parameter.id).then((res) => {

-            		if(res.length > 0){

-            			var message = res.length + " users have their own widget parameters. Are you sure you want to delete?";

-            			confirmBoxService.editItem(message).then(isConfirmed => {

-            				if(isConfirmed){

-            					microserviceService.deleteUserParameterById(parameter.id).then((res) => {

-	            					for(var i = 0; i < this.service.parameterList.length; i++){

-	            	            		if(this.service.parameterList[i].para_key == parameter.para_key

-	            	            		&& this.service.parameterList[i].para_value == parameter.para_value){

-	            	            			this.service.parameterList.splice(i, 1);

-	            	            			return;

-	            	            		}

-	            	            	}

-            					});

-            				}

-            			});

-            		}

-            		else{

-            			for(var i = 0; i < this.service.parameterList.length; i++){

-    	            		if(this.service.parameterList[i].para_key == parameter.para_key

-    	            		&& this.service.parameterList[i].para_value == parameter.para_value){

-    	            			this.service.parameterList.splice(i, 1);

-    	            			return;

-    	            		}

-    	            	}

-            		}

-            	});

-            	

-            	

-            }

-            

-            this.updateServiceName = () => {

-            	this.dupliateName = false;

-            	for(var i = 0; i < this.serviceList.length; i++){

-            		if(this.serviceList[i].name == this.service.name){

-            			this.dupliateName = true;

-            			return;

-            		}

-            	}

-            }

-            

-            this.updateDesc = () => {

-            	this.emptyServiceDesc = false;

-            }

-            

-            this.updateURL = () => {

-            	this.emptyServiceURL  = false;

-            }

-            

-            this.updateApp = () => {

-            	this.emptyServiceApp = false;

-            }

-            

-          //This is a fix for dropdown selection, due to b2b dropdown only update value field

-    		$scope.$watch('microserviceAddDetails.service.application.name', (newVal, oldVal) => {

-    			for(var i=0;i<$scope.microserviceAddDetails.availableApps.length;i++){ 			

-    				if($scope.microserviceAddDetails.availableApps[i].name==newVal){

-    					$scope.microserviceAddDetails.service.application=angular.copy($scope.microserviceAddDetails.availableApps[i]);

-    				}

-    			}

-    		});

-    		$scope.$watch('microserviceAddDetails.service.security.name', (newVal, oldVal) => {

-    			for(var i=0;i<$scope.microserviceAddDetails.availableSecurityTypes.length;i++){ 			

-    				if($scope.microserviceAddDetails.availableSecurityTypes[i].name==newVal){

-    					$scope.microserviceAddDetails.service.security=angular.copy($scope.microserviceAddDetails.availableSecurityTypes[i]);

-    				}

-    			}

-    		});

-            

-            let emptyCookies = () => {

-                userProfileService.getUserProfile()

-                .then(profile=> {

-                    $log.info('AppDetailsModalCtrl::emptyCookies profile: ', profile);

-                    $scope.attuid = profile.attuid;

-                    $log.info('user has the following attuid: ' + profile.attuid);

-                    if ($cookies.getObject($scope.attuid + '_widget') != undefined && $cookies.getObject($scope.attuid + '_widget') != null) {

-                        $cookies.remove($scope.attuid + '_widget');

-                    }

-                });

-            };

-            

-            this.testServiceURL = () =>{

-            	//console.log(this.service.id);

-            	widgetsCatalogService.getServiceJSON(this.service.id).then(res => {

-            		document.getElementById("microservice-details-input-json").innerHTML = (JSON.stringify(res));

-				});

-            }

-            

-            this.saveChanges = () => {     

-            	/* TODO: add form validation */

-            	

-            	var isValid = true;

-            	this.updateServiceName();

-            	

-            	if(this.service.name == ''

-                || this.service.name == undefined){

-            		this.emptyServiceName = true;

-            		isValid = false;

-            	}

-            	

-            	if(this.dupliateName == true

-            	&& this.isEditMode == false){

-            		isValid = false;

-            	}

-            		

-            	

-            	if(this.service.desc == ''

-            	|| this.service.desc == undefined){

-            		this.emptyServiceDesc = true;

-            		isValid = false;

-            	}

-            	

-            	if(this.service.url == ''

-               	|| this.service.url == undefined){

-              		this.emptyServiceURL = true;

-               		isValid = false;

-               	}

-            		

-            	if(this.service.application == undefined

-             	|| this.service.application == null){

-            		this.emptyServiceApp = true;

-            		isValid = false;

-            	}

-            	

-            	if(!isValid)

-            		return;

-            	

-            	/*

-				 * Check the parameter list, delete those parameters that don't

-				 * have key

-				 */

-            	for(var i = 0; i < this.service.parameterList.length; i++){

-            		if(this.service.parameterList[i].para_key == undefined

-            		|| this.service.parameterList[i].para_key == null

-            		|| this.service.parameterList[i].para_key == ""){

-            			this.service.parameterList.splice(i, 1);

-            			i--;

-            		}

-            	}

-      

-            	var securityType;

-            	var username;

-            	var password;

-            	if(this.service.security == undefined ||

-            	this.service.security == null)

-            		securityType = "No Authentication";

-            	else{

-            		securityType = this.service.security.name;

-            		username = this.service.username;

-            		password = this.service.password;

-            	}

-            	

-            	var active = 'N';

-            	if(this.service.active == true)

-            		active = 'Y';

-            	

-            	var newService = {

-            			name: this.service.name,

-            			desc: this.service.desc,

-            			appId: this.service.application.id,

-            			url: this.service.url,

-            			securityType: securityType,

-            			username: username,

-            			password: password,

-            			active: active,

-            			parameterList: this.service.parameterList

-            	};

-            	

-            	if(this.isEditMode){

-            		// console.log(this.service.parameterList);

-            		var message = "Are you sure you want to change '" + this.service.name + "'?"

-            		confirmBoxService.editItem(message).then(isConfirmed => {

-	            		if(isConfirmed){

-		            		microserviceService.updateService(this.service.id, newService).then(() => {

-		            			// TODO: result validation check

-		            			this.closeThisDialog(); 

-		            		});

-            			}

-            		});

-            	}else{

-            		microserviceService.createService(newService).then(() => {

-            			// TODO: result validation check

-            			$scope.closeThisDialog(true);

-            		});

-            	}

-             	

-            };

-            init();

-            $scope.$on('$stateChangeStart', e => {

-                e.preventDefault();

-            });

-        }

-    }

-    MicroserviceAddDetailsCtrl.$inject = ['$scope', '$log', '$interval', 'widgetsCatalogService', 'applicationsService', 'adminsService', 'microserviceService', 'errorMessageByCode', 'ECOMP_URL_REGEX', '$window','userProfileService', 'confirmBoxService', '$cookies'];

-    angular.module('ecompApp').controller('MicroserviceAddDetailsCtrl', MicroserviceAddDetailsCtrl);

-})(); 

+/*-
+ * ================================================================================
+ * ECOMP Portal
+ * ================================================================================
+ * Copyright (C) 2017 AT&T Intellectual Property
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * 
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ * 
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ * ================================================================================
+ */
+'use strict';
+(function () {
+    class MicroserviceAddDetailsCtrl {
+        constructor($scope, $log, $interval, widgetsCatalogService, applicationsService, adminsService, microserviceService, errorMessageByCode, ECOMP_URL_REGEX, $window,userProfileService, confirmBoxService, $cookies) {
+     	    
+          
+            let getAvailableApps = () => {       
+            	applicationsService.getAppsForSuperAdminAndAccountAdmin().then(apps => {
+            		this.availableApps=[];
+            		apps.unshift({
+                        id: 1,
+                        name: "ECOMP Portal"
+                    });
+            		for(var i = 0; i < apps.length; i++) {
+                        this.availableApps.push({
+                            id: apps[i].id,
+                            name: apps[i].name
+                        });
+                        if(this.isEditMode == true && this.service.appId == apps[i].id){
+                        	this.service.application = this.availableApps[i];
+                        }
+                    }
+            	}).catch(err => {
+                    $log.error(err);
+                });
+            };
+            
+            let getAvailableWidgets = () => {       
+            	microserviceService.getWidgetListByService(this.service.id).then(widgets =>{
+            		this.availableWidgets = [];
+            		for(var i = 0; i < widgets.length; i++){
+            			this.availableWidgets.push({
+            				name: widgets[i]
+            			})
+            		}
+            	}).catch(err => {
+                    $log.error(err);
+                });
+            };
+            
+            
+            let getAvailableSecurityTypes = () => {   
+            	this.availableSecurityTypes = [];
+            	this.availableSecurityTypes.push({
+            		id: 0,
+            		name: 'No Authentication'
+            	});
+            	this.availableSecurityTypes.push({
+            		id: 1,
+            		name: 'Basic Authentication'
+            	});
+            	this.availableSecurityTypes.push({
+            		id: 2,
+            		name: 'Cookie based Authentication'
+            	});
+            }
+
+            let init = () => {
+            	$log.info('MicroserviceAddDetailsCtrl::init');
+                this.service = [];
+                this.availableApps=[];
+                this.service.parameterList = [];
+                this.service.active = true;
+                this.emptyServiceName = false;
+                this.emptyServiceDesc = false;
+                this.emptyServiceURL = false;
+                this.emptyServiceApp = false;
+                this.dupliateName = false;
+                this.serviceList = $scope.ngDialogData.list;
+                
+                if ($scope.ngDialogData && $scope.ngDialogData.service) {
+                	
+                    this.isEditMode = true;
+                    this.service = _.clone($scope.ngDialogData.service);
+                    
+                    this.originalName  = this.service.name;
+                    if(this.service.active == 'Y')
+                    	this.service.active = true;
+                    else
+                    	this.service.active = false;
+                } else {
+                    this.isEditMode = false;
+                } 
+                getAvailableApps();
+                getAvailableSecurityTypes();
+                //getAvailableWidgets();
+                
+                /**
+				 * 0: Basic Authentication
+				 * 
+				 * TODO: change the structure
+				 */
+                if(this.service.securityType == "No Authentication"){
+                	this.service.security = this.availableSecurityTypes[0];
+                }else if(this.service.securityType == "Basic Authentication"){
+                	this.service.security = this.availableSecurityTypes[1];
+                }else if(this.service.securityType == "Cookie based Authentication"){
+                	this.service.security = this.availableSecurityTypes[2];
+                }
+            };
+             
+            this.ECOMP_URL_REGEX = ECOMP_URL_REGEX;
+            this.conflictMessages = {};
+            this.scrollApi = {};
+
+            let resetConflict = fieldName => {
+                delete this.conflictMessages[fieldName];
+                if($scope.widgetForm[fieldName]){
+                    $scope.widgetForm[fieldName].$setValidity('conflict', true);
+                }
+            };
+
+            this.addParameter = () => {
+            	document.getElementById('microservice-scroll-end').scrollIntoView();
+            	this.service.parameterList.push({}); 
+            }
+            
+            this.closeThisDialog = () => {
+            	$scope.closeThisDialog(true);
+            }
+            
+            this.removeParamItem = (parameter) => {
+            	microserviceService.getUserParameterById(parameter.id).then((res) => {
+            		if(res.length > 0){
+            			var message = res.length + " users have their own widget parameters. Are you sure you want to delete?";
+            			confirmBoxService.editItem(message).then(isConfirmed => {
+            				if(isConfirmed){
+            					microserviceService.deleteUserParameterById(parameter.id).then((res) => {
+	            					for(var i = 0; i < this.service.parameterList.length; i++){
+	            	            		if(this.service.parameterList[i].para_key == parameter.para_key
+	            	            		&& this.service.parameterList[i].para_value == parameter.para_value){
+	            	            			this.service.parameterList.splice(i, 1);
+	            	            			return;
+	            	            		}
+	            	            	}
+            					});
+            				}
+            			});
+            		}
+            		else{
+            			for(var i = 0; i < this.service.parameterList.length; i++){
+    	            		if(this.service.parameterList[i].para_key == parameter.para_key
+    	            		&& this.service.parameterList[i].para_value == parameter.para_value){
+    	            			this.service.parameterList.splice(i, 1);
+    	            			return;
+    	            		}
+    	            	}
+            		}
+            	});
+            	
+            	
+            }
+            
+            this.updateServiceName = () => {
+            	this.dupliateName = false;
+            	for(var i = 0; i < this.serviceList.length; i++){
+            		if(this.serviceList[i].name == this.service.name){
+            			if(this.isEditMode && this.service.name == this.originalName)
+            				continue;
+            			this.dupliateName = true;
+            			return;
+            		}
+            	}
+            }
+            
+            this.updateDesc = () => {
+            	this.emptyServiceDesc = false;
+            }
+            
+            this.updateURL = () => {
+            	this.emptyServiceURL  = false;
+            }
+            
+            this.updateApp = () => {
+            	this.emptyServiceApp = false;
+            }
+            
+          //This is a fix for dropdown selection, due to b2b dropdown only update value field
+    		$scope.$watch('microserviceAddDetails.service.application.name', (newVal, oldVal) => {
+    			for(var i=0;i<$scope.microserviceAddDetails.availableApps.length;i++){ 			
+    				if($scope.microserviceAddDetails.availableApps[i].name==newVal){
+    					$scope.microserviceAddDetails.service.application=angular.copy($scope.microserviceAddDetails.availableApps[i]);
+    				}
+    			}
+    		});
+    		$scope.$watch('microserviceAddDetails.service.security.name', (newVal, oldVal) => {
+    			for(var i=0;i<$scope.microserviceAddDetails.availableSecurityTypes.length;i++){ 			
+    				if($scope.microserviceAddDetails.availableSecurityTypes[i].name==newVal){
+    					$scope.microserviceAddDetails.service.security=angular.copy($scope.microserviceAddDetails.availableSecurityTypes[i]);
+    				}
+    			}
+    		});
+            
+            let emptyCookies = () => {
+                userProfileService.getUserProfile()
+                .then(profile=> {
+                    $log.info('AppDetailsModalCtrl::emptyCookies profile: ', profile);
+                    $scope.attuid = profile.attuid;
+                    $log.info('user has the following attuid: ' + profile.attuid);
+                    if ($cookies.getObject($scope.attuid + '_widget') != undefined && $cookies.getObject($scope.attuid + '_widget') != null) {
+                        $cookies.remove($scope.attuid + '_widget');
+                    }
+                });
+            };
+            
+            this.testServiceURL = () =>{
+            	widgetsCatalogService.getServiceJSON(this.service.id).then(res => {
+            		document.getElementById("microservice-details-input-json").innerHTML = (JSON.stringify(res));
+				});
+            }
+            
+            this.saveChanges = () => {     
+            	/* TODO: add form validation */
+            	
+            	var isValid = true;
+            	this.updateServiceName();
+            	
+            	if(this.service.name == ''
+                || this.service.name == undefined){
+            		this.emptyServiceName = true;
+            		isValid = false;
+            	}
+            	
+            	if(this.dupliateName == true){
+            		isValid = false;
+            	}
+            		
+            	
+            	if(this.service.desc == ''
+            	|| this.service.desc == undefined){
+            		this.emptyServiceDesc = true;
+            		isValid = false;
+            	}
+            	
+            	if(this.service.url == ''
+               	|| this.service.url == undefined){
+              		this.emptyServiceURL = true;
+               		isValid = false;
+               	}
+            		
+            	if(this.service.application == undefined
+             	|| this.service.application == null){
+            		this.emptyServiceApp = true;
+            		isValid = false;
+            	}
+            	
+            	if(!isValid)
+            		return;
+            	
+            	/*
+				 * Check the parameter list, delete those parameters that don't
+				 * have key
+				 */
+            	for(var i = 0; i < this.service.parameterList.length; i++){
+            		if(this.service.parameterList[i].para_key == undefined
+            		|| this.service.parameterList[i].para_key == null
+            		|| this.service.parameterList[i].para_key == ""){
+            			this.service.parameterList.splice(i, 1);
+            			i--;
+            		}
+            	}
+      
+            	var securityType;
+            	var username;
+            	var password;
+            	if(this.service.security == undefined ||
+            	this.service.security == null)
+            		securityType = "No Authentication";
+            	else{
+            		securityType = this.service.security.name;
+            		username = this.service.username;
+            		password = this.service.password;
+            	}
+            	
+            	var active = 'N';
+            	if(this.service.active == true)
+            		active = 'Y';
+            	
+            	var newService = {
+            			name: this.service.name,
+            			desc: this.service.desc,
+            			appId: this.service.application.id,
+            			url: this.service.url,
+            			securityType: securityType,
+            			username: username,
+            			password: password,
+            			active: active,
+            			parameterList: this.service.parameterList
+            	};
+            	
+            	if(this.isEditMode){
+            		// console.log(this.service.parameterList);
+            		var message = "Are you sure you want to change '" + this.service.name + "'?"
+            		confirmBoxService.editItem(message).then(isConfirmed => {
+	            		if(isConfirmed){
+		            		microserviceService.updateService(this.service.id, newService).then(() => {
+		            			// TODO: result validation check
+		            			this.closeThisDialog(); 
+		            		});
+            			}
+            		});
+            	}else{
+            		microserviceService.createService(newService).then(() => {
+            			// TODO: result validation check
+            			$scope.closeThisDialog(true);
+            		});
+            	}
+             	
+            };
+            init();
+            $scope.$on('$stateChangeStart', e => {
+                e.preventDefault();
+            });
+        }
+    }
+    MicroserviceAddDetailsCtrl.$inject = ['$scope', '$log', '$interval', 'widgetsCatalogService', 'applicationsService', 'adminsService', 'microserviceService', 'errorMessageByCode', 'ECOMP_URL_REGEX', '$window','userProfileService', 'confirmBoxService', '$cookies'];
+    angular.module('ecompApp').controller('MicroserviceAddDetailsCtrl', MicroserviceAddDetailsCtrl);
+})(); 
diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less
index 7565b432..74b1b6ae 100644
--- a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less
+++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.less
@@ -1,14 +1,14 @@
 .microservice-onboarding{
-  //.bg_portalWhite;//white for 1702
-  .bg_portalGray;  // gray for 1610
-  position: @page-main-position;
-  top: @page-main-top;
-  left: @page-main-left;
-  right: @page-main-right;
-  bottom: @page-main-bottom;
-  padding-top: @padding-top;
-  overflow-y: @page-main-overflow-y;
-  padding-left: @padding-left-side;
+   .bg_portalWhite;//white for 1702
+    //.bg_portalGray;  // gray for 1610
+    position: @page-main-position;
+    top: @page-main-top;
+    left: @page-main-left;
+    right: @page-main-right;
+    bottom: @page-main-bottom;
+    padding-top: @padding-top;
+    overflow-y: @page-main-overflow-y;
+    padding-left: @padding-left-side;
 
     .microservices-table {
   	  width: @table-width;
diff --git a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html
index e3b3128a..ecda542d 100644
--- a/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html
+++ b/ecomp-portal-FE-common/client/app/views/microservice-onboarding/microservice-onboarding.tpl.html
@@ -1,75 +1,75 @@
-<!--

-  ================================================================================

-  ECOMP Portal

-  ================================================================================

-  Copyright (C) 2017 AT&T Intellectual Property

-  ================================================================================

-  Licensed under the Apache License, Version 2.0 (the "License");

-  you may not use this file except in compliance with the License.

-  You may obtain a copy of the License at

-  

-       http://www.apache.org/licenses/LICENSE-2.0

-  

-  Unless required by applicable law or agreed to in writing, software

-  distributed under the License is distributed on an "AS IS" BASIS,

-  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

-  See the License for the specific language governing permissions and

-  limitations under the License.

-  ================================================================================

-  -->

-<div class="w-ecomp-main">

-	<div class="w-ecomp-main-container">

-		<div class="microservice-onboarding" id="page-content">

-			<div id="microservice-onboarding-title"

-				class="w-ecomp-main-view-title">Microservice Onboarding</div>

-			<div class="microservices-table">

-				<div class="table-control">

-	                <div class="table-control-buttons">

-						<button class="btn btn-alt btn-small"  id="microservice-onboarding-button-add" ng-click="microserviceOnboarding.openAddNewMicroserviceModal()">

-		                	<i class="icon-people-userbookmark" aria-hidden="true"></i>&nbsp;Add Microservice

-		                </button> 

-					</div>

-					<div>

-						<div class="c-ecomp-b2b-abs-table default">

-							<table b2b-table table-data="serviceList"

-								search-string="microserviceOnboarding.searchString"

-								view-per-page="microserviceOnboarding.viewPerPageIgnored"

-								current-page="microserviceOnboarding.currentPageIgnored"

-								total-page="microserviceOnboarding.totalPageIgnored">

-								<thead b2b-table-row type="header">

-									<tr>

-										<th id="microservice-catalog-th-header-name"

-											ng-repeat="header in microserviceOnboarding.serviceTableHeaders"

-											b2b-table-header key="{{header.value}}"

-											sortable="{{header.isSortable}}">{{header.name}}</th>

-										<th id="microservices-catalog-th-header-delete"

-											b2b-table-header sortable="false">Delete</th>

-									</tr>

-								</thead>

-								<tbody b2b-table-row type="body" class="table-body"

-									row-repeat="rowData in serviceList">

-

-									<tr>

-										<td b2b-table-body

-											ng-repeat="header in microserviceOnboarding.serviceTableHeaders"

-											ng-click="microserviceOnboarding.openAddNewMicroserviceModal(rowData)">

-											<div

-												id="microservices-catalog-microservice-name-{{rowData.id}}"

-												ng-bind="rowData[header.value]"></div>

-										</td>

-

-										<td b2b-table-body>

-											<div id="microservice-onboarding-div-delete-{{$index}}"

-												class="icon-misc-trash"

-												ng-click="microserviceOnboarding.deleteService(rowData)"></div>

-										</td>

-									</tr>

-								</tbody>

-							</table>

-						</div>

-					</div>

-				</div>

-			</div>

-		</div>

-	</div>

-</div>

+<!--
+  ================================================================================
+  ECOMP Portal
+  ================================================================================
+  Copyright (C) 2017 AT&T Intellectual Property
+  ================================================================================
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+  
+       http://www.apache.org/licenses/LICENSE-2.0
+  
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+  ================================================================================
+  -->
+<div class="w-ecomp-main">
+	<div class="w-ecomp-main-container">
+		<div class="microservice-onboarding" id="page-content">
+			<div id="microservice-onboarding-title"
+				class="w-ecomp-main-view-title">Microservice Onboarding</div>
+			<div class="microservices-table">
+				<div class="table-control">
+	                <div class="table-control-buttons">
+						<button class="btn btn-alt btn-small"  id="microservice-onboarding-button-add" ng-click="microserviceOnboarding.openAddNewMicroserviceModal()">
+		                	<i class="icon-people-userbookmark" aria-hidden="true"></i>&nbsp;Add Microservice
+		                </button> 
+					</div>
+					<div>
+						<div class="c-ecomp-b2b-abs-table default">
+							<table b2b-table table-data="serviceList"
+								search-string="microserviceOnboarding.searchString"
+								view-per-page="microserviceOnboarding.viewPerPageIgnored"
+								current-page="microserviceOnboarding.currentPageIgnored"
+								total-page="microserviceOnboarding.totalPageIgnored">
+								<thead b2b-table-row type="header">
+									<tr>
+										<th id="microservice-catalog-th-header-name"
+											ng-repeat="header in microserviceOnboarding.serviceTableHeaders"
+											b2b-table-header key="{{header.value}}"
+											sortable="{{header.isSortable}}">{{header.name}}</th>
+										<th id="microservices-catalog-th-header-delete"
+											b2b-table-header sortable="false">Delete</th>
+									</tr>
+								</thead>
+								<tbody b2b-table-row type="body" class="table-body"
+									row-repeat="rowData in serviceList">
+
+									<tr>
+										<td b2b-table-body
+											ng-repeat="header in microserviceOnboarding.serviceTableHeaders"
+											ng-click="microserviceOnboarding.openAddNewMicroserviceModal(rowData)">
+											<div
+												id="microservices-catalog-microservice-name-{{rowData.id}}"
+												ng-bind="rowData[header.value]"></div>
+										</td>
+
+										<td b2b-table-body>
+											<div id="microservice-onboarding-div-delete-{{$index}}"
+												class="icon-misc-trash"
+												ng-click="microserviceOnboarding.deleteService(rowData)"></div>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>