Move Javascript code
[clamp.git] / src / main / resources / META-INF / resources / designer / partials / portfolios / operational_policy_window.html
1 <!--
2   ============LICENSE_START=======================================================
3   ONAP CLAMP
4   ================================================================================
5   Copyright (C) 2017-2018 AT&T Intellectual Property. All rights
6                               reserved.
7   ================================================================================
8   Licensed under the Apache License, Version 2.0 (the "License"); 
9   you may not use this file except in compliance with the License. 
10   You may obtain a copy of the License at
11   
12   http://www.apache.org/licenses/LICENSE-2.0
13   
14   Unless required by applicable law or agreed to in writing, software 
15   distributed under the License is distributed on an "AS IS" BASIS, 
16   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 
17   See the License for the specific language governing permissions and 
18   limitations under the License.
19   ============LICENSE_END============================================
20   ===================================================================
21   
22   -->
23
24
25 <style>
26 .disabled {
27         background-color: #dddd;
28 }
29
30 label {
31         text-align: right;
32         vertical-align: middle;
33 }
34
35 .leftPolicyPanel {
36         padding: 0 10px 0 0;
37 }
38
39 .idError {
40         color: red;
41         padding: 50px 0px;
42         text-align: center;
43         display: none;
44 }
45
46 .policyPanel {
47         background-color: #f5f5f5;
48         padding: 15px 5px 0 5px;
49 }
50
51 .form-group.clearfix {
52         display: -webkit-flex;
53         display: flex;
54         align-items: center;
55 }
56
57 label {
58         margin-bottom: 0px;
59 }
60
61 #policyTable {
62         cursor: pointer;
63         width: 100%;
64 }
65
66 #policyTable tr {
67         border-bottom: 1px solid #ddd;
68         border-collapse: collapse;
69         text-align: left;
70         font-size: 12px;
71         font-weight: normal;
72 }
73
74 #policyTable td {
75         padding: 8px 10px;
76 }
77
78 #policyTable tr.highlight {
79         background-color: #f5f5f5;
80         font-weight: bold;
81         font-size: 13px;
82 }
83
84 #policyTableHolder {
85         height: 200px;
86         width: 100%;
87         overflow: auto;
88 }
89 </style>
90
91
92 <div attribute-test="policywindowproperties" id="configure-widgets"
93         class="disabled-block-container">
94         <div attribute-test="policywindowpropertiesh" class="modal-header">
95                 <button type="button" class="close" ng-click="close(false)"
96                         aria-hidden="true" style="margin-top: -3px">&times;</button>
97                 <h4>Operational Policy</h4>
98         </div>
99
100
101         <div class="modal-body">
102                 <div attribute-test="policywindowpropertiesb" class="modal-body row">
103                         <div class="leftPolicyPanel" style="display: none;">
104                                 <div class="panel panel-default">
105                                         <div id="policyTableHolder">
106                                                 <table id="policyTable"></table>
107                                         </div>
108                                 </div>
109
110                                 <div id="spaceError" class="idError">Error: Spaces are not
111                                         allowed in the ID.</div>
112                         </div>
113                         <div class="panel panel-default col-sm-9 policyPanel">
114                                 <form id="Timeoutform" class="form-horizontal">
115                                         <div>
116                                                 <div class="form-group clearfix row">
117                                                         <label class="col-sm-2">Name</label>
118                                                         <div class="col-sm-3" style="padding: 0px;">
119                                                                 <input type="text" id="pname" name="pname" maxlength="48"
120                                                                         placeholder="Enter Unique Name" class="form-control">
121                                                         </div>
122
123                                                         <label class="col-sm-1">ID</label>
124                                                         <div class="col-sm-1" style="padding: 0px;">
125                                                                 <input onkeydown="return false;" type="text" id="pid" name="pid"
126                                                                         class="form-control" readonly>
127                                                         </div>
128
129                                                         <label for="userID" class="col-sm-3"
130                                                                 style="padding-left: 5px; padding-right: 10px;">Overall
131                                                                 Time Limit</label>
132                                                         <div class="col-sm-2" style="padding-left: 0px;">
133                                                                 <input type="text" maxlength="10"
134                                                                         ng-keypress="isNumberKey(event)" class="form-control"
135                                                                         id="timeout" name="timeout">
136                                                         </div>
137                                                 </div>
138                                         </div>
139                                 </form>
140                                 <div class="panel-heading" style="background-color: white;">
141                                         <ul id="nav_Tabs" class="nav nav-tabs">
142                                                 <li class><a id="add_one_more" href="#desc_tab"><span
143                                                                 class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li>
144                                         </ul>
145                                 </div>
146                                 <div class="panel-body">
147                                         <div class="tab-content">
148                                                 <div id="properties_tab" class="tab-pane fade in active"></div>
149                                         </div>
150                                 </div>
151                         </div>
152
153                         <span id="formSpan" style="display: none">
154                                 <form class="saveProps" class="form-horizontal">
155                                         <div>
156                                                 <div class="form-group clearfix">
157                                                         <label class="col-sm-4 control-label" for="recipe">Recipe</label>
158                                                         <div class="col-sm-8">
159                                                                 <select class="form-control" name="recipe" id="recipe"
160                                                                         enableFilter="true"></select>
161                                                         </div>
162                                                 </div>
163                                                 <div class="form-group clearfix">
164                                                         <label for="maxRetries" class="col-sm-4 control-label">
165                                                                 Max Retries</label>
166                                                         <div class="col-sm-8">
167                                                                 <input type="text" maxlength="5" class="form-control"
168                                                                         id="maxRetries" ng-keypress="isNumberKey(event)"
169                                                                         name="maxRetries"> </input>
170                                                         </div>
171                                                 </div>
172                                                 <div class="form-group clearfix">
173                                                         <label for="retryTimeLimit" class="col-sm-4 control-label">
174                                                                 Retry Time Limit</label>
175                                                         <div class="col-sm-8">
176                                                                 <input type="text" maxlength="5" class="form-control"
177                                                                         id="retryTimeLimit" ng-keypress="isNumberKey(event)"
178                                                                         name="retryTimeLimit"></input>
179                                                         </div>
180                                                 </div>
181                                                 <div style="display: none;" class="form-group clearfix">
182                                                         <label for="_id" class="col-sm-4 control-label"> PolicyID</label>
183                                                         <div class="col-sm-8">
184                                                                 <input type="text" onkeydown="return false;"
185                                                                         class="form-control" id="_id" name="_id" value=""></input>
186                                                         </div>
187                                                 </div>
188                                                 <div class="form-group clearfix">
189                                                         <label for="parentPolicy" class="col-sm-4 control-label">
190                                                                 Parent Policy</label>
191                                                         <div class="col-sm-8">
192                                                                 <select class="form-control" id="parentPolicy"
193                                                                         name="parentPolicy" enableFilter="true"><option
194                                                                                 value=""></option></select>
195                                                         </div>
196                                                 </div>
197                                                 <div class="form-group clearfix">
198                                                         <label for="parentPolicyConditions"
199                                                                 class="col-sm-4 control-label"> Parent Policy Conditions</label>
200                                                         <div class="col-sm-8">
201                                                                 <select class="form-control" id="parentPolicyConditions"
202                                                                         name="parentPolicyConditions" multiple></select>
203                                                         </div>
204                                                 </div>
205                                                 <div class="form-group clearfix">
206
207                                                         <label for="actor" class="col-sm-4 control-label"> Actor</label>
208                                                         <div class="col-sm-8">
209                                                                 <select class="form-control" id="actor" name="actor"></select>
210                                                         </div>
211
212                                                         <label for="payload" class="col-sm-4 control-label">
213                                                                 Payload (YAML)</label>
214                                                         <div class="col-sm-8">
215                                                                 <textarea class="form-control" id="recipePayload" name=recipePayload></textarea>
216                                                         </div>
217                                                 </div>
218                                                 <div class="form-group clearfix">
219                                                         <label for="targetType" class="col-sm-4 control-label">
220                                                                 Target Type</label>
221                                                         <div class="col-sm-8">
222                                                                 <select class="form-control" name="recipeLevel" id="recipeLevel">
223                                                                 </select>
224                                                         </div>
225
226                                                         <label for="targetResourceId" class="col-sm-4 control-label">
227                                                                 Target ResourceId</label>
228                                                         <div class="col-sm-8">
229                                                                 <select class="form-control" name="targetResourceId"
230                                                                         id="targetResourceId" enableFilter="true"
231                                                                         ng-change="changeTargetResourceIdOther()" ng-model="targetResource" >
232                                                                         <option value=""></option>
233                                                                         <option value="Other:">Other:</option>
234                                                                 </select>
235                                                         </div>
236                                                         <input type="text" style="display: none" class="form-control"
237                                                                 id="targetResourceIdOther" name="targetResourceIdOther" value=""></input>
238                                                 </div>
239                                                 <div style="border: 2px dotted gray;">
240                                                         <div class="form-group clearfix">
241                                                                 <label for="enableGuardPolicy" class="col-sm-4 control-label">
242                                                                         Enable Guard Policy</label>
243                                                                 <div class="col-sm-8">
244                                                                         <input type="checkbox" class="form-control"
245                                                                                 name="enableGuardPolicy" id="enableGuardPolicy">
246                                                                 </div>
247                                                                 <div class="col-sm-8">
248                                                                         <label for="guardPolicyType" class="col-sm-4 control-label">
249                                                                                 Guard Policy Type</label> <select class="form-control"
250                                                                                 name="guardPolicyType" id="guardPolicyType"
251                                                                                 ng-change="changeGuardPolicyType()" ng-model="guardType">
252                                                                                 <option value="GUARD_MIN_MAX">MinMax</option>
253                                                                                 <option value="GUARD_YAML">FrequencyLimiter</option>
254                                                                         </select>
255                                                                 </div>
256                                                                 <label for="guardTargets" class="col-sm-4 control-label">Guard
257                                                                         targets</label>
258                                                                 <div class="col-sm-8">
259                                                                         <input class="form-control" name="guardTargets"
260                                                                                 id="guardTargets" />
261                                                                 </div>
262                                                         </div>
263
264                                                         <div class="form-group clearfix" id="minMaxGuardPolicyDiv">
265                                                                 <label for="minGuard" class="col-sm-4 control-label">
266                                                                         Min Guard</label>
267                                                                 <div class="col-sm-8">
268                                                                         <input class="form-control" name="minGuard" id="minGuard" />
269                                                                 </div>
270                                                                 <label for="maxGuard" class="col-sm-4 control-label">
271                                                                         Max Guard</label>
272                                                                 <div class="col-sm-8">
273                                                                         <input class="form-control" name="maxGuard" id="maxGuard" />
274                                                                 </div>
275                                                         </div>
276                                                         <div class="form-group clearfix"
277                                                                 id="frequencyLimiterGuardPolicyDiv" style="display: none">
278                                                                 <label for="limitGuard" class="col-sm-4 control-label">Limit</label>
279                                                                 <div class="col-sm-8">
280                                                                         <input class="form-control" name="limitGuard" id="limitGuard" />
281                                                                 </div>
282                                                                 <div class="col-sm-8">
283                                                                         <select class="form-control" name="timeUnitsGuard"
284                                                                                 id="timeUnitsGuard" /> <label for="timeWindowGuard"
285                                                                                 class="col-sm-4 control-label">Time Window</label>
286                                                                 </div>
287                                                                 <div class="col-sm-8">
288                                                                         <input class="form-control" name="timeWindowGuard"
289                                                                                 id="timeWindowGuard" />
290                                                                 </div>
291                                                         </div>
292                                                         <div class="form-group clearfix">
293                                                                 <label for="guardActiveStart" class="col-sm-4 control-label">
294                                                                         Guard Active Start</label>
295                                                                 <div class="col-sm-8">
296                                                                         <input class="form-control" name="guardActiveStart"
297                                                                                 id="guardActiveStart" />
298                                                                 </div>
299                                                                 <label for="guardActiveEnd" class="col-sm-4 control-label">
300                                                                         Guard Active End</label>
301                                                                 <div class="col-sm-8">
302                                                                         <input class="form-control" name="guardActiveEnd"
303                                                                                 id="guardActiveEnd" />
304                                                                 </div>
305                                                         </div>
306                                                 </div>
307                                         </div>
308                                 </form>
309                         </span>
310                 </div>
311         </div>
312
313         <div attribute-test="policywindowpropertiesf" class="modal-footer">
314                 <button id="savePropsBtn" class="btn btn-primary">Close</button>
315                 <button ng-click="close(true)" id="close_button"
316                         class="btn btn-primary">Cancel</button>
317         </div>
318
319 </div>