src/main/resources/META-INF/resources/designer/partials/portfolios/global_properties.html

   1 <!--
   2   ============LICENSE_START=======================================================
   3   ONAP CLAMP
   4   ================================================================================
   5   Copyright (C) 2017 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 .fileUpload {
  27         position: relative;
  28         overflow: hidden;
  29         margin: 10px;
  30 }
  31
  32 .fileUpload input.upload {
  33         position: absolute;
  34         top: 0;
  35         right: 0;
  36         margin: 0;
  37         padding: 0;
  38         font-size: 20px;
  39         cursor: pointer;
  40         opacity: 0;
  41         filter: alpha(opacity = 0);
  42         float: left;
  43 }
  44
  45 .fileDisplay {
  46         display: inline-block;
  47         overflow: hidden;
  48         float: right;
  49         margin-left: 0px;
  50         z-index: initial;
  51         text-align: center;
  52         margin-top: 17px;
  53 }
  54  #paramsWarn {
  55       display: none;
  56 }
  57 </style>
  58 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  59 <script type="text/javascript">
  60         function disablefile() {
  61
  62                 document.getElementById("fileUpload").disabled = true;
  63
  64         }
  65
  66         function disableSVN() {
  67
  68                 document.getElementById("schemaLocation").disabled = true;
  69                 document.getElementById("userID").disabled = true;
  70                 document.getElementById("password").disabled = true;
  71
  72         }
  73
  74 </script>
  75
  76
  77 <div id="configure-widgets">
  78         <div class="modal-header">
  79                 <button type="button" class="close" ng-click="close(false)"
  80                         aria-hidden="true" style="margin-top: -3px">&times;</button>
  81                 <h4>Model Properties</h4>
  82         </div>
  83
  84         <div class="modal-body" style="height: 280px">
  85                 <i hidden id="ridinSpinners" class="fa fa-spinner fa-spin" style="display:none;margin-bottom:10px;width:100%;text-align:center;font-size:24px;color:black;"></i>
  86                 <form id="saveProps" >
  87                                 <div class="alert alert-danger" role="alert" id='paramsWarn'>
  88                                                         <strong>Ooops!</strong> Unable to load properties for <span id='servName'>. Would you like to</span>
  89                                                         <a href="javascript:void(0);" class="btn-link"  id='paramsRetry'>Retry </a> /
  90                                                         <a href="javascript:void(0);" class="btn-link" id='paramsCancel'>Cancel</a>
  91                                                 </div>
  92                                                 <div>
  93
  94                                         <div class="form-group clearfix">
  95                                                 <label for="services" class="col-sm-4 control-label" >Services</label>
  96
  97                                                 <div class="col-sm-8">
  98                                                         <select  class="form-control"
  99                                                                 name="service" id="service" onchange="propChangeAlert(this);">
 100 <!--                                                             <option ng-repeat="(key, value) in services" value="{{key}}">{{value}}</option>  -->
 101                                                         </select>
 102                                                 </div>
 103                                         </div>
 104                                         <div class="form-group clearfix">
 105                                                 <label for="vf" class="col-sm-4 control-label">
 106                                                         Resource-VF</label>
 107
 108                                                 <div class="col-sm-8">
 109                                                         <select class="form-control" id="vf" name="vf" onchange="propChangeAlert(this);">
 110
 111                                                         </select>
 112
 113                                                 </div>
 114                                         </div>
 115
 116                                         <div class="form-group clearfix">
 117                                                 <label for="actionSet" class="col-sm-4 control-label">
 118                                                         Action Set</label>
 119
 120                                                 <div class="col-sm-8">
 121                                                         <select class="form-control" id="actionSet" name="actionSet" onchange="propChangeAlert(this);">
 122                                                         </select>
 123
 124                                                 </div>
 125                                         </div>
 126
 127                                         <div class="form-group clearfix">
 128                                                 <label for="location" class="col-sm-4 control-label">
 129                                                         Location</label>
 130
 131                                                 <div class="col-sm-8">
 132                                                         <select class="form-control" id="location" name="location" multiple size=2>
 133
 134                                                         </select>
 135
 136                                                 </div>
 137                                         </div>
 138
 139
 140
 141                                 </div>
 142
 143                 </form>
 144                 <div class="alert alert-warning propChangeWarn" style="display:none;">
 145                         <strong>Warning!</strong> Changing these properties will reset all associated GUI fields.
 146                 </div>
 147
 148         </div>
 149         <div class="modal-footer">
 150                 <!--<button ng-click="reset()" class="btn btn-primary" style="float:left">Reset</button>-->
 151                 <button id="savePropsBtn" class="btn btn-primary">Save</button>
 152                 <button ng-click="close(true)" id="close_button"
 153                         class="btn btn-primary">Cancel</button>
 154
 155         </div>
 156   <!-- <select id="vUSP_vfc" disabled hidden></select>
 157         <select id="vUSP_location" disabled hidden></select>
 158         <select id="vUSP_recipe" disabled hidden></select>
 159         <select id="vUSP_vf" disabled hidden></select>
 160
 161         <select id="Trinity_vfc" disabled hidden></select>
 162         <select id="Trinity_location" disabled hidden></select>
 163         <select id="Trinity_recipe" disabled hidden></select>
 164         <select id="Trinity_vf" disabled hidden></select>
 165
 166
 167         <select id="vSCP_vfc" disabled hidden></select>
 168         <select id="vSCP_location" disabled hidden></select>
 169         <select id="vSCP_recipe" disabled hidden></select>
 170         <select id="vSCP_vf" disabled hidden></select>
 171
 172         <select id="vProbes_vfc" disabled hidden></select>
 173         <select id="vProbes_location" disabled hidden></select>
 174         <select id="vProbes_recipe" disabled hidden></select>
 175         <select id="vProbes_vf" disabled hidden></select>       -->
 176
 177
 178         <script>
 179 //              $.ajax({
 180 //                      async:false,
 181 //                  dataType: "json",
 182 //                  url: '/restservices/clds/v1/clds/asdc/services/',
 183 //                  success: function(data){
 184 //                      vf_Services=data;
 185 //                  },
 186 //                  error:function(s,a,err){
 187 //                      console.log(err)
 188 //                      console.log(s)
 189 //                      console.log(a)
 190 //                  },
 191 //                  timeout:100000
 192 //              });
 193 //              var services=vf_Services.service
 194 //              console.log(elementMap["global"])
 195 //              for(k in services){
 196 //                      console.log("lol")
 197 //                      $("#service").append("<option value="+k+">"+services[k]+"</option>")
 198 //              }
 199 //              loadSharedPropertyByService()
 200 //              var el = elementMap["global"];
 201 //              $("#status").val($("#activity_modeler").text())
 202 //              if (el !== undefined) {
 203 //                      for (var i = 0; i < el.length; i++) {
 204 //                              $("#" + el[i].name).val(el[i].value);
 205 //                      }
 206 //              }
 207
 208                 //display message only if global was previously saved
 209                 serDiff = false;
 210                 vfDiff = false;
 211                 asDiff = false;
 212
 213          (function () {
 214                     $("#paramsWarn").hide();
 215                     /*Below service method is called for checking the service is being loaded or not*/
 216
 217                         var intialize = intializeService;
 218
 219                         function intializeService() {
 220                                 $("#service").off('focus').off('change');
 221
 222                                 $("#service").on('change', function(){
 223                                         var chosen = $(this).val();
 224                                         (function(spinner){
 225                                                 $("#ridinSpinners").show();
 226                                                 setTimeout(spinner, 1);
 227                                         })(function(){
 228                                                 loadSharedPropertyByService(chosen, null, intialize);
 229                                                 if (elementMap["global"]){
 230                                                         if ($("#vf").val() == oldVf){
 231                                                                 vfDiff = false;
 232                                                                 if ((!vfDiff)&&(!asDiff)&&(!serDiff)){
 233                                                                         $(".propChangeWarn").hide();
 234                                                                 };
 235                                                         } else {
 236                                                                 vfDiff = true;
 237                                                                 $(".propChangeWarn").show();
 238                                                         }
 239                                                 }
 240                                                 $("#ridinSpinners").hide();
 241                                         });
 242                                 });
 243                         }
 244
 245                         loadSharedPropertyByService(undefined, null, intialize);
 246                         intializeService();
 247
 248                         $("#paramsRetry").on('click', function () {
 249                                 //$("#paramsWarn").hide();
 250                                 var currentValue = $("#service").val();
 251                                 $("#ridinSpinners").css("display","")
 252                                 var bool=loadSharedPropertyByService(currentValue);
 253                                 $("#ridinSpinners").css("display","none")
 254                         });
 255                         $("#paramsCancel").on('click', function () {
 256                                 loadSharedPropertyByServiceProperties();
 257                                 $("#paramsWarn").hide();
 258
 259                         });
 260
 261                 })();
 262
 263                 function noRepeats(form){
 264                         var select={};
 265                         for(var i=0;i<form.length;i++){
 266                                 if(form[i].hasOwnProperty("name")){
 267                                                 if(select[form[i].name]===undefined)
 268                                                         select[form[i].name]=[]
 269                                                 select[form[i].name].push(form[i].value);
 270                                         }
 271                         }
 272                         var arr=[]
 273                         for(s in select){
 274                                 var f={}
 275                                 f.name=s
 276                                 f.value=select[s]
 277                                 if (!(s=="service" && f.value=="")){
 278                                         arr.push(f)
 279                                 }
 280                         }
 281                         return arr
 282                 }
 283
 284                 $(function(){
 285                         if (elementMap["global"]){
 286                                 for (var i=0; i< elementMap["global"].length; i++){
 287                                         if (elementMap["global"][i]["name"]=="vf"){
 288                                                 oldVf = elementMap["global"][i]["value"];
 289                                         }
 290                                 }
 291                         } else {
 292                                 oldVf = "";
 293                         }
 294                 });
 295
 296                 function propChangeAlert(actionset){
 297                         //throw warnings only if options were previously chosen
 298                         if (elementMap["global"]){
 299                                 loop1:
 300                                 for (var i=0; i< elementMap["global"].length; i++){
 301                                         if (elementMap["global"][i]["name"] == actionset.id){
 302                                                 //user did not change properties
 303                                                 if (elementMap["global"][i]["value"][0] == actionset.value){
 304                                                         if (elementMap["global"][i]["name"] == "actionSet"){
 305                                                                 asDiff = false;
 306                                                         } else if (elementMap["global"][i]["name"] == "service"){
 307                                                                 serDiff = false;
 308                                                         }  else if (elementMap["global"][i]["name"] == "vf"){
 309                                                                 vfDiff = false;
 310                                                         }
 311                                                         if ((!vfDiff)&&(!asDiff)&&(!serDiff)){
 312                                                                 $(".propChangeWarn").hide();
 313                                                         };
 314                                                 //user changed properties
 315                                                 } else {
 316                                                         if (elementMap["global"][i]["name"] == "actionSet"){
 317                                                                 asDiff = true;
 318                                                         } else if (elementMap["global"][i]["name"] == "service"){
 319                                                                 serDiff = true;
 320                                                         } else if (elementMap["global"][i]["name"] == "vf"){
 321                                                                 vfDiff = true;
 322                                                         };
 323                                                         $(".propChangeWarn").show();
 324                                                 }
 325                                                 break loop1;
 326                                         }
 327                                 }
 328                         }
 329                 }
 330
 331                 $("#saveProps").on('submit', function(event) {
 332                         saveGlobalProperties(noRepeats($(this).serializeArray()))
 333                         event.preventDefault();
 334
 335                         //module reset, based on property updates
 336                         if (elementMap["global"]){
 337                                 $.each(Object.keys(elementMap), function(i,v){
 338                                         if ((v.match(/^Policy/)) && asDiff){
 339                                                 elementMap[v]={};
 340                                         }
 341                                         if ((v.match(/^TCA/)) && (vfDiff || serDiff)){
 342                                                 elementMap[v]={};
 343                                         }
 344                                 });
 345                         };
 346
 347                         $("#close_button").click();
 348                 })
 349
 350                 $("#savePropsBtn").click(function(event) {
 351                         //alert($("#CProp_Target").val())
 352                         $("#saveProps").submit();
 353                 })
 354
 355
 356         </script>
 357 </div>