2 ============LICENSE_START==========================================
4 ===================================================================
5 Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
6 ===================================================================
8 Unless otherwise specified, all software contained herein is licensed
9 under the Apache License, Version 2.0 (the "License");
10 you may not use this software except in compliance with the License.
11 You may obtain a copy of the License at
13 http://www.apache.org/licenses/LICENSE-2.0
15 Unless required by applicable law or agreed to in writing, software
16 distributed under the License is distributed on an "AS IS" BASIS,
17 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
18 See the License for the specific language governing permissions and
19 limitations under the License.
21 Unless otherwise specified, all documentation contained herein is licensed
22 under the Creative Commons License, Attribution 4.0 Intl. (the "License");
23 you may not use this documentation except in compliance with the License.
24 You may obtain a copy of the License at
26 https://creativecommons.org/licenses/by/4.0/
28 Unless required by applicable law or agreed to in writing, documentation
29 distributed under the License is distributed on an "AS IS" BASIS,
30 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
31 See the License for the specific language governing permissions and
32 limitations under the License.
34 ============LICENSE_END============================================
39 <div class="b2b-modal-header">
40 <h2 class="account-details-title" id="application-details-title">Application
42 <div class="corner-button in">
43 <button type="button" class="close" id="div-confirm-close-button"
44 aria-label="Close" ng-click="$dismiss('cancel')"></button>
47 <div class="b2b-modal-body">
48 <div class="application-details-modal">
49 <div class="app-properties-main" scroll-top="appDetails.scrollApi">
50 <form name="appForm" novalidate autocomplete="off">
51 <div id="app-left-container" class="left-container">
52 <div class="property-label checkbox-label">
53 <label for="checkbox-app-is-restricted" class="checkbox">
54 <input type="checkbox" ng-model="appDetails.app.restrictedApp"
55 id="checkbox-app-is-restricted"
56 ng-disabled="appDetails.isEditMode"
57 ng-checked="appDetails.app.restrictedApp" /> <i class="skin"></i>
58 <span>Hyperlink only application</span>
61 <div class="property required">
62 <div class="property-label">Application Name</div>
63 <input id="input-app-name" type="text"
64 ng-model="appDetails.app.name" maxlength="100" name="name"
65 ng-pattern="/^[a-zA-Z0-9_\-\s\&]*$/" required />
67 <div id="error-container-conflict" class="error-container"
68 ng-show="appDetails.conflictMessages.name"
69 id="conflictMessages-name">
70 <small id="app-name-error-conflict" class="err-message"
71 ng-bind="appDetails.conflictMessages.name"></small>
73 <div id="error-container-edit" class="error-container"
74 ng-show="appForm.name.$dirty || appDetails.isEditMode">
75 <div ng-messages="appForm.name.$error" class="error-container">
76 <small id="app-name-error-required" class="err-message"
77 ng-message="required">Application name is required</small> <small
78 id="app-name-error-alpha-num" class="err-message"
79 ng-message="pattern">Application name must be
84 <div class="property required">
85 <div id="url-property-label" class="property-label">URL</div>
86 <input id="input-app-url" ng-model="appDetails.app.url"
87 maxlength="256" name="url" type="url" placeholder="https://"
88 ng-pattern="appDetails.ECOMP_URL_REGEX" required />
89 <div id="app-error-url" class="error-container"
90 ng-show="appDetails.conflictMessages.url"
91 id="div-app-name-err-url">
92 <small class="err-message"
93 ng-bind="appDetails.conflictMessages.url"></small>
95 <div id="app-error-url-message" class="error-container"
96 ng-show="appForm.url.$dirty || appDetails.isEditMode">
97 <div ng-messages="appForm.url.$error" class="error-container">
98 <small id="error-app-url-req" class="err-message"
99 ng-message="required">Application URL is required</small>
100 <!--<small id="error-app-url-invalid" class="err-message" ng-message="pattern">Application URL must be a valid URL</small>-->
101 <small id="error-app-url-invalid" class="err-message"
102 ng-show="appForm.url.$error.url">Application URL must
103 be a valid URL</small>
106 <!--<span class="err-message" ng-show="appForm.url.$error.url"> Not valid URL!</span>-->
110 <div class="property required" ng-show="!appDetails.app.restrictedApp">
111 <div class="property-label">Rest API URL</div>
112 <input id="input-app-rest-url" ng-model="appDetails.app.restUrl"
113 name="restUrl" type="url" placeholder="https://"
114 ng-pattern="appDetails.ECOMP_URL_REGEX" maxlength="256"
115 ng-required="!appDetails.app.restrictedApp" />
116 <div id="app-error-rest-message" class="error-container"
117 ng-show="appForm.restUrl.$dirty || appDetails.isEditMode">
118 <div ng-messages="appForm.restUrl.$error" class="error-container">
119 <small class="err-message" ng-show="appForm.restUrl.$error.url">Application
120 REST URL must be a valid URL</small>
125 <div class="property required"
126 ng-show="!appDetails.app.restrictedApp">
127 <div id="username-property-label" class="property-label">Username</div>
128 <input type="text" ng-model="appDetails.app.username"
129 name="username" maxlength="256"
130 ng-required="!appDetails.app.restrictedApp" />
131 <div id="app-error-username-container" class="error-container"
132 ng-show="appForm.username.$dirty || appDetails.isEditMode">
133 <div ng-messages="appForm.username.$error"
134 class="error-container">
135 <small id="error-appusername-reqd" class="err-message"
136 ng-message="required">My Logins App Username is
141 <!-- <div class="property required"
142 ng-show="!appDetails.app.restrictedApp">
143 <div id="pwd-property-label" class="property-label">Password</div>
144 <input type="password" id="input-mylogins-password"
145 ng-model="appDetails.app.appPassword" autocomplete="new-password"
146 name="appPassword" maxlength="256"
147 ng-required="!appDetails.app.restrictedApp" />
148 <div id="app-error-password-container" class="error-container"
149 ng-show="appForm.appPassword.$dirty || appDetails.isEditMode">
150 <div ng-messages="appForm.appPassword.$error"
151 class="error-container">
152 <small id="error-mylogins-password-reqd" class="err-message"
153 ng-message="required">My Logins App Password is
158 <div class="property" ng-show="!appDetails.app.restrictedApp">
159 <div id="pwd-property-label" class="property-label">Password</div>
160 <input type="password" id="input-mylogins-password"
161 ng-model="appDetails.app.appPassword" autocomplete="new-password"
162 name="appPassword" maxlength="256"/>
164 <div class="property" ng-show="!appDetails.app.restrictedApp">
165 <div id="pwd-property-label" class="property-label">Name
167 <input type="text" id="input-mylogins-auth-namespace"
168 ng-model="appDetails.app.nameSpace" name="appAuthNameSpace"
172 <div class="right-container">
173 <div class="property">
174 <div class="property-label">Upload Image</div>
175 <input type="file" id="input-app-image-upload"
176 class="input-file-field" accept="image/*"
177 ng-model="appDetails.originalImage" name="appImage"
178 image-upload="appDetails.originalImage"
179 image-upload-resize-max-height="300"
180 image-upload-resize-max-width="360"
181 image-upload-resize-quality="0.7"
182 image-upload-api="appDetails.imageApi" style="height: 24px;"
183 file-change="appImageHandler($event,files)" />
184 <div id="app-error-image-upload-type" class="error-container"
185 ng-show="appImageTypeError" class="ng-hide">
186 <div class="error-container">
187 <small id="error-app-invalid-image-size" class="err-message">File must be an image</small>
190 file-change="appImageHandler($event,files)" />
191 <div id="app-error-image-upload-type" class="error-container"
192 ng-show="appImageTypeError" class="ng-hide">
193 <div class="error-container">
194 <small id="error-app-invalid-image-size" class="err-message">File must be an image</small>
198 <div id="app-error-image-upload" class="error-container"
199 ng-show="appForm.appImage.$dirty">
200 <div ng-messages="appForm.appImage.$error"
201 class="error-container">
202 <small id="error-app-invalid-image-size" class="err-message"
203 ng-message="imageSize">Image file must be smaller than
208 <div class="property-label preview">
209 <span class="left-label">Preview</span> <span class="remove"
210 ng-click="appDetails.removeImage()">Remove</span>
212 <img id="image-app-preview" class="image-preview"
213 ng-src="{{appDetails.app.imageLink || appDetails.app.thumbnail || appDetails.emptyImgForPreview}}" />
214 <div id="property-communication-inbox" class="property"
215 ng-show="!appDetails.app.restrictedApp">
216 <div id="property-communication-inbox-label"
217 class="property-label">Communication Inbox</div>
218 <input type="text" id="input-UEB-topicname"
219 ng-model="appDetails.app.uebTopicName" name="uebTopicName"
220 readonly="readonly" />
223 <div id="property-communication-key" class="property"
224 ng-show="!appDetails.app.restrictedApp">
225 <div id="property-communication-key-label" class="property-label">Communication
227 <input type="text" id="input-UEB-communication-key"
228 ng-model="appDetails.app.uebKey" name="uebKey"
229 readonly="readonly" />
232 <div id="property-communication-secret" class="property"
233 ng-show="!appDetails.app.restrictedApp">
234 <div id="property-communication-secret-label"
235 class="property-label">Communication Secret</div>
236 <input type="text" id="input-UEB-communication-secret"
237 ng-model="appDetails.app.uebSecret" name="uebSecret"
238 readonly="readonly" />
241 <div id="property-guest-access" class="property">
242 <label for="checkbox-app-is-open" class="checkbox"> <input
243 type="checkbox" ng-model="appDetails.app.isOpen"
244 id="checkbox-app-is-open"
245 ng-checked="appDetails.app.isOpen || appDetails.app.restrictedApp"
246 ng-disabled="appDetails.app.restrictedApp" /> <i class="skin"></i>
247 <span>Allow guest access</span>
250 <div id="property-active" class="property">
251 <label for="checkbox-app-is-enabled" class="checkbox"> <input
252 type="checkbox" ng-model="appDetails.app.isEnabled"
253 id="checkbox-app-is-enabled" /> <i class="skin"></i> <span>Active</span>
257 <div id="property-is-central-auth" class="property"
258 ng-show="!appDetails.app.restrictedApp">
259 <label for="checkbox-app-is-central-auth" class="checkbox">
260 <input type="checkbox" ng-model="appDetails.app.isCentralAuth"
261 id="checkbox-app-is-central-auth" /> <i class="skin"></i> <span>Centralized</span>
272 <div class="b2b-modal-footer">
274 <span class="ecomp-save-spinner" ng-show="appDetails.isSaving"></span>
275 <button id="button-save-app" class="btn btn-alt btn-small"
276 ng-class="{disabled: appForm.$invalid}"
277 ng-click="appDetails.saveChanges()">Save</button>
278 <button id="button-notification-cancel" class="btn btn-alt btn-small"
279 ng-click="$dismiss('cancel')" role="button" tabindex="0">Cancel</button>