src/main/resources/META-INF/resources/designer/partials/portfolios/stringMatch_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   ECOMP is a trademark and service mark of AT&T Intellectual Property.
  22   -->
  23 <style>
  24 #deleteStringMatch{
  25         height:34px;
  26         background-color:#dddd;
  27 }
  28
  29 .disabled{
  30         background-color: #dddd;
  31 }
  32 .fileUpload {
  33         position: relative;
  34         overflow: hidden;
  35         margin: 10px;
  36 }
  37
  38 .fileUpload input.upload {
  39         position: absolute;
  40         top: 0;
  41         right: 0;
  42         margin: 0;
  43         padding: 0;
  44         font-size: 20px;
  45         cursor: pointer;
  46         opacity: 0;
  47         filter: alpha(opacity = 0);
  48         float: left;
  49 }
  50
  51 .fileDisplay {
  52         display: inline-block;
  53         overflow: hidden;
  54         float: right;
  55         margin-left: 0px;
  56         z-index: initial;
  57         text-align: center;
  58         margin-top: 17px;
  59 }
  60
  61 .form-group {
  62 /*      height:24px; */
  63 /*      box-sizing:border-box; */
  64         margin-bottom:20px;
  65 }
  66
  67 .modelSearchBox{
  68         position:absolute;
  69         padding: 25px 12px;
  70 }
  71
  72 label{
  73         text-align:right;
  74         vertical-align:middle;
  75 }
  76
  77 .leftStringMatchPanel{
  78         padding: 0 10px 0 0;
  79 }
  80
  81 #createNewStringMatch{
  82         height:34px;
  83         width:120px; /*84*/
  84         background-color:#f2bfab;
  85 }
  86
  87 .idError{
  88         color:red;
  89         padding:50px 0px;
  90         text-align:center;
  91         display:none;
  92 }
  93
  94 #rgname{
  95         height:28px;
  96         margin-left:-5px;
  97 }
  98
  99 .stringMatchPanel{
 100         background-color: #f5f5f5;
 101         padding: 10px 5px;
 102 }
 103
 104 #stringMatchSearch{
 105         height: 33px;
 106         font-size: 12px;
 107         padding: 2px 2px 2px 30px;
 108         margin-bottom: 5px;
 109         width:100%;
 110 }
 111 #stringMatchTable{
 112         cursor: pointer;
 113         width:100%;
 114 }
 115
 116 #stringMatchTable tr{
 117         border-bottom: 1px solid #ddd;
 118         border-collapse: collapse;
 119         text-align: left;
 120         font-size: 12px;
 121         font-weight: normal;
 122 }
 123
 124 #stringMatchTable td{
 125         padding: 8px 10px;
 126 }
 127
 128 #stringMatchTable tr.highlight{
 129         background-color: #f5f5f5;
 130         font-weight: bold;
 131         font-size: 13px;
 132 }
 133
 134 #stringMatchTableHolder{
 135         height:200px;
 136         width: 100%;
 137         overflow:auto;
 138 }
 139
 140 #timeout{
 141         height:28px;
 142         margin-left:10px;
 143 }
 144
 145 </style>
 146
 147 <script type="text/javascript">
 148         function disablefile() {
 149
 150                 document.getElementById("fileUpload").disabled = true;
 151
 152         }
 153
 154         function disableSVN() {
 155                 var selectLength = document.querySelectorAll(".disabled-block-container .tab-close-popup");
 156                 if(selectLength && selectLength.length>0){
 157                         for(var i = 0; i< selectLength.length ; i++){
 158                                 selectLength[i].disabled = true;
 159                         }
 160                 }
 161
 162                 document.getElementById("schemaLocation").disabled = true;
 163                 document.getElementById("userID").disabled = true;
 164                 document.getElementById("password").disabled = true;
 165
 166         }
 167 </script>
 168
 169
 170 <div attribute-test="stringMatchwindowproperties" id="configure-widgets" class="disabled-block-container">
 171         <div attribute-test="stringMatchwindowpropertiesh" class="modal-header">
 172                 <button type="button" class="close" ng-click="close(false)"
 173                         aria-hidden="true" style="margin-top: -3px">&times;</button>
 174                 <h4>String Matching Micro Service</h4>
 175         </div>
 176
 177
 178         <div class="modal-body">
 179                 <div attribute-test="stringMatchwindowpropertiesb" class="modal-body row">
 180
 181                         <div class="leftStringMatchPanel">
 182                                 <div class="panel panel-default">
 183                                         <i class="modelSearchBox"></i> <input type="text"
 184                                                 id="stringMatchSearch" onkeyup="searchStringMatchList()"
 185                                                 placeholder="Search ...">
 186                                         <div id="stringMatchTableHolder">
 187                                                 <table id="stringMatchTable"></table>
 188                                         </div>
 189                                 </div>
 190                                 <div style="float: left">
 191                                         <button type="button" id="createNewStringMatch" class="btn btn-sm">New Group</button>
 192                                         </span>
 193                                 </div>
 194                                 <div style="float: right">
 195                                         <button type="button" id="deleteStringMatch" class="btn btn-sm glyphicon glyphicon-trash" disabled></button>
 196                                         </span>
 197                                 </div>
 198                                 <div id="repeatIdError" class="idError">Error: This Group name is already taken.</div>
 199                                 <div id="newIdError" class="idError">Error: Please rename your new Group.</div>
 200                         </div>
 201
 202                         <div class="panel panel-default col-sm-9 stringMatchPanel"
 203                                 style="display: none;">
 204                                 <form id="topicPublish" class="form-horizontal">
 205                                         <div>
 206 <!--                                            As per the last minute new requirements for 1707 the ID needs to be hidden and we need to have a friendly name instead -->
 207                                                         <div style="display: none;">
 208                                                                 <div class="form-group clearfix">
 209                                                                         <label class="col-sm-4 control-label">Resource Group Id</label>
 210                                                                         <div class="col-sm-8">
 211                                                                                 <input class="form-control" id="rgname" name="rgname" readOnly> </input>
 212                                                                         </div>
 213                                                                 </div>
 214                                                         </div>
 215
 216                                                         <div>
 217                                                                 <div class="form-group clearfix">
 218                                                                         <label class="col-sm-4 control-label">Resource Group</label>
 219                                                                         <div class="col-sm-8">
 220                                                                                 <input class="form-control" maxlength="48" placeholder="Enter Unique Name" id="rgfriendlyname" name="rgfriendlyname"> </input>
 221                                                                         </div>
 222                                                                 </div>
 223                                                         </div>
 224
 225                                                         <!--Policy's drop down box -->
 226                                                         <div class="form-group clearfix">
 227                                                                 <label class="col-sm-4 control-label">Ops Policy:</label>
 228                                                                 <div class="col-sm-8">
 229                                                                         <select class="form-control" id="policyName" name="policyName"
 230                                                                                 autofocus="autofocus" required ng-trim="true">
 231                                                                                 <option ng-repeat="x in policyNames" value="{{x}}">{{x}}</option>
 232                                                                         </select>
 233                                                                 </div>
 234                                                         </div>
 235
 236                                         </div>
 237                                 </form>
 238
 239                                 <div class="panel-heading" style="background-color: white;">
 240                                         <ul id="nav_Tabs" class="nav nav-tabs">
 241                                                 <li class><a id="add_one_more" href="#desc_tab"><span
 242                                                                 class="glyphicon glyphicon-plus" aria-hidden="true"></span></a></li>
 243                                         </ul>
 244                                 </div>
 245                                 <div class="panel-body">
 246                                         <div class="tab-content">
 247                                                 <div id="properties_tab" class="tab-pane fade in active"></div>
 248                                         </div>
 249                                 </div>
 250                         </div>
 251
 252                         <span id="formSpan" style="display: none">
 253                                 <form class="saveProps" class="form-horizontal">
 254
 255                                         <div>
 256                                                 <div class="form-group clearfix">
 257                                                         <label for="aaiMatchingFields" class="col-sm-4 control-label">AAI Fields Matching </label>
 258                                                         <div class="col-sm-8">
 259                                                                 <select class="form-control" name="aaiMatchingFields" id="aaiMatchingFields" multiple size=2></select>
 260                                                         </div>
 261
 262                                                 </div>
 263                                                 <div class="form-group clearfix">
 264                                                         <label for="aaiSendFields" class="col-sm-4 control-label">AAI Fields Send (Select Multiple)</label>
 265
 266                                                         <div class="col-sm-8 ">
 267                                                                 <select class="form-control" id="aaiSendFields"
 268                                                                         name="aaiSendFields" multiple size=2>
 269                                                                 </select>
 270
 271                                                         </div>
 272                                                 </div>
 273 <!--                                            <div class="form-group clearfix"> -->
 274 <!--                                                    <label for="groupNumber" class="col-sm-4 control-label"> -->
 275 <!--                                                            Resource-Group</label> -->
 276
 277 <!--                                                    <div class="col-sm-8"> -->
 278 <!--                                                            <input type="number" class="form-control" id="groupNumber" -->
 279 <!--                                                                    name="groupNumber" min="0"> </input> -->
 280
 281 <!--                                                    </div> -->
 282 <!--                                            </div> -->
 283                                                 <div class="form-group clearfix">
 284                                                         <label for="vfc" class="col-sm-4 control-label">Resource-VFC</label>
 285                                                         <div class="col-sm-8">
 286                                                                 <select class="form-control" id="vfc" name="vfc">
 287
 288                                                                 </select>
 289
 290                                                         </div>
 291                                                 </div>
 292                                                 <div class="form-group clearfix">
 293                                                         <label for="alarmCondition" class="col-sm-4 control-label">Alarm Condition</label>
 294                                                         <div class="col-sm-8">
 295                                                                 <select class="form-control" id="alarmCondition" name="alarmCondition">
 296
 297                                                                 </select>
 298                                                         </div>
 299                                                 </div>
 300                                                 <div class="form-group clearfix">
 301                                                         <label for="eventSeverity" class="col-sm-4 control-label">Event Severity</label>
 302                                                         <div class="col-sm-8">
 303                                                                 <select class="form-control" id="eventSeverity"
 304                                                                         name="eventSeverity" enableFilter="false"></select>
 305                                                         </div>
 306                                                 </div>
 307                                                 <div class="form-group clearfix">
 308                                                         <label for="eventSourceType" class="col-sm-4 control-label">
 309                                                                 Event Source Type</label>
 310                                                         <div class="col-sm-8">
 311                                                                 <input type="text" class="form-control" id="eventSourceType"
 312                                                                         name="eventSourceType" readOnly></input>
 313                                                         </div>
 314                                                 </div>
 315
 316                                                 <div class="form-group clearfix">
 317                                                         <label for="timeWindow" class="col-sm-4 control-label">
 318                                                                 Time Window</label>
 319
 320                                                         <div class="col-sm-8">
 321                                                                 <input type="text" maxlength="5" class="form-control"
 322                                                                         onkeypress="return isNumberKey(event)"
 323                                                                         id="timeWindow" name="timeWindow" />
 324                                                         </div>
 325                                                 </div>
 326                                                 <div class="form-group clearfix">
 327                                                         <label for="ageLimit" class="col-sm-4 control-label"> Age
 328                                                                 Limit</label>
 329
 330                                                         <div class="col-sm-8">
 331                                                                 <input type="text" maxlength="5" class="form-control" id="ageLimit"
 332                                                                         onkeypress="return isNumberKey(event)"
 333                                                                         name="ageLimit" />
 334                                                         </div>
 335                                                 </div>
 336                                                 <div class="form-group clearfix">
 337                                                         <label for="createClosedLoopEventId"
 338                                                                 class="col-sm-4 control-label"> Create CL Event ID</label>
 339                                                         <div class="col-sm-8">
 340                                                                 <select class="form-control" id="createClosedLoopEventId"
 341                                                                         name="createClosedLoopEventId" enableFilter="false">
 342                                                                 </select>
 343
 344                                                         </div>
 345                                                 </div>
 346
 347                                                 <div class="form-group clearfix">
 348                                                         <label for="outputEventName" class="col-sm-4 control-label">
 349                                                                 Output Event Name</label>
 350
 351                                                         <div class="col-sm-8">
 352                                                                 <select class="form-control" id="outputEventName"
 353                                                                         name="outputEventName" enableFilter="false"></select>
 354
 355                                                         </div>
 356                                                 </div>
 357                                         </div>
 358
 359
 360
 361                                 </form>
 362                         </span>
 363                 </div>
 364         </div>
 365
 366         <div attribute-test="stringMatchwindowpropertiesf" class="modal-footer">
 367                 <!--<button ng-click="reset()" class="btn btn-primary" style="float:left">Reset</button>-->
 368                 <button id="savePropsBtn" class="btn btn-primary">Close</button>
 369                 <button ng-click="close(true)" id="close_button"
 370                         class="btn btn-primary">Cancel</button>
 371         </div>
 372
 373         <script>
 374
 375                 //Basically this method will add a new form. All forms share the same class. When you want one form to show(active form) the other forms get the
 376                 // css attribute display:none
 377                 $("#add_one_more").click(function(event) {
 378                         event.preventDefault();
 379                         add_one_more();
 380                         setMultiSelect();
 381                 });
 382
 383
 384                 //This method will load the existing Strin Match onto the screen
 385                 loadPropertyWindow("string_match");
 386                 setASDCFields();
 387
 388                 // By default, parentStringMatchConditions is disabled
 389                 $("#parentStringMatchConditions").prop('disabled', 'disabled');
 390
 391
 392                 var parent_stringMatch = {}
 393                 var stringMatch_ids = {}
 394                 var loadingId = false;
 395                 var allSMatch = {};
 396                 var vfc_temp=""
 397                 var alarm_conditions_temp=""
 398                 var event_severity_temp=""
 399                 var event_type_source_temp=""
 400
 401                 //Grab saved values for dropdowns
 402                 var obj = elementMap[lastElementSelected];
 403
 404                 if (!($.isEmptyObject(obj))) {
 405                         allSMatch = jQuery.extend({}, obj);
 406                         for ( var x in allSMatch) {
 407                                 $("#stringMatchTable").prepend(
 408                                                 "<tr><td>" + x + "</td></tr>");
 409                         }
 410                 }
 411
 412
 413                 //Load properties_tab for a chosen String Match
 414                 function disperseConfig(stringMatchObj, id) {
 415                         //remove old gui forms
 416                         for (var i = 1; i < ($(".formId").length + 1); i++) {
 417                                 $("#go_properties_tab" + i).parent().remove();
 418                         }
 419                         $(".formId").remove();
 420
 421                         if (stringMatchObj !== undefined) {
 422                                 var el = stringMatchObj[id][4]['serviceConfigurations']
 423                                 for (var i = 0; i < el.length; i++) {
 424                                         loadingId = true;
 425                                         var num = add_one_more();
 426                                         loadingId = false;
 427                                         for (var j = 0; j < el[i].length; j++) {
 428                                                 if (el[i][j]["stringSet"] !== undefined) {
 429                                                         var ss = el[i][j]["stringSet"]
 430                                                         for (var o = 0; o < ss.length; o++) {
 431                                                                 if(ss[o].hasOwnProperty("name")){
 432                                                                         if(ss[o].name==="alarmCondition"){
 433                                                                                 alarm_conditions_temp=ss[o].value
 434                                                                         }else if(ss[o].name==="eventSeverity"){
 435                                                                                 event_severity_temp=ss[o].value;
 436                                                                         }else if(ss[o].name==="eventSourceType"){
 437                                                                                 event_type_source_temp=ss[o].value;
 438                                                                         }
 439                                                                         else
 440                                                                         $("#formId" + num + " #" + ss[o].name).val(ss[o].value);
 441                                                                 }
 442
 443                                                         }
 444                                                 }else if(el[i][j].hasOwnProperty("name") && el[i][j].name==="vfc"){
 445                                                         vfc_temp=el[i][j].value
 446                                                 }
 447                                                 else if (el[i][j].name === 'outputEventName' && el[i][j].value.toString() !== '') {
 448                                                         $("#go_properties_tab" + num).text(el[i][j].value);
 449                                                         $("#formId" + num + " #" + el[i][j].name).val(el[i][j].value);
 450                                                 }
 451                                                 else {
 452                                                         if(el[i][j].hasOwnProperty("name")){
 453                                                                 $("#formId" + num + " #" + el[i][j].name).val(
 454                                                                                 el[i][j].value);
 455                                                         }
 456                                                 }
 457                                         }
 458                                         set_vfc_alarm_event(num);
 459                                         vfc_temp="";
 460                                         alarm_conditions_temp="";
 461                                         event_severity_temp="";
 462                                         event_type_source_temp="";
 463                                 }
 464
 465                                 //Adding all the ids for parent String options
 466                                 for (var i = 1; i <= $(".formId").length; i++) {
 467                                         for (k in stringMatch_ids) {
 468                                                 if ($("#formId" + i + " #_id").val() !== stringMatch_ids[k].toString() && $(k + " #recipe").val() !== undefined && $(k + " #recipe").val() !== "") {
 469                                                         $("#formId" + i + " #parentStringMatch").append("<option value=\""+stringMatch_ids[k]+"\">"+ $(k + " #recipe").val()+ "</option>");
 470                                                 }
 471                                         }
 472                                 }
 473
 474                                 for (k in parent_stringMatch) {
 475                                         $("#formId" + k + " #parentStringMatch").val(parent_stringMatch[k]);
 476                                         // force the change event
 477                                         $("#formId" + k + " #parentStringMatch").change();
 478                                 }
 479
 480                                 if (stringMatchObj[id][0]) {
 481                                         $("#" + stringMatchObj[id][0].name).val(stringMatchObj[id][0].value);
 482                                 }
 483
 484                                 if (stringMatchObj[id][1]) {
 485                                         $("#" + stringMatchObj[id][1].name).val(stringMatchObj[id][1].value);
 486                                 }
 487
 488                                 if (stringMatchObj[id][2]) {
 489                                         $("#" + stringMatchObj[id][2].name).val(stringMatchObj[id][2].value);
 490                                 }
 491                         }
 492
 493                         setMultiSelect();
 494
 495                         if (readOnly||readMOnly){
 496                                 $('select[multiple] option').each(function() {
 497                           var input = $('input[value="' + $(this).val() + '"]');
 498                           input.prop('disabled', true);
 499                           input.parent('li').addClass('disabled');
 500                         });
 501                                 $('input[value="multiselect-all"]').prop('disabled', true).parent('li').addClass('disabled');
 502                         }
 503                 }
 504
 505
 506                 //This is ensure there are no repeated keys in the map
 507                 function noRepeats(form) {
 508                         //triggered per String.
 509                         var select = {};
 510                         for (var i = 0; i < form.length; i++) {
 511                                 if (select[form[i].name] === undefined)
 512                                         select[form[i].name] = []
 513                                 select[form[i].name].push(form[i].value);
 514                         }
 515                         var arr = []
 516                         for (s in select) {
 517                                 var f = {}
 518                                 f.name = s
 519                                 f.value = select[s]
 520                                 arr.push(f)
 521                         }
 522                         return arr
 523                 }
 524
 525                 $("#savePropsBtn").click(function(event) {
 526                         $(".idError").hide();
 527                         if ($("#stringMatchTable .highlight td").html() !== $("#rgfriendlyname").val()){
 528                                 //repeated name
 529                                 if ($.inArray($("#rgfriendlyname").val(), Object.keys(allSMatch)) > -1){
 530                                         $("#repeatIdError").show();
 531                                         return;
 532                                 } else { //not repeated
 533                                         delete allSMatch[$("#stringMatchTable .highlight td").html()];
 534                                 }
 535                         }
 536                         /* //Saves edits
 537                         if ($("#stringMatchTable .highlight").length > 0) {
 538                                 saveLastStringMatchLocally($("#stringMatchTable .highlight td").html());
 539                         } */
 540                         if ($("#rgfriendlyname").val().trim() == "New_Group"){
 541                                 $("#newIdError").show();
 542                                 return;
 543                         }
 544                         startNextItem();
 545                         //Removes outdated (deleted) resource Groups by checking against left menu
 546                         var finalSaveList = {};
 547                         $("#stringMatchTable td").each(function() {
 548                                 var tableVal = $(this).text();
 549                                 if (tableVal in allSMatch) {
 550                                         finalSaveList[tableVal] = allSMatch[tableVal];
 551                                 }
 552                         });
 553
 554                         saveProperties(finalSaveList);
 555                         $("#close_button").click();
 556                 })
 557
 558                 function add_one_more() {
 559                         $("#nav_Tabs li").removeClass("active");
 560
 561                         //FormSpan contains a block of the form that is not being displayed. We will create clones of that and add them to tabs
 562                         var form = $($("#formSpan").children()[0]).clone()
 563                         var count = 0;
 564                         //Each new tab will have the formId class attached to it. This way we can track how many forms we currently have out there and assign listeners to them
 565                         if ($(".formId").length > 0) {
 566                                 var greatest = 0;
 567                                 var s = $(".formId");
 568                                 for (var i = 0; i < s.length; i++) {
 569                                         if (parseInt($(s[i]).attr("id").substring(6)) > greatest) {
 570                                                 greatest = parseInt($(s[i]).attr("id").substring(6))
 571                                         }
 572                                 }
 573                                 count = greatest + 1;
 574                                 $("#properties_tab").append(
 575                                                 ('<span class="formId" id="formId'+count+'"></span>'));
 576                         } else {
 577                                 count++;
 578                                 $("#properties_tab").append(
 579                                                 '<span class="formId" id="formId1"></span>');
 580                         }
 581
 582                         //$(form).find("#stringMatchName").val("Recipe "+makid(2))
 583                         //TODO change up how we auto assign stringMatchName. There could be the case where we do this and it will have repeats
 584                         //alert($(form).find("#_id").val())
 585                         //stringMatchNameChangeListener(form)
 586
 587                         $("#add_one_more")
 588                                         .parent()
 589                                         .before(
 590                                                         ' <li class="active"><a id="go_properties_tab'+count+'">Condition</a><button id="tab_close'+count+'" type="button" class="close tab-close-popup" aria-hidden="true" style="margin-top: -30px;margin-right: 5px">&times;</button></li>');
 591                         $("#formId" + count).append(form);
 592                         $(".formId").not($("#formId" + count)).css("display", "none")
 593                         addCustListen(count)
 594                         addTabListen(count)
 595
 596                         // This is for when the process is not loading from map but being created
 597                         if (!loadingId) {
 598                                 var l = makeid()
 599                                 $(form).find("#_id").val(l)
 600                                 stringMatch_ids["#formId" + count] = l
 601                                 var answers = {}
 602
 603                                 for (k in answers) {
 604                                         $(k).val(answers[k])
 605                                 }
 606                         }
 607                         return count;
 608                 }
 609
 610                 function add_new_stringMatch(issueNewNames) {
 611                         //remove old gui forms
 612                         for (var i = 1; i < ($(".formId").length + 1); i++) {
 613                                 $("#go_properties_tab" + i).parent().remove();
 614                         }
 615                         $(".formId").remove();
 616
 617                         //Reset header
 618                         var ms = new Date().getTime();
 619                         var defSMatch = ms;
 620                         $("#rgname").val(defSMatch);
 621
 622                         $("#rgfriendlyname").val("New_Group");
 623
 624                         $("#add_one_more").click();
 625                         return defSMatch;
 626                 }
 627
 628                 //listener will change the tab name to the recipe
 629                 function addTabListen(count) {
 630                         $("#formId" + count + " #recipe").on("change",function() {
 631                                 if ($("#formId" + count + " #recipe").val().toString() !== "") {
 632                                         $('#go_properties_tab' + count).text($("#formId" + count + " #recipe").val())
 633                                 } else
 634                                         $('#go_properties_tab' + count).text("String");
 635
 636                                 var answers = {}
 637
 638                                 for (var i = 1; i <= greatestIdNum(); i++) {
 639                                         if ($("#formId" + i).length > 0) {
 640
 641                                                 answers["#formId" + i + " #parentStringMatch"] = $("#formId" + i + " #parentStringMatch").val()
 642                                                 $("#formId" + i + " #parentStringMatch").empty();
 643
 644                                                 for (k in stringMatch_ids) {
 645                                                         if ($("#formId" + i + " #_id").val().toString() !== stringMatch_ids[k] && $(k + " #recipe").val() !== 'undefined' && $(k + " #recipe").val() !== "") {
 646                                                                 $("#formId" + i + " #parentStringMatch").append("<option value='"+stringMatch_ids[k]+"''> "+ $(k+ " #recipe").val()+ "</option>")
 647                                                         }
 648                                                 }
 649                                                 $("#formId" + i + " #parentStringMatch").prepend("<option value=''></option>")
 650                                         }
 651                                 }
 652                                 for (k in answers) {
 653                                         $(k).val(answers[k])
 654                                 }
 655                         })
 656
 657                         // disable parentStringMatchConditions when a parentStringMatch is not selected
 658                         $("#formId" + count + " #parentStringMatch").on("change",function() {
 659                                 if ($("#formId" + count + " #parentStringMatch").val().toString() == "") {
 660                                         // deselect all options
 661                                         $("#formId"+ count+ " #parentStringMatchConditions option:selected").prop("selected", false);
 662                                         // disable the select box
 663                                         $("#formId"+ count+ " #parentStringMatchConditions").prop('disabled', 'disabled');
 664                                 } else {
 665                                         $("#formId"+ count+ " #parentStringMatchConditions").prop('disabled', false);
 666                                 }
 667                         })
 668                 }
 669
 670                 function addCustListen(count) {
 671                         $('#go_properties_tab' + count).click(function(event) {
 672                                 $("#nav_Tabs li").removeClass("active");
 673                                 $(this).parent().addClass("active");
 674                                 $("#formId" + count).css("display", "")
 675                                 $(".formId").not($("#formId" + count)).css("display", "none")
 676
 677                         })
 678                         $('#tab_close' + count).click(function(event) {
 679
 680                                 $(this).parent().remove();
 681                                 delete stringMatch_ids["#formId" + count + " #_id"]
 682                                 $("#formId" + count).remove();
 683                         })
 684                 }
 685
 686                 function setStringSet(form) {
 687                         var arr = []
 688                         var alarmCondition = {}
 689                         var eventSeverity = {}
 690                         var eventSourceType = {}
 691                         for (var i = 0; i < form.length; i++) {
 692                                 if (form[i].name === "alarmCondition") {
 693                                         alarmCondition = form[i]
 694                                 } else if (form[i].name === "eventSeverity") {
 695                                         eventSeverity = form[i];
 696                                 } else if (form[i].name === "eventSourceType") {
 697                                         eventSourceType = form[i];
 698                                 } else {
 699
 700                                         arr.push(form[i])
 701                                 }
 702
 703                         }
 704                         var stringSet = {};
 705                         stringSet['stringSet'] = []
 706                         stringSet['stringSet'].push(alarmCondition);
 707                         stringSet['stringSet'].push(eventSeverity);
 708                         stringSet['stringSet'].push(eventSourceType);
 709                         arr.push(stringSet)
 710
 711                         return arr;
 712                 }
 713
 714                 //this will populate alarmcondition,vfc,eventtypesource if they are saved in elementmap
 715                 function set_vfc_alarm_event (count){
 716                         if(vfc_temp!=="" && vfc_temp!==undefined){
 717                                 $("#formId"+count+" #vfc").val(vfc_temp)
 718
 719                                 if(alarm_conditions_temp!=="" && alarm_conditions_temp!==undefined){
 720                                         setAlarmConditions(vfc_temp,count)
 721                                         $("#formId"+count+" #alarmCondition").val(alarm_conditions_temp);
 722
 723                                         if(event_severity_temp!=="" && event_severity_temp!==undefined){
 724                                                 setEventSourceType(alarm_conditions_temp,count)
 725                                                 $("#formId"+count+" #eventSeverity").val(event_severity_temp)
 726                                                 if(event_type_source_temp!=="" && event_type_source_temp!==undefined){
 727                                                         $("#formId"+count+" #eventSourceType").val(event_type_source_temp)
 728                                                 }
 729                                         }
 730                                         if(event_type_source_temp!=="" && event_type_source_temp!==undefined){
 731                                                 setEventSourceType(alarm_conditions_temp,count)
 732                                                 $("#formId"+count+" #eventSourceType").val(event_type_source_temp)
 733                                                 if(event_severity_temp!=="" && event_severity_temp!==undefined){
 734                                                         $("#formId"+count+" #eventSeverity").val(event_severity_temp)
 735                                                 }
 736                                         }
 737                                 }
 738                         }
 739                 }
 740
 741                 function setAlarmConditions(vfcID, count){
 742                         var alarmCondition={}
 743
 744                         if($("#formId"+count+" #vfc").val()!==""){
 745                                 if(vf_Services['shared'] && vf_Services['shared']['byVfc'] && vf_Services['shared']['byVfc'][vfcID]){
 746                                         alarmCondition=vf_Services['shared']['byVfc'][vfcID]['alarmCondition']
 747                                 }
 748                         }
 749
 750                         $("#formId"+count+" #alarmCondition").empty();
 751                         $("#formId"+count+" #alarmCondition").append("<option value=\"\"></opton>");
 752                          if(alarmCondition && _.keys(alarmCondition).length>0){
 753                                 for(key in alarmCondition){
 754                                         var safestring = $('<div>').text(key).html();
 755                                         $("#formId"+count+" #alarmCondition").append("<option value='"+safestring+"'>"+alarmCondition[key]+"</opton>");
 756                                 }
 757                                 $("#formId"+count+" #alarmCondition").multiselect("rebuild");
 758                         }
 759                 }
 760
 761                 function setEventSourceType(alarm, count){
 762                         var eventSourceTypSeverity={}
 763                         if($("#formId"+count+" #alarmCondition").val()!==""){
 764                                 if(vf_Services && vf_Services['shared'] && vf_Services['shared']['byAlarmCondition'] && vf_Services['shared']['byAlarmCondition'][alarm]){
 765                                         eventSourceTypSeverity=vf_Services['shared']['byAlarmCondition'][alarm]
 766                                 }
 767
 768                         }
 769
 770                         $("#formId"+count+" #eventSourceType").val(eventSourceTypSeverity.eventSourceType);
 771                         $("#formId"+count+" #eventSeverity").val(eventSourceTypSeverity.eventSeverity);
 772                         $("#formId"+count+" #eventSeverity").multiselect("rebuild");
 773                 }
 774
 775                 function greatestIdNum() {
 776                         var greatest = 0;
 777                         var s = $(".formId");
 778                         for (var i = 0; i < s.length; i++) {
 779                                 if (parseInt($(s[i]).attr("id").substring(6)) > greatest) {
 780                                         greatest = parseInt($(s[i]).attr("id").substring(6))
 781                                 }
 782                         }
 783                         return greatest;
 784                 }
 785
 786                 //Generate random id for each String
 787                 //Also made sure ids couldnt be repeated
 788                 function makeid(num) {
 789
 790                         var text = "";
 791                         var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
 792                         if (num == null)
 793                                 num = 7;
 794                         for (var i = 0; i < 7; i++)
 795                                 text += possible.charAt(Math.floor(Math.random()
 796                                                 * possible.length));
 797                         var hasValue = false;
 798                         for (k in stringMatch_ids) {
 799                                 if (text === stringMatch_ids[k])
 800                                         hasValue = true
 801                         }
 802                         if (hasValue)
 803                                 return makeid(num);
 804                         else
 805                                 return text
 806                 }
 807
 808                 var ParentStringMatch = function(id, name) {
 809                         this.id = id
 810                         this.name = name
 811                 }
 812
 813                 //String table search filter
 814                 function searchStringMatchList() {
 815                         var search = document.getElementById("stringMatchSearch");
 816                         var row = document.getElementsByTagName("td");
 817                         for (var i = 0; i < row.length; i++) {
 818                                 if (row[i].innerHTML.toUpperCase().indexOf(
 819                                                 search.value.toUpperCase()) > -1) {
 820                                         row[i].style.display = "";
 821                                 } else {
 822                                         row[i].style.display = "none";
 823                                 }
 824                         }
 825                 }
 826
 827                 function saveLastStringMatchLocally(lastStringMatchId) {
 828                         var polForm = []
 829
 830                         var properties = $(".saveProps").not("#formSpan .saveProps")
 831
 832                         var topicPublish = $("#topicPublish").serializeArray();
 833
 834                         for (var i = 0; i < topicPublish.length; i++) {
 835                                 polForm.push(topicPublish[i]);
 836                         }
 837
 838                         //The below three lines are added to make sure resource group can be save correctly even if the policy is not present
 839                         if (topicPublish.length == 2){
 840                                 var pname = {name:"policyName", value:""};
 841                                 polForm.push(pname);
 842                                 var pid = {name:"policyId", value:""};
 843                                 polForm.push(pid);
 844                         }else{
 845                                 var selectedPName = topicPublish[2]["value"];
 846                                 var pid = {name:"policyId", value:allPolicies[selectedPName][1]["value"]};
 847                                 polForm.push(pid);
 848                         }
 849
 850                         var d = {}
 851                         d["serviceConfigurations"] = [];
 852                         for (var i = 0; i < properties.length; i++) {
 853                                 var ser = $(properties[i]).serializeArray();
 854                                 var s = noRepeats(ser)
 855                                 var newSer = setStringSet(s);
 856                                 d["serviceConfigurations"].push(newSer);
 857                         }
 858                         polForm.push(d);
 859                         allSMatch[lastStringMatchId] = polForm;
 860                 }
 861
 862                 $("#deleteStringMatch").on('click', function() {
 863                         $(".idError").hide();
 864                         var deleteId = $("#stringMatchTable .highlight td").html();
 865                         delete allSMatch.deleteId;
 866                         $("#stringMatchTable .highlight").remove();
 867                         $("#rgfriendlyname").val('');
 868                         expandTable();
 869                 });
 870
 871                 $('#stringMatchTable').on('click', 'tr', function(event) {
 872                         $(".idError").hide();
 873                         //edited name
 874                         if ($("#stringMatchTable .highlight td").html() !== $("#rgfriendlyname").val()){
 875                                 //repeated name
 876                                 if ($.inArray($("#rgfriendlyname").val(), Object.keys(allSMatch)) > -1){
 877                                         $("#repeatIdError").show();
 878                                         return;
 879                                 } else { //not repeated
 880                                         $("#repeatIdError").hide();
 881                                         delete allSMatch[$("#stringMatchTable .highlight td").html()];
 882                                 }
 883                         }
 884                         if ($("#rgfriendlyname").val().trim() == "New_Group"){
 885                                 $("#newIdError").show();
 886                                 return;
 887                         }
 888                         if (!(readOnly||readMOnly)){
 889                                 startNextItem();
 890                         } else {
 891                                 if ($("#stringMatchTable .highlight").length == 0){
 892                                         collapseTable();
 893                                 }
 894                         }
 895
 896                         $(this).addClass('highlight').siblings().removeClass('highlight');
 897                         disperseConfig(allSMatch, $(this).find("td").html());
 898                 });
 899
 900
 901                 $('#createNewStringMatch').on('click',  function() {
 902                         $(".idError").hide();
 903                         //edited name
 904                         if ($("#stringMatchTable .highlight td").html() !== $("#rgfriendlyname").val()){
 905                                 //repeated name
 906                                 if ($.inArray($("#rgfriendlyname").val(), Object.keys(allSMatch)) > -1){
 907                                         $("#repeatIdError").show();
 908                                         return;
 909                                 } else { //not repeated
 910                                         $("#repeatIdError").hide();
 911                                         delete allSMatch[$("#stringMatchTable .highlight td").html()];
 912                                 }
 913                         }
 914                         if ($("#rgfriendlyname").val().trim() == "New_Group"){
 915                                 $("#newIdError").show();
 916                                 return;
 917                         }
 918                         startNextItem();
 919                         var defSMatch = add_new_stringMatch();
 920
 921                         if (("#stringMatchTable .highlight").length > 0) {
 922                                 $('#stringMatchTable tr.highlight').removeClass('highlight');
 923                         }
 924                         //$("#stringMatchTable").prepend("<tr class='highlight' id='" +defSMatch+ "''><td>"+ defSMatch + "</td></tr>");
 925                         $("#stringMatchTable").prepend("<tr class='highlight'><td>New_Group</td></tr>");
 926
 927                 });
 928
 929                 function isNumberKey(event){
 930                         var charCode = (event.which) ? event.which : event.keyCode
 931                         if (charCode > 31 && (charCode < 48 || charCode > 57)){
 932                                 return false;
 933                         }
 934                         return true;
 935                 };
 936
 937                 function startNextItem() {
 938                         //save last item before transitioning
 939                         var lastItem = $("#stringMatchTable .highlight");
 940
 941
 942                         if (lastItem.length > 0) {
 943                                 saveLastStringMatchLocally($("#rgfriendlyname").val());
 944                                 //lastItem.attr("id", $("#rgfriendlyname").val());
 945                                 if($("#rgfriendlyname").val() != ''){
 946                                         lastItem.find("td").html($("#rgfriendlyname").val());
 947                                 }
 948                         } else {
 949                                 collapseTable();
 950                         }
 951
 952                         //allow deleting
 953                         if ($("#deleteStringMatch").prop("disabled")) {
 954                                 $("#deleteStringMatch").prop("disabled", false);
 955                         }
 956                 }
 957
 958                 //Show table panel only
 959                 function expandTable() {
 960                         $(".stringMatchPanel").css("display", "none");
 961                         $(".leftStringMatchPanel").removeClass("col-sm-3");
 962                         $(".modelSearchBox").css("padding", "25px 12px");
 963                         if (!($("#deleteStringMatch").prop("disabled"))) {
 964                                 $("#deleteStringMatch").prop("disabled", true);
 965                         }
 966                 }
 967
 968                 //Show both menus
 969                 function collapseTable() {
 970                         $(".leftStringMatchPanel").addClass("col-sm-3");
 971                         $(".glyphicon-search").css("padding", "10px 12px");
 972                         $(".stringMatchPanel").css("display", "unset");
 973                 }
 974         </script>
 975 </div>