[PORTAL-7] Rebase

This rebasing includes common libraries and common overlays projects
abstraction of components

Change-Id: I9a24a338665c7cd058978e8636bc412d9e2fdce8
Signed-off-by: st782s <statta@research.att.com>

6 files changed, 663 insertions, 0 deletions

diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html
new file mode 100644
index 00000000..91027f9e
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.html
@@ -0,0 +1,125 @@
+<div class="account-add-details-modal">
+	<div id="account-add-details-title" class="account-details-title">Account
+		Details</div>
+
+	<div id="accounts">
+		<div class="account-properties-main"
+			scroll-top="accountAddDetails.scrollApi">
+			<form id="accounts-details-form" name="serviceForm" novalidate
+				autocomplete="off">
+				<div class="item required">
+					<div class="item-label">Account Name</div>
+					<input id="account-details-input-name"
+						type="text" name="name" ng-pattern="/^[\w -]*$/" maxlength="100"
+						ng-model="accountAddDetails.account.applicationName"
+						ng-change="accountAddDetails.updateAccountName()" required />
+
+					<div class="error-container"
+						ng-show="(accountAddDetails.emptyAccountName || serviceForm.name.$dirty)">
+						<div ng-messages="serviceForm.name.$error" class="error-container">
+							<small id="accounts-details-input-name-required"
+								class="err-message" ng-message="required">account Name
+								is required</small> <small id="accounts-details-input-name-pattern"
+								class="err-message" ng-message="pattern">account Name
+								must be letters, numbers, or underscore</small>
+						</div>
+					</div>
+
+					<div class="error-container"
+						ng-show="accountAddDetails.dupliateName == true">
+						<small id="accounts-details-input-name-dupliated"
+							class="err-message">Name not available - choose different
+							name </small>
+					</div>
+				</div>
+
+				<div class="item required">
+					<div class="item-label">Username</div>
+					<input id="account-details-input-username" 
+						type="text" name="username" maxlength="100"
+						ng-model="accountAddDetails.account.username"
+						ng-change="accountAddDetails.updateUsername()" />
+
+					<div class="error-container"
+						ng-show="(accountAddDetails.emptyAccountUsername 
+					|| (serviceForm.username.$dirty && accountAddDetails.account.username == ''))">
+						<small id="account-details-input-username-required"
+							class="err-message">Username is required</small>
+					</div>
+
+				</div>
+
+				<div class="item">
+					<div class="item-label">Password</div>
+					<input id="account-details-input-password"
+						type="password" name="password" maxlength="100"
+						ng-model="accountAddDetails.account.password" />
+				</div>
+
+				<div class="item">
+					<div class="item-label">Retype Password</div>
+					<input id="account-details-input-repassword"
+						type="password" name="repassword" maxlength="100"
+						ng-model="accountAddDetails.account.repassword"
+						ng-change="accountAddDetails.confirmPassword()" />
+
+					<div class="error-container"
+						ng-show="accountAddDetails.passwordMatched == false">
+						<small id="accounts-details-input-name-dupliated"
+							class="err-message">Password does not match the confirm
+							password</small>
+					</div>
+				</div>
+
+
+				<div class="add-endpoint-item">
+					<div class="item-label add-label-left">Add Endpoint</div>
+					<div class="icon-add add-label-right"
+						ng-click="accountAddDetails.addEndpoint()"></div>
+				</div>
+				<div class="item">
+					<div class="item-label"
+						ng-show="accountAddDetails.account.endpointList.length > 0">
+						Account endpoint</div>
+
+					<div id="account-details-user-paramters"
+						ng-repeat="endpoint in accountAddDetails.account.endpointList">
+
+						<div class="endpoint-item-left">
+							<input id="account-details-input-endpoint-name"
+								type="text" name="endpointName"
+								maxlength="200" ng-model="endpoint.name" 
+								ng-change="accountAddDetails.updateAccountEndpoint(endpoint)"/>
+						</div>
+
+						<div class="icon-circle-action-remove endpoint-item-middle"
+							ng-click="accountAddDetails.removeEndpointItem(endpoint)"></div>
+							
+						<div class="error-container endpoint-item-right"
+								ng-show="endpoint.valid == false">
+								<small id="accounts-details-input-invalid-endpoint"
+									class="err-message">Invalid end point format</small>
+						</div>
+							
+					</div>
+
+					<div class="account-property">
+						<input id="accounts-checkbox-app-is-enabled" type="checkbox"
+							class="checkbox-field"
+							ng-model="accountAddDetails.account.active" />
+						<div class="property-label checkbox-label">Active</div>
+					</div>
+					<div class="item">
+						<div id="account-details-next-button" class="submit-button"
+							ng-click="accountAddDetails.closeThisDialog()">close</div>
+						<div id="account-details-next-button" class="submit-button"
+							ng-click="accountAddDetails.saveChanges()">Save</div>
+					</div>
+				</div>
+
+			</form>
+		</div>
+
+
+	</div>
+</div>
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js
new file mode 100644
index 00000000..ff89dce3
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.js
@@ -0,0 +1,171 @@
+'use strict';
+(function () {
+    class AccountAddDetailsCtrl {
+        constructor($scope, $log, $interval, basicAuthAccountSerivce, errorMessageByCode, ECOMP_URL_REGEX, $window, confirmBoxService, $cookies) {
+     	    
+          
+           this.addEndpoint = () => {
+           	  this.account.endpointList.push({
+           		  valid: true
+           	  }); 
+           }
+        	
+            let init = () => {
+            	this.account = [];
+                this.account.endpointList = [];
+                this.passwordMatched = true;
+                this.dupliateName = false;
+                this.emptyAccountName = false;
+                this.emptyAccountUsername = false;
+                this.accountList = $scope.ngDialogData.list;
+                
+                if ($scope.ngDialogData && $scope.ngDialogData.account) {
+                    this.isEditMode = true;
+                    this.account = _.clone($scope.ngDialogData.account);
+                    this.account.repassword = this.account.password;
+                    this.account.endpointList = this.account.endpoints;
+                    if(this.account.isActive == 'Y')
+                    	this.account.active = true;
+                    else
+                    	this.account.active = false;
+                } else {
+                    this.isEditMode = false;
+                    this.account.active = true;
+                } 
+                console.log(this.account);
+            };
+            
+            let resetConflict = fieldName => {
+                delete this.conflictMessages[fieldName];
+                if($scope.widgetForm[fieldName]){
+                    $scope.widgetForm[fieldName].$setValidity('conflict', true);
+                }
+            };
+
+            
+            this.closeThisDialog = () => {
+            	$scope.closeThisDialog(true);
+            }
+            
+            this.removeEndpointItem = (endpoint) => {
+        		for(var i = 0; i < this.account.endpointList.length; i++){
+        			if(this.account.endpointList[i].name == endpoint.name){
+        				this.account.endpointList.splice(i, 1);
+        				return; 
+        			}
+        		}
+            }
+            
+            this.confirmPassword = () => {
+            	this.passwordMatched =  true;
+            }
+            
+            this.updateUsername = () => {
+            	this.emptyAccountUsername = false;
+            }
+            
+            this.updateAccountName = () => {
+            	this.dupliateName = false;
+            	for(var i = 0; i < this.accountList.length; i++){
+            		if(this.accountList[i].applicationName == this.account.applicationName){
+            			this.dupliateName = true;
+            			return;
+            		}
+            	}
+            }
+            
+            this.updateAccountEndpoint = (endpoint) => {
+            	endpoint.valid = true;
+            }
+           
+            this.saveChanges = () => {
+
+            	var isValid = true;
+            	var r = /\/[^ "]+$/;
+            	
+            	for(var i = 0; i < this.account.endpointList.length; i++){
+               		if(this.account.endpointList[i].name == undefined
+            		|| this.account.endpointList[i].name == null
+            		|| this.account.endpointList[i].name == ""){
+            			this.account.endpointList.splice(i, 1);
+            			i--;
+            		}else{
+            			if(!this.account.endpointList[i].name.startsWith("/")){
+            				this.account.endpointList[i].name = "/" + this.account.endpointList[i].name;
+            			}
+            			if(!r.test(this.account.endpointList[i].name)){
+            				this.account.endpointList[i].valid = false;
+            				isValid = false;
+            			}
+            			
+            		}
+            	}
+            	
+            	if(this.account.applicationName == ''
+                || this.account.applicationName == undefined){
+            		this.emptyAccountName = true;
+                	isValid = false;
+                }
+            	
+            	if(this.account.username == ''
+                || this.account.username == undefined){
+            		this.emptyAccountUsername = true;
+                    isValid = false;
+                }
+            	
+            	if(this.dupliateName == true){
+                   isValid = false;
+               	}
+            	
+            	if(this.account.password != this.account.repassword){
+            		this.passwordMatched =  false;
+            		isValid = false;
+            	}
+            	
+            	if(!isValid)
+            		return;
+            	
+               	
+            	
+            	var active = 'N';
+            	if(this.account.active == true)
+            		active = 'Y';
+            	
+            	var newAccount = {
+            			applicationName: this.account.applicationName,
+            			username: this.account.username,
+            			password: this.account.password,
+            			endpoints: this.account.endpointList,
+            			isActive: active
+            	};
+            	
+            	
+            	if(this.isEditMode){
+            		var message = "Are you sure you want to change '" + this.account.applicationName + "'?"
+            		confirmBoxService.editItem(message).then(isConfirmed => {
+	            		if(isConfirmed){
+	            			basicAuthAccountSerivce.updateAccount(this.account.id, newAccount).then(() => {
+	                			$scope.closeThisDialog(true);
+	                		});
+	           			}
+            		});
+            	}else{
+            		basicAuthAccountSerivce.createAccount(newAccount).then(() => {
+            			$scope.closeThisDialog(true);
+            		});
+            	}
+            	
+            	
+            
+            }
+            
+            
+            init();
+            $scope.$on('$stateChangeStart', e => {
+                e.preventDefault();
+            });
+        }
+    }
+    AccountAddDetailsCtrl.$inject = ['$scope', '$log', '$interval', 'basicAuthAccountSerivce', 'errorMessageByCode', 'ECOMP_URL_REGEX', '$window', 'confirmBoxService', '$cookies'];
+    angular.module('ecompApp').controller('AccountAddDetailsCtrl', AccountAddDetailsCtrl);
+})(); 
\ No newline at end of file
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less
new file mode 100644
index 00000000..6a916d6c
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-add-details/account-add-details.less
@@ -0,0 +1,195 @@
+.account-add-details-modal{
+	height: 550px;
+	
+	overflow-y: auto;
+
+	.account-details-title {
+	    color: #191919;
+	    font-family: "Omnes-ECOMP-W02", Arial;;
+	    font-size: 24px;
+	    padding-bottom: 15px;
+	    padding-top:30px;
+	    margin-left: 25px;
+	}
+	.account-properties-main {
+	    padding-top: 20px;
+	    padding-left: 20px;
+	    padding-right: 20px;
+	    margin-bottom: 50px;
+	    
+	    height: 100%;
+	    width:100%;
+	    
+	    .account-property{
+	      margin-top: 10px;
+	      position: relative;
+	      .property-label{
+	        .dGray14r;
+	      }
+	      .checkbox-label{
+	        display: inline-block;
+	        padding-left: 3px;
+	      }
+	      .checkbox-field{
+	        padding: 0;
+	        margin: 0;
+	        vertical-align: middle;
+	        position: relative;
+	        top: -1px;
+	      } 
+	    }
+		.add-endpoint-item{
+			position: relative;
+	        .add-label-left{
+	  	  	  line-height: 25px;
+	          height: 30px;
+	          vertical-align: middle;
+	          display:inline-block;
+	          margin-right: 10px;
+			  .dGray14r;
+	  	   }
+	  	   .add-label-right{
+	  	   	  height: 14px;
+	  	   	  width: 14px;
+	          display:inline-block;
+	  	   }
+		}
+		.item{
+	      position: relative;
+	      margin-bottom: 15px;
+	      width: 400px;
+	      .service-select{
+	 		  select{
+	 		  	cursor: pointer;
+			    position: relative;
+			    border: 1px solid #5a5a5a;
+			    white-space: nowrap;
+			    overflow: hidden;
+			    text-overflow: ellipsis;
+			    line-height: 15px;
+			    height: 32px;
+			    padding-left: 10px;
+			    padding-right: 10px;
+		      	border-radius: 0px;
+	 		  }
+	          display:inline-block;
+	          width: 100%;
+    	  }
+    	  .error-container{
+	        position: absolute;
+	        width: 280px;
+	        display: block;
+	        height: 12px;
+	        line-height: 12px;
+	
+	        .err-message{
+	          color: @funcRed;
+	          font-size: 9px;
+	        }
+	        .valid-message{
+	          color: @funcGreen;
+	          font-size: 9px;
+	        }
+	      }
+	      .auth-item-left{
+	          padding-top: 0;
+	          line-height: 30px;
+	          height: 30px;
+	          vertical-align: middle;
+	          display:inline-block;
+	          width: 15%;
+	          //border-radius: 2px;
+	          //border: 1px solid @attLGray;
+	          margin-right: 10px;
+	          //background: @attWhite;
+	          white-space: nowrap;
+			  .dGray14r;
+       	  }
+          .auth-item-right{
+	          display:inline-block;
+	          width: 45%;
+	          border-radius: 2px;
+	          border: 1px solid;
+	          //background: @attWhite;
+	          vertical-align: middle;
+          }
+          
+          .endpoint-item-left{
+	          line-height: 30px;
+	          height: 30px;
+	          vertical-align: middle;
+	          display:inline-block;
+	          width: 80%;
+	          //border-radius: 2px;
+	          //border: 1px solid;
+	          margin-right: 10px;
+	          //background: @attWhite;
+	          white-space: nowrap;
+			  .dGray14r;
+       	  }
+       	  .endpoint-item-middle{
+          	  margin-top: 10px;
+	          height: 14px;
+	          width: 14px;
+	          display:inline-block;
+          }
+          
+          .endpoint-item-right{
+          	  margin-left: 5px; 
+	          width: 15%;
+	          height: 30px;
+	          display:inline-block;
+          }
+          
+          .endpoint-label-item-left{
+	          line-height: 30px;
+	          height: 30px;
+	          vertical-align: middle;
+	          display:inline-block;
+	          width: 80%;
+	          margin-right: 10px;
+	          //background: @attWhite;
+	          white-space: nowrap;
+			  .dGray14r;
+       	  }
+          .endpoint-label-item-right{
+	          line-height: 30px;
+	          height: 30px;
+	          display:inline-block;
+	          width: 20%;
+	          //background: @attWhite;
+	          vertical-align: middle;
+	          white-space: nowrap;
+	          .dGray14r;
+          }
+
+	      
+	       .textarea-field{
+	      	position: relative;
+	      	.custom-input-field;
+	      	height:50px;
+      	    }
+	       .submit-button {
+	       	 margin-top: 25px;
+	  	 	 position: relative;
+	  	 	 float: right;
+	  	 	 width: 20%;
+	   		.btn-blue;
+	  	  }
+	  	  
+	  	 
+	  	  
+	  	  .add-endpoint-button{
+			height: 14px;
+	  	  	width: 14px;
+	  	  	float: right;
+	  	  }
+	  	  .item-label{
+        	.dGray14r;
+      	  }
+	    }
+	}
+}
+#account-scroll-end{
+	height: 20px;
+} 
\ No newline at end of file
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.controller.js b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.controller.js
new file mode 100644
index 00000000..deed9dc8
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.controller.js
@@ -0,0 +1,72 @@
+'use strict';
+(function () {
+    class AccountOnboardingCtrl {
+        constructor($log, ngDialog, confirmBoxService, basicAuthAccountService, $cookies, $scope) {
+        	
+        	
+            let init = () => {
+            	 $scope.accountList = [];
+            	 getOnboardingAccounts();
+            	 
+            	 this.accoutTableHeaders = [
+                 	{name: 'Account Name', value: 'applicationName', isSortable: true},
+                    {name: 'Username', value: 'username', isSortable: false}
+                 ];
+            };
+            
+            let getOnboardingAccounts = () => {
+            	basicAuthAccountService.getAccountList().then(res => {            		
+                    $scope.accountList = res;
+                }).catch(err => {
+                    $log.error('AccountOnboardingCtrl::getOnboardingAccounts caught error', err);
+                });
+            };
+            
+            this.openAddNewAccountModal = (selectedAccount) => {
+            	let data = null; 
+				if(selectedAccount){
+					data = { 
+						account:selectedAccount,
+						list: $scope.accountList
+					}
+				}else{
+					data = {
+						list: $scope.accountList	
+					}
+				}
+                ngDialog.open({
+                    templateUrl: 'app/views/account-onboarding/account-add-details/account-add-details.html',
+                    controller: 'AccountAddDetailsCtrl',
+                    controllerAs: 'accountAddDetails',
+                    data: data
+                }).closePromise.then(needUpdate => {
+                	if(needUpdate.value === true){
+                		if(needUpdate.value === true){
+                			 getOnboardingAccounts();
+                        }
+                    }
+                });
+            };
+            
+            
+            this.deleteAccount = account => { 
+            	console.log(account);
+     		    confirmBoxService.deleteItem(account.applicationName).then(isConfirmed => {   
+                	if(isConfirmed){
+                		basicAuthAccountService.deleteAccount(account.id).then(() => {
+                        	$scope.accountList.splice($scope.accountList.indexOf(account), 1);
+                        }).catch(err => {
+                            $log.error('AccountOnboardingCtrl::deleteAccount error:',err);
+                        });
+                    }
+                }).catch(err => {
+                    $log.error('AccountOnboardingCtrl::deleteAccount error:',err);
+                });
+             };
+            
+            init();
+        }
+    }
+    AccountOnboardingCtrl.$inject = ['$log', 'ngDialog', 'confirmBoxService', 'basicAuthAccountService', '$cookies', '$scope'];
+    angular.module('ecompApp').controller('AccountOnboardingCtrl', AccountOnboardingCtrl);
+})();
\ No newline at end of file
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.less b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.less
new file mode 100644
index 00000000..8d3663c3
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.less
@@ -0,0 +1,24 @@
+.account-onboarding{
+  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;
+
+    .account-table {
+  	  width: @table-width;
+ 	  margin: 0 auto;
+ 	  
+ 	  .add-button{
+ 	  	width: 180px;
+ 	  }
+    }
+
+	.delete-account{
+      .ico_trash_default;
+    }
+
+}
\ No newline at end of file
diff --git a/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.tpl.html b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.tpl.html
new file mode 100644
index 00000000..5f46a1cc
--- /dev/null
+++ b/ecomp-portal-FE-common/client/app/views/account-onboarding/account-onboarding.tpl.html
@@ -0,0 +1,76 @@
+<div class="w-ecomp-main">
+	<div class="w-ecomp-main-container">
+		<div class="account-onboarding" id="page-content">
+			<div id="account-onboarding-title" class="w-ecomp-main-view-title">Account
+				Onboarding</div>
+			<div class="account-table">
+				<div class="table-control">
+
+					<div class="table-control-buttons">
+						<button class="btn btn-alt btn-small"
+							id="account-onboarding-button-add"
+							ng-click="accountOnboarding.openAddNewAccountModal()">
+							<i class="icon-people-userbookmark" aria-hidden="true"></i>&nbsp;Add
+							Account
+						</button>
+					</div>
+
+
+					<div>
+						<div class="c-ecomp-b2b-abs-table default">
+							<table b2b-table table-data="serviceList"
+								view-per-page="accountOnboardingviewPerPageIgnored"
+								current-page="accountOnboarding.currentPageIgnored"
+								total-page="accountOnboarding.totalPageIgnored">
+								<thead b2b-table-row type="header">
+									<tr>
+										<th id="account-catalog-th-header-name"
+											ng-repeat="header in accountOnboarding.accoutTableHeaders"
+											b2b-table-header key="{{header.value}}"
+											sortable="{{header.isSortable}}">{{header.name}}</th>
+
+										<th id="account-catalog-th-header-endpoints" b2b-table-header
+											key="endpoints" sortable="false">Endpoints</th>
+
+										<th id="account-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 accountList">
+
+									<tr>
+										<td b2b-table-body
+											ng-repeat="header in accountOnboarding.accoutTableHeaders"
+											ng-click="accountOnboarding.openAddNewAccountModal(rowData)">
+											<div id="account-catalog-name-{{rowData.id}}"
+												ng-bind="rowData[header.value]"></div>
+										</td>
+
+										<td b2b-table-body
+											ng-click="accountOnboarding.openAddNewAccountModal(rowData)">
+											<div ng-show="rowData.endpoints.length > 0">
+												<div ng-repeat="row in rowData.endpoints">
+													<div id="account-catalog-account-endpoint"
+														ng-bind="row.name"></div>
+												</div>
+											</div>
+											<div ng-hide="rowData.endpoints.length > 0">All
+												endpoints</div>
+										</td>
+
+										<td b2b-table-body>
+											<div id="account-onboarding-div-delete-{{$index}}"
+												class="delete-account"
+												ng-click="accountOnboarding.deleteAccount(rowData)"></div>
+										</td>
+									</tr>
+								</tbody>
+							</table>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
\ No newline at end of file