Fix issues in Operational Policy UI

Add prefix for Guard Policy Id; display attributes correctly when guard
type is FrequencyLimiter; initialize guard policy type accordingly; add
default value for guard active start/end attributes;

Issue-ID: CLAMP-386, CLAMP-387
Change-Id: I4c57ddcfccba207429fb1e75d9d2a4d6b0f15e8a
Signed-off-by: xg353y <xg353y@intl.att.com>

diff --git a/src/main/resources/META-INF/resources/designer/partials/portfolios/operational_policy_window.html b/src/main/resources/META-INF/resources/designer/partials/portfolios/operational_policy_window.html
index fc6cc4d..3e95866 100644 (file)
--- a/src/main/resources/META-INF/resources/designer/partials/portfolios/operational_policy_window.html
+++ b/src/main/resources/META-INF/resources/designer/partials/portfolios/operational_policy_window.html
@@ -58,6 +58,16 @@ label {
        margin-bottom: 0px;
 }
 
+.withnote {
+       margin-bottom: 0px;
+}
+
+.note {
+       font-size:10px;
+       margin-left: 250px;
+       font-weight: normal;
+}
+
 #policyTable {
        cursor: pointer;
        width: 100%;
@@ -365,7 +375,7 @@ label {
                                                <label for="guardPolicyType" class="col-sm-4 control-label">
                                                        Guard Policy Type</label> <select class="form-control"
                                                        name="guardPolicyType" id="guardPolicyType"
-                                                       ng-change="changeGuardPolicyType()" ng-model="guardType">
+                                                       ng-click="changeGuardPolicyType()" ng-model="guardType">
                                                        <option value="GUARD_MIN_MAX">MinMax</option>
                                                        <option value="GUARD_YAML">FrequencyLimiter</option>
                                                </select>
@@ -374,12 +384,15 @@ label {
                                <form class="guardProperties" class="form-horizontal"
                                        title="Guard policy associated" style="border: 2px dotted gray;">
 
-                                       <div class="form-group clearfix">
+                                       <div class="form-group clearfix withnote">
                                                <label class="col-sm-4 control-label" for="id">Guard Policy ID</label>
                                                <div class="col-sm-8">
-                                                       <input type="text" class="form-control" name="id" id="id" />
+                                                       <input type="text" class="form-control" name="id" id="id" ng-blur="changeGuardId()" ng-model="id"/>
                                                </div>
                                        </div>
+                                       <div>
+                                               <label class="form-group note">Note: Prefix will be added to Guard Policy ID automatically based on Guard Policy Type</label>
+                                       </div>
                                        <div class="form-group clearfix">
                                                <label class="col-sm-4 control-label" for="recipe">Recipe</label>
                                                <div class="col-sm-8">
@@ -428,6 +441,7 @@ label {
                                                <div class="col-sm-8">
                                                        <input class="form-control" name="limit" id="limit" />
                                                </div>
+                                               <label for="timeUnits" class="col-sm-4 control-label">Time Units</label>
                                                <div class="col-sm-8">
                                                        <select class="form-control" name="timeUnits"
                                                                id="timeUnits">
@@ -438,13 +452,11 @@ label {
                                                                <option value="week">week</option>
                                                                <option value="month">month</option>
                                                                <option value="year">year</option>
-
-                                                       </select> <label for="timeWindow" class="col-sm-4 control-label">Time
-                                                               Window</label>
+                                                       </select> 
                                                </div>
+                                               <label for="timeWindow" class="col-sm-4 control-label">Time     Window</label>
                                                <div class="col-sm-8">
-                                                       <input class="form-control" name="timeWindow"
-                                                               id="timeWindow" />
+                                                       <input class="form-control" name="timeWindow" id="timeWindow" />
                                                </div>
                                        </div>
                                        <div class="form-group clearfix">
@@ -452,13 +464,13 @@ label {
                                                        Guard Active Start</label>
                                                <div class="col-sm-8">
                                                        <input class="form-control" name="guardActiveStart"
-                                                               id="guardActiveStart" />
+                                                               id="guardActiveStart"  value="00:00:00Z"/>
                                                </div>
                                                <label for="guardActiveEnd" class="col-sm-4 control-label">
                                                        Guard Active End</label>
                                                <div class="col-sm-8">
                                                        <input class="form-control" name="guardActiveEnd"
-                                                               id="guardActiveEnd" />
+                                                               id="guardActiveEnd" value="00:00:01Z"/>
                                                </div>
                                        </div>
 

diff --git a/src/main/resources/META-INF/resources/designer/scripts/OperationalPolicyCtrl.js b/src/main/resources/META-INF/resources/designer/scripts/OperationalPolicyCtrl.js
index f474cf4..95fc420 100644 (file)
--- a/src/main/resources/META-INF/resources/designer/scripts/OperationalPolicyCtrl.js
+++ b/src/main/resources/META-INF/resources/designer/scripts/OperationalPolicyCtrl.js
@@ -214,12 +214,24 @@ app
                                                    $("#formId" + formNum + " .guardProperties").find("#" + guardPropElemValue.id).val(
                                                    guardElemValue[guardPropElemValue.id]);
                                            });
+                                           iniGuardPolicyType(guardElemId, formNum);
                                            // And finally enable the flag
                                            $("#formId" + formNum + " #enableGuardPolicy").prop("checked", true);
                                    }
                            });
                    });
            }
+           function iniGuardPolicyType (guardPolicyId, formNum) {
+                   if(guardPolicyId.indexOf('guard.minmax.') !== -1) {
+                               $("#formId" + formNum + " #minMaxGuardPolicyDiv").show();
+                               $("#formId" + formNum + " #frequencyLimiterGuardPolicyDiv").hide();
+                               $("#formId" + formNum + " #guardPolicyType").val("GUARD_MIN_MAX");
+                   } else if (guardPolicyId.indexOf('guard.frequency.') !== -1) {
+                       $("#formId" + formNum + " #minMaxGuardPolicyDiv").hide();
+                           $("#formId" + formNum + " #frequencyLimiterGuardPolicyDiv").show();
+                           $("#formId" + formNum + " #guardPolicyType").val("GUARD_YAML");
+                   }
+           }
            function initTargetResourceIdOptions (targetType, formNum) {
                    var recipe = $("#formId" + formNum + "#recipe").val();
                    $("#formId" + formNum + " #resourceId").empty();
@@ -263,6 +275,30 @@ app
                    initTargetResourceIdOptions(type, formNum);
            }
 
+           $scope.changeGuardId = function(formItemActive) {
+                   if (formItemActive === undefined) {
+                           formItemActive = searchActiveFormId();
+                           if (formItemActive === undefined) {
+                               return;
+                           }
+                   }
+                   var oldValue = $("#" + formItemActive.id + " .guardProperties #id").val();
+                   // remove old prefix
+                   if(oldValue.indexOf('guard.minmax.') !== -1) {
+                       oldValue = oldValue.substr(oldValue.indexOf('guard.minmax.') + 13);
+                   } else if (oldValue.indexOf('guard.frequency.') !== -1) {
+                       oldValue = oldValue.substr(oldValue.indexOf('guard.frequency.') + 16);
+                   }
+
+                   var prefix = "guard.";
+                   if ($("#" + formItemActive.id + " #guardPolicyType").val() === "GUARD_MIN_MAX") {
+                       prefix = prefix + "minmax.";
+                   } else if ($("#" + formItemActive.id + " #guardPolicyType").val() === "GUARD_YAML") {
+                       prefix = prefix + "frequency.";
+                   }
+                   $("#" + formItemActive.id + " .guardProperties #id").val(prefix+oldValue);
+           }
+
            $scope.changeTargetResourceId = function(event) {
                    var formNum = $(event.target).closest('.formId').attr('id').substring(6);
                    initTargetModelAttributes(formNum);
@@ -298,6 +334,7 @@ app
                            $("#" + formItemActive.id + " #minMaxGuardPolicyDiv").hide();
                            $("#" + formItemActive.id + " #frequencyLimiterGuardPolicyDiv").show();
                    }
+                   $scope.changeGuardId(formItemActive);
            }
            $scope.initPolicySelect = function() {