Merge pull request #1125 from spadgett/limit-units

Merged by openshift-bot

Author: OpenShift Bot

app/scripts/directives/editRequestLimit.js

@@ -25,6 +25,7 @@ angular.module('openshiftConsole')
 
         // Create a unique ID for `label for` and `aria-describedby` attributes.
         scope.id = _.uniqueId('compute-resource-');
+        scope.input = {};
 
         // If unit is not already in options, add it.
         var addUnitOption = function(unit) {
@@ -43,8 +44,8 @@ angular.module('openshiftConsole')
             scope.placeholder = defaultAmount;
             addUnitOption(defaultUnit);
             // Only change selected unit if no value is set.
-            if (!scope.amount) {
-              scope.unit = defaultUnit;
+            if (!scope.input.amount) {
+              scope.input.unit = defaultUnit;
             }
           });
           if (defaultValue) {
@@ -55,7 +56,7 @@ angular.module('openshiftConsole')
         // Set unit options and based on type.
         switch (scope.type) {
         case 'cpu':
-          scope.unit = 'm';
+          scope.input.unit = 'm';
           scope.units = [{
             value: "m",
             label: "millicores"
@@ -65,7 +66,7 @@ angular.module('openshiftConsole')
           }];
           break;
         case 'memory':
-          scope.unit = 'Mi';
+          scope.input.unit = 'Mi';
           scope.units = [{
             value: "M",
             label: "MB"
@@ -84,7 +85,7 @@ angular.module('openshiftConsole')
 
         var validateLimitRange = function() {
           // Use usageValue filter to normalize units for comparison.
-          var value = scope.amount && usageValue(scope.amount + scope.unit),
+          var value = scope.input.amount && usageValue(scope.input.amount + scope.input.unit),
               min = scope.limitRangeMin && usageValue(scope.limitRangeMin),
               max = scope.limitRangeMax && usageValue(scope.limitRangeMax),
               minValid = true,
@@ -112,8 +113,8 @@ angular.module('openshiftConsole')
               limitWithinRatio = true;
 
           // Limit is either the value set by the user or the default value if limit is unset.
-          if (scope.amount) {
-            limit = usageValue(scope.amount + scope.unit);
+          if (scope.input.amount) {
+            limit = usageValue(scope.input.amount + scope.input.unit);
           } else if (scope.defaultValue) {
             limit = usageValue(scope.defaultValue);
           }
@@ -140,25 +141,25 @@ angular.module('openshiftConsole')
         ngModel.$render = function() {
           var update = _.spread(function(amount, unit) {
             if (amount) {
-              scope.amount = Number(amount);
-              scope.unit = unit;
+              scope.input.amount = Number(amount);
+              scope.input.unit = unit;
               // If the unit already set in the resource isn't in the list, add it.
               addUnitOption(unit);
             } else {
-              scope.amount = null;
+              scope.input.amount = null;
             }
           });
           update(amountAndUnit(ngModel.$viewValue, scope.type));
         };
 
         // Update model from view.
-        scope.$watchGroup(['amount', 'unit'], function() {
+        scope.$watchGroup(['input.amount', 'input.unit'], function() {
           validateLimitRange();
           validateLimitAgainstRequest();
-          if (!scope.amount) {
+          if (!scope.input.amount) {
             ngModel.$setViewValue(undefined);
           } else {
-            ngModel.$setViewValue(scope.amount + scope.unit);
+            ngModel.$setViewValue(scope.input.amount + scope.input.unit);
           }
         });
 

app/views/_compute-resource.html

@@ -7,15 +7,15 @@
         <input type="number"
                name="amount"
                ng-attr-id="{{id}}"
-               ng-model="amount"
+               ng-model="input.amount"
                min="0"
                ng-attr-placeholder="{{placeholder}}"
                class="form-control"
                ng-attr-aria-describedby="{{description ? id + '-help' : undefined}}">
       </div>
       <div class="resource-unit">
         <label class="sr-only" ng-attr-for="{{id}}-unit">Unit</label>
-        <ui-select search-enabled="false" ng-model="unit" input-id="{{id}}-unit">
+        <ui-select search-enabled="false" ng-model="input.unit" input-id="{{id}}-unit">
           <ui-select-match>{{$select.selected.label}}</ui-select-match>
           <ui-select-choices repeat="option.value as option in units">
             {{option.label}}
@@ -43,14 +43,14 @@
         Limit can't be less than request ({{request | usageWithUnits : type}}).
       </div>
       <div ng-if="form.amount.$error.limitWithinRatio" class="help-block">
-        <span ng-if="!amount && !defaultValue">
+        <span ng-if="!input.amount && !defaultValue">
           Limit is required if request is set. (Max Limit/Request Ratio: {{maxLimitRequestRatio}})
         </span>
-        <span ng-if="amount || defaultValue">
+        <span ng-if="input.amount || defaultValue">
           Limit cannot be more than {{maxLimitRequestRatio}} times request value.
           (Request: {{request | usageWithUnits : type}},
           <!-- Show default if amount is unset. -->
-          Limit: {{(amount ? (amount + unit) : defaultValue) | usageWithUnits : type}})
+          Limit: {{(input.amount ? (input.amount + input.unit) : defaultValue) | usageWithUnits : type}})
         </span>
       </div>
     </div>

dist/scripts/scripts.js

@@ -12390,7 +12390,7 @@ request:"="
 templateUrl:"views/_compute-resource.html",
 link:function(b, c, d, e) {
 var f = a("usageValue"), g = a("amountAndUnit"), h = a("humanizeUnit");
-b.id = _.uniqueId("compute-resource-");
+b.id = _.uniqueId("compute-resource-"), b.input = {};
 var i = function(a) {
 _.some(b.units, {
 value:a
@@ -12401,12 +12401,12 @@ label:h(a, b.type)
 };
 switch (b.$watch("defaultValue", function(a) {
 var c = _.spread(function(a, c) {
-b.placeholder = a, i(c), b.amount || (b.unit = c);
+b.placeholder = a, i(c), b.input.amount || (b.input.unit = c);
 });
 a && c(g(a, b.type));
 }), b.type) {
 case "cpu":
-b.unit = "m", b.units = [ {
+b.input.unit = "m", b.units = [ {
 value:"m",
 label:"millicores"
 }, {
@@ -12416,7 +12416,7 @@ label:"cores"
 break;
 
 case "memory":
-b.unit = "Mi", b.units = [ {
+b.input.unit = "Mi", b.units = [ {
 value:"M",
 label:"MB"
 }, {
@@ -12431,19 +12431,19 @@ label:"GiB"
 } ];
 }
 var j = function() {
-var a = b.amount && f(b.amount + b.unit), c = b.limitRangeMin && f(b.limitRangeMin), d = b.limitRangeMax && f(b.limitRangeMax), e = !0, g = !0;
+var a = b.input.amount && f(b.input.amount + b.input.unit), c = b.limitRangeMin && f(b.limitRangeMin), d = b.limitRangeMax && f(b.limitRangeMax), e = !0, g = !0;
 a && c && (e = a >= c), a && d && (g = a <= d), b.form.amount.$setValidity("limitRangeMin", e), b.form.amount.$setValidity("limitRangeMax", g);
 }, k = function() {
 var a, c = b.request && f(b.request), d = !0, e = !0;
-b.amount ? a = f(b.amount + b.unit) :b.defaultValue && (a = f(b.defaultValue)), c && a && (d = a >= c, b.maxLimitRequestRatio && (e = a / c <= b.maxLimitRequestRatio)), c && !a && b.maxLimitRequestRatio && (e = !1), b.form.amount.$setValidity("limitLargerThanRequest", d), b.form.amount.$setValidity("limitWithinRatio", e);
+b.input.amount ? a = f(b.input.amount + b.input.unit) :b.defaultValue && (a = f(b.defaultValue)), c && a && (d = a >= c, b.maxLimitRequestRatio && (e = a / c <= b.maxLimitRequestRatio)), c && !a && b.maxLimitRequestRatio && (e = !1), b.form.amount.$setValidity("limitLargerThanRequest", d), b.form.amount.$setValidity("limitWithinRatio", e);
 };
 e.$render = function() {
 var a = _.spread(function(a, c) {
-a ? (b.amount = Number(a), b.unit = c, i(c)) :b.amount = null;
+a ? (b.input.amount = Number(a), b.input.unit = c, i(c)) :b.input.amount = null;
 });
 a(g(e.$viewValue, b.type));
-}, b.$watchGroup([ "amount", "unit" ], function() {
-j(), k(), b.amount ? e.$setViewValue(b.amount + b.unit) :e.$setViewValue(void 0);
+}, b.$watchGroup([ "input.amount", "input.unit" ], function() {
+j(), k(), b.input.amount ? e.$setViewValue(b.input.amount + b.input.unit) :e.$setViewValue(void 0);
 }), b.$watchGroup([ "limitRangeMin", "limitRangeMax" ], j), b.$watch("request", k);
 }
 };

dist/scripts/templates.js

@@ -75,11 +75,11 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "<div class=\"resource-size\" ng-class=\"{ 'has-error': form.$invalid }\">\n" +
     "<div class=\"resource-amount\">\n" +
     "<label class=\"sr-only\" ng-attr-for=\"{{id}}\">Amount</label>\n" +
-    "<input type=\"number\" name=\"amount\" ng-attr-id=\"{{id}}\" ng-model=\"amount\" min=\"0\" ng-attr-placeholder=\"{{placeholder}}\" class=\"form-control\" ng-attr-aria-describedby=\"{{description ? id + '-help' : undefined}}\">\n" +
+    "<input type=\"number\" name=\"amount\" ng-attr-id=\"{{id}}\" ng-model=\"input.amount\" min=\"0\" ng-attr-placeholder=\"{{placeholder}}\" class=\"form-control\" ng-attr-aria-describedby=\"{{description ? id + '-help' : undefined}}\">\n" +
     "</div>\n" +
     "<div class=\"resource-unit\">\n" +
     "<label class=\"sr-only\" ng-attr-for=\"{{id}}-unit\">Unit</label>\n" +
-    "<ui-select search-enabled=\"false\" ng-model=\"unit\" input-id=\"{{id}}-unit\">\n" +
+    "<ui-select search-enabled=\"false\" ng-model=\"input.unit\" input-id=\"{{id}}-unit\">\n" +
     "<ui-select-match>{{$select.selected.label}}</ui-select-match>\n" +
     "<ui-select-choices repeat=\"option.value as option in units\">\n" +
     "{{option.label}}\n" +
@@ -107,13 +107,13 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
     "Limit can't be less than request ({{request | usageWithUnits : type}}).\n" +
     "</div>\n" +
     "<div ng-if=\"form.amount.$error.limitWithinRatio\" class=\"help-block\">\n" +
-    "<span ng-if=\"!amount && !defaultValue\">\n" +
+    "<span ng-if=\"!input.amount && !defaultValue\">\n" +
     "Limit is required if request is set. (Max Limit/Request Ratio: {{maxLimitRequestRatio}})\n" +
     "</span>\n" +
-    "<span ng-if=\"amount || defaultValue\">\n" +
+    "<span ng-if=\"input.amount || defaultValue\">\n" +
     "Limit cannot be more than {{maxLimitRequestRatio}} times request value. (Request: {{request | usageWithUnits : type}},\n" +
     "\n" +
-    "Limit: {{(amount ? (amount + unit) : defaultValue) | usageWithUnits : type}})\n" +
+    "Limit: {{(input.amount ? (input.amount + input.unit) : defaultValue) | usageWithUnits : type}})\n" +
     "</span>\n" +
     "</div>\n" +
     "</div>\n" +