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============================================
36 ECOMP is a trademark and service mark of AT&T Intellectual Property.
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">Name
161 <input type="text" id="input-mylogins-auth-namespace"
162 ng-model="appDetails.app.nameSpace" name="appAuthNameSpace"
167 <div class="right-container">
168 <div class="property">
169 <div class="property-label">Upload Image</div>
170 <input type="file" id="input-app-image-upload"
171 class="input-file-field" accept="image/*"
172 ng-model="appDetails.originalImage" name="appImage"
173 image-upload="appDetails.originalImage"
174 image-upload-resize-max-height="300"
175 image-upload-resize-max-width="360"
176 image-upload-resize-quality="0.7"
177 image-upload-api="appDetails.imageApi" style="height: 24px;" />
179 <div id="app-error-image-upload" class="error-container"
180 ng-show="appForm.appImage.$dirty">
181 <div ng-messages="appForm.appImage.$error"
182 class="error-container">
183 <small id="error-app-invalid-image" class="err-message"
184 ng-message="mimeType">Uploaded file must be an image</small> <small
185 id="error-app-invalid-image-size" class="err-message"
186 ng-message="imageSize">Image file must be smaller than
191 <div class="property-label preview">
192 <span class="left-label">Preview</span> <span class="remove"
193 ng-click="appDetails.removeImage()">Remove</span>
195 <img id="image-app-preview" class="image-preview"
196 ng-src="{{appDetails.app.imageLink || appDetails.app.thumbnail || appDetails.emptyImgForPreview}}" />
197 <div id="property-communication-inbox" class="property"
198 ng-show="!appDetails.app.restrictedApp">
199 <div id="property-communication-inbox-label"
200 class="property-label">Communication Inbox</div>
201 <input type="text" id="input-UEB-topicname"
202 ng-model="appDetails.app.uebTopicName" name="uebTopicName"
203 readonly="readonly" />
206 <div id="property-communication-key" class="property"
207 ng-show="!appDetails.app.restrictedApp">
208 <div id="property-communication-key-label" class="property-label">Communication
210 <input type="text" id="input-UEB-communication-key"
211 ng-model="appDetails.app.uebKey" name="uebKey"
212 readonly="readonly" />
215 <div id="property-communication-secret" class="property"
216 ng-show="!appDetails.app.restrictedApp">
217 <div id="property-communication-secret-label"
218 class="property-label">Communication Secret</div>
219 <input type="text" id="input-UEB-communication-secret"
220 ng-model="appDetails.app.uebSecret" name="uebSecret"
221 readonly="readonly" />
224 <div id="property-guest-access" class="property">
225 <label for="checkbox-app-is-open" class="checkbox"> <input
226 type="checkbox" ng-model="appDetails.app.isOpen"
227 id="checkbox-app-is-open"
228 ng-checked="appDetails.app.isOpen || appDetails.app.restrictedApp"
229 ng-disabled="appDetails.app.restrictedApp" /> <i class="skin"></i>
230 <span>Allow guest access</span>
233 <div id="property-active" class="property">
234 <label for="checkbox-app-is-enabled" class="checkbox"> <input
235 type="checkbox" ng-model="appDetails.app.isEnabled"
236 id="checkbox-app-is-enabled" /> <i class="skin"></i> <span>Active</span>
240 <div id="property-is-central-auth" class="property"
241 ng-show="!appDetails.app.restrictedApp">
242 <label for="checkbox-app-is-central-auth" class="checkbox">
243 <input type="checkbox" ng-model="appDetails.app.isCentralAuth"
244 id="checkbox-app-is-central-auth" /> <i class="skin"></i> <span>Centralized</span>
255 <div class="b2b-modal-footer">
257 <span class="ecomp-save-spinner" ng-show="appDetails.isSaving"></span>
258 <button id="button-save-app" class="btn btn-alt btn-small"
259 ng-class="{disabled: appForm.$invalid}"
260 ng-click="appDetails.saveChanges()">Save</button>
261 <button id="button-notification-cancel" class="btn btn-alt btn-small"
262 ng-click="$dismiss('cancel')" role="button" tabindex="0">Cancel</button>