X-Git-Url: https://gerrit.onap.org/r/gitweb?a=blobdiff_plain;f=ecomp-portal-FE-common%2Fclient%2Fapp%2Fviews%2Fwidget-onboarding%2Fwidget-details-dialog%2Fwidget-details.modal.html;h=fd3a1248212baabc3890f19e3babacbfea2e80ad;hb=24608a9e1450c409dc3870440d29e91cc3a26bb9;hp=2fa5644318d09f61ea8eee77e2fa43c936983a0e;hpb=b54df0ddd0c6a0372327c5aa3668e5a6458fcd64;p=portal.git

diff --git a/ecomp-portal-FE-common/client/app/views/widget-onboarding/widget-details-dialog/widget-details.modal.html b/ecomp-portal-FE-common/client/app/views/widget-onboarding/widget-details-dialog/widget-details.modal.html
index 2fa56443..fd3a1248 100644
--- a/ecomp-portal-FE-common/client/app/views/widget-onboarding/widget-details-dialog/widget-details.modal.html
+++ b/ecomp-portal-FE-common/client/app/views/widget-onboarding/widget-details-dialog/widget-details.modal.html
@@ -1,156 +1,181 @@
-<!--
-  ================================================================================
-  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="widget-details-modal">
-	<div id="'widgets-details-title" class="title">Widget Details</div>
-
-	<div class="widget-properties-main"
-		scroll-top="widgetOnboardingDetails.scrollApi">
-		<form id="widgets-details-form" name="widgetForm" novalidate
-			autocomplete="off">
-
-			<div class="item required">
-				<div class="item-label">Widget Name</div>
-				<input id="widgets-details-input-name" class="input-field"
-					type="text" ng-model="widgetOnboardingDetails.widget.name"
-					ng-change="widgetOnboardingDetails.updateWidgetName()" name="name"
-					ng-pattern="/^[\w -]*$/" maxlength="100"
-					ng-disabled="widgetOnboardingDetails.isEditMode" required />
-
-				<div class="error-container"
-					ng-show="(widgetOnboardingDetails.emptyWidgetName || widgetForm.name.$dirty) && !widgetOnboardingDetails.duplicatedName">
-					<div id="widgets-details-input-name-conflict" class="err-message">Name
-						not available - choose different name</div>
-				</div>
-
-				<div class="error-container"
-					ng-show="(widgetOnboardingDetails.emptyWidgetName || widgetForm.name.$dirty) && widgetOnboardingDetails.duplicatedName">
-					<div ng-messages="widgetForm.name.$error" class="error-container">
-						<small id="widgets-details-input-name-required"
-							class="err-message" ng-message="required">Widget Name is
-							required</small> <small id="widgets-details-input-name-pattern"
-							class="err-message" ng-message="pattern">Widget Name must
-							be letters, numbers, or underscore</small>
-					</div>
-				</div>
-			</div>
-
-
-			<div class="item">
-				<div class="item-label">Widget Description</div>
-				<input id="widgets-details-input-name" class="input-field"
-					type="text" ng-model="widgetOnboardingDetails.widget.desc"
-					name="desc" maxlength="200" />
-			</div>
-
-			<div class="widget-property">
-				<input id="widgets-checkbox-app-is-enabled" type="checkbox"
-					class="checkbox-field"
-					ng-model="widgetOnboardingDetails.widget.allUser" />
-				<div class="property-label checkbox-label">Allow all user
-					access</div>
-			</div>
-
-
-			<div class="item" ng-show="!widgetOnboardingDetails.isEditMode">
-				<div class="item-label">Service Endpoint</div>
-				<div>
-					<select id="widgets-details-input-endpoint-url" name="url"
-						class="input-field"
-						ng-model="widgetOnboardingDetails.widget.serviceURL"
-						ng-options="service as service.option
-						  for service in widgetOnboardingDetails.availableServices">
-						<option value="" selected="selected">Select Microservice
-							Endpoint</option>
-					</select>
-				</div>
-			</div>
-
-			<div class="item required"
-				ng-show="!widgetOnboardingDetails.widget.allUser">
-				<div class="item-label">Application Name</div>
-				<div>
-					<multiple-select id="widget-applications" unique-data="{{$index}}"
-						placeholder="Select Applications"
-						ng-model="widgetOnboardingDetails.availableApps"
-						on-change="widgetOnboardingDetails.appUpdate()" name-attr="name"
-						value-attr="isSelected"> </multiple-select>
-				</div>
-				<div class="error-container"
-					ng-show="widgetOnboardingDetails.appCounter == 0">
-					<div id="widgets-details-input-name-conflict" class="err-message">Please
-						select at least one Application</div>
-				</div>
-			</div>
-
-			<div class="item" ng-show="!widgetOnboardingDetails.widget.allUser">
-				<div ng-show="widgetOnboardingDetails.hasSelectedApp"
-					class="item-label">User Role Name</div>
-				<div ng-repeat="appRoles in widgetOnboardingDetails.availableApps"
-					id="roles-{{appRoles.roles.split(' ').join('-')}}">
-					<div class="item required">
-						<div class="app-item-left" ng-show="appRoles.isSelected">{{appRoles.name}}</div>
-						<div class="app-item-right" ng-show="appRoles.isSelected">
-							<multiple-select id="widget-roles-by-application"
-								unique-data="{{$index}}" placeholder="Select Roles"
-								ng-model="appRoles.roles" name-attr="name"
-								on-change="widgetOnboardingDetails.roleUpdate(appRoles)"
-								value-attr="isSelected"></multiple-select>
-							<div class="error-container" ng-show="!appRoles.roleSelected">
-								<div id="widgets-details-input-name-conflict"
-									class="err-message">Please select at least one role</div>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-
-			<div class="item required">
-				<div class="item-label">Upload Widget</div>
-				<div>
-					<input id="widget-onboarding-details-upload-file"
-						file-model="widgetOnboardingDetails.widget.file" type="file"
-						style="height: 24px;" />
-
-
-					<div class="error-container"
-						ng-show="widgetOnboardingDetails.widget.file == undefined && !widgetOnboardingDetails.isEditMode">
-						<div class="err-message">Please upload your widget (.zip)</div>
-					</div>
-				</div>
-			</div>
-		</form>
-	</div>
-
-	<div class="dialog-control">
-		<span class="ecomp-save-spinner"
-			ng-show="widgetOnboardingDetails.isSaving"></span>
-		<button id="widgets-details-save-button" class="btn btn-alt btn-small"
-			ng-class="{disabled: widgetOnboardingDetails.widget.name == undefined || !widgetOnboardingDetails.duplicatedName 
-			|| (!widgetOnboardingDetails.widget.allUser && widgetOnboardingDetails.appCounter == 0) || (widgetOnboardingDetails.widget.file == undefined && !widgetOnboardingDetails.isEditMode)
-			|| (!widgetOnboardingDetails.widget.allUser && !widgetOnboardingDetails.allRoleSelected) || (widgetOnboardingDetails.widget.saving)}"
-			ng-click="widgetOnboardingDetails.saveChanges()">Save</button>
-		<button id="widgets-details-cancel-button"
-			class="btn btn-alt btn-small" ng-click="closeThisDialog()">Cancel</button>
-
-	</div>
-
-
-
-</div>
+<!--
+  ============LICENSE_START==========================================
+  ONAP Portal
+  ===================================================================
+  Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
+  ===================================================================
+ 
+  Unless otherwise specified, all software contained herein is licensed
+  under the Apache License, Version 2.0 (the "License");
+  you may not use this software except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              http://www.apache.org/licenses/LICENSE-2.0
+ 
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+ 
+  Unless otherwise specified, all documentation contained herein is licensed
+  under the Creative Commons License, Attribution 4.0 Intl. (the "License");
+  you may not use this documentation except in compliance with the License.
+  You may obtain a copy of the License at
+ 
+              https://creativecommons.org/licenses/by/4.0/
+ 
+  Unless required by applicable law or agreed to in writing, documentation
+  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.
+ 
+  ============LICENSE_END============================================
+ 
+  
+  -->
+<div class="widget-details-modal">
+
+		<div class="b2b-modal-header">
+			<h2 class="widget-title" id="widgets-details-title">Widget Details</h2>
+
+			<div class="corner-button in">
+				<button type="button" class="close" aria-label="Close"
+					ng-click="$dismiss('cancel')"></button>
+			</div>
+		</div>
+
+		<div class="b2b-modal-body">
+		<div class="widget-properties-main"
+		scroll-top="widgetOnboardingDetails.scrollApi">
+		<form id="widgets-details-form" name="widgetForm" novalidate
+			autocomplete="off">
+
+			<div class="item required">
+				<div class="item-label">Widget Name</div>
+				<input id="widgets-details-input-name" class="table-search-field"
+					type="text" ng-model="widgetOnboardingDetails.widget.name"
+					ng-change="widgetOnboardingDetails.updateWidgetName()" name="name"
+					ng-pattern="/^[\w -]*$/" maxlength="100"
+					ng-disabled="widgetOnboardingDetails.isEditMode" required />
+
+				<div class="error-container"
+					ng-show="(widgetOnboardingDetails.emptyWidgetName || widgetForm.name.$dirty) && !widgetOnboardingDetails.duplicatedName">
+					<div id="widgets-details-input-name-conflict" class="err-message">Name
+						not available - choose different name</div>
+				</div>
+
+				<div class="error-container"
+					ng-show="(widgetOnboardingDetails.emptyWidgetName || widgetForm.name.$dirty) && widgetOnboardingDetails.duplicatedName">
+					<div ng-messages="widgetForm.name.$error" class="error-container">
+						<small id="widgets-details-input-name-required"
+							class="err-message" ng-message="required">Widget Name is
+							required</small> <small id="widgets-details-input-name-pattern"
+							class="err-message" ng-message="pattern">Widget Name must
+							be letters, numbers, space, dash or underscore</small>
+					</div>
+				</div>
+			</div>
+
+			<div class="item">
+				<div class="item-label">Widget Description</div>
+				<!-- <input id="widgets-details-input-description" class="input-field"
+					type="text" ng-model="widgetOnboardingDetails.widget.desc"
+					name="desc" maxlength="200" /> -->
+					<textarea b2b-reset b2b-reset-textarea id="widgets-details-input-desc"
+						name="desc" type="text" ng-model="widgetOnboardingDetails.widget.desc"  maxlength="200" 	></textarea>
+			</div>
+
+			<div class="item">
+				<div class="item-label">Service Endpoint</div>
+				<div class="table-dropdown" >
+							<select id="widgets-details-input-endpoint-url" name="url" b2b-dropdown placeholder-text="Select Microservice Endpoint" ng-model="widgetOnboardingDetails.widget.serviceURL" ng-disabled="widgetOnboardingDetails.isEditMode" >
+				            	<option b2b-dropdown-list option-repeat="service in widgetOnboardingDetails.availableServices" value="{{service.id}}">{{service.option}}</option>
+				            </select>
+						</div>
+			</div>
+
+			<div class="widget-property">
+				<label for="widget-checkbox-app-is-enabled" class="checkbox">
+					<input type="checkbox"
+					ng-model="widgetOnboardingDetails.widget.allUser"
+					id="widget-checkbox-app-is-enabled"> <i class="skin"></i>
+					<span class="property-label checkbox-label">Allow all user
+						access</span>
+				</label>
+			</div>
+
+			<div class="item required"
+				ng-show="!widgetOnboardingDetails.widget.allUser">
+				<div class="item-label">Application Name</div>
+				<div>
+					<multiple-select id="widget-applications" unique-data="{{$index}}"
+						placeholder="Select Applications"
+						ng-model="widgetOnboardingDetails.availableApps"
+						on-change="widgetOnboardingDetails.appUpdate()" name-attr="name"
+						value-attr="isSelected"> </multiple-select>
+				</div>
+				<div class="error-container"
+					ng-show="widgetOnboardingDetails.appCounter == 0">
+					<div id="widgets-details-input-name-conflict" class="err-message">Please
+						select at least one Application</div>
+				</div>
+			</div>
+
+			<div class="item" ng-show="!widgetOnboardingDetails.widget.allUser">
+				<div ng-show="widgetOnboardingDetails.hasSelectedApp"
+					class="item-label">User Role Name</div>
+				<div ng-repeat="appRoles in widgetOnboardingDetails.availableApps"
+					id="roles-{{appRoles.roles.split(' ').join('-')}}">
+					<div class="item required">
+						<div class="app-item-left" ng-show="appRoles.isSelected">{{appRoles.name}}</div>
+						<div class="app-item-right" ng-show="appRoles.isSelected">
+							<multiple-select id="widget-roles-by-application"
+								unique-data="{{$index}}" placeholder="Select Roles"
+								ng-model="appRoles.roles" name-attr="name"
+								on-change="widgetOnboardingDetails.roleUpdate(appRoles)"
+								value-attr="isSelected"></multiple-select>
+							<div class="error-container" ng-show="!appRoles.roleSelected">
+								<div id="widgets-details-input-name-conflict"
+									class="err-message">Please select at least one role</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+
+			<div class="item required">
+				<div class="item-label">Upload Widget</div>
+				<div>
+					<input id="widget-onboarding-details-upload-file"
+						file-model="widgetOnboardingDetails.widget.file" type="file"
+						class="widget-onboarding-details-upload-file ht" />
+
+
+					<div class="error-container"
+						ng-show="widgetOnboardingDetails.widget.file == undefined && !widgetOnboardingDetails.isEditMode">
+						<div class="err-message">Please upload your widget (.zip)</div>
+					</div>
+				</div>
+			</div>
+		</form>
+	</div>
+			</div>
+			<br>
+			<div class="b2b-modal-footer">
+				<div class="cta-button-group cta-modal-footer-flex">						
+					<span class="ecomp-save-spinner" ng-show="widgetOnboardingDetails.isSaving"></span>
+					<button id="widgets-details-save-button" class="btn btn-alt btn-small" 	ng-class="{disabled: widgetOnboardingDetails.widget.name == undefined || !widgetOnboardingDetails.duplicatedName 
+					|| (!widgetOnboardingDetails.widget.allUser && widgetOnboardingDetails.appCounter == 0) || (widgetOnboardingDetails.widget.file == undefined && !widgetOnboardingDetails.isEditMode)
+					|| (!widgetOnboardingDetails.widget.allUser && !widgetOnboardingDetails.allRoleSelected) || (widgetOnboardingDetails.widget.saving)}"
+					ng-click="widgetOnboardingDetails.saveChanges()">Save</button>				
+					<button class="btn btn-alt btn-small" id="widgets-details-cancel-button" ng-click="$dismiss('cancel')">Cancel</button>	
+				</div>
+			</div>
+			
+			
+			
+			
+
+</div>
\ No newline at end of file