Let users pause rollouts when editing deployment configs

app/index.html

@@ -355,6 +355,7 @@ <h1>JavaScript Required</h1>
         <script src="scripts/directives/selector.js"></script>
         <script src="scripts/directives/selectContainers.js"></script>
         <script src="scripts/directives/buildHooks.js"></script>
+        <script src="scripts/directives/pauseRolloutsCheckbox.js"></script>
         <script src="scripts/filters/date.js"></script>
         <script src="scripts/filters/resources.js"></script>
         <script src="scripts/filters/canI.js"></script>

app/scripts/controllers/edit/healthChecks.js

@@ -81,16 +81,16 @@ angular.module('openshiftConsole')
 
         DataService.get(resourceGroupVersion, $scope.name, context).then(
           function(result) {
-            // Modify a copy of the resource.
-            var resource = angular.copy(result);
+            // Modify a copy of the object.
+            var object = $scope.object = angular.copy(result);
             $scope.breadcrumbs = BreadcrumbsService.getBreadcrumbs({
-              object: resource,
+              object: object,
               project: project,
               subpage: 'Edit Health Checks',
               includeProject: true
             });
 
-            $scope.containers = _.get(resource, 'spec.template.spec.containers');
+            $scope.containers = _.get(object, 'spec.template.spec.containers');
 
             $scope.addProbe = function(container, probe) {
               // Restore the previous values if set.
@@ -109,7 +109,7 @@ angular.module('openshiftConsole')
               $scope.disableInputs = true;
               DataService.update(APIService.kindToResource($routeParams.kind),
                                  $scope.name,
-                                 resource,
+                                 object,
                                  context).then(
                 function() {
                   AlertMessageService.addAlert({

app/scripts/controllers/setLimits.js

@@ -89,18 +89,18 @@ angular.module('openshiftConsole')
 
         DataService.get(resourceGroupVersion, $scope.name, context).then(
           function(result) {
-            var resource = angular.copy(result);
+            var object = $scope.object = angular.copy(result);
             $scope.breadcrumbs = BreadcrumbsService.getBreadcrumbs({
-              object: resource,
+              object: object,
               project: project,
               subpage: 'Edit Resource Limits',
               includeProject: true
             });
-            $scope.resourceURL = Navigate.resourceURL(resource);
-            $scope.containers = _.get(resource, 'spec.template.spec.containers');
+            $scope.resourceURL = Navigate.resourceURL(object);
+            $scope.containers = _.get(object, 'spec.template.spec.containers');
             $scope.save = function() {
               $scope.disableInputs = true;
-              DataService.update(resourceGroupVersion, $scope.name, resource, context).then(
+              DataService.update(resourceGroupVersion, $scope.name, object, context).then(
                 function() {
                   AlertMessageService.addAlert({
                     name: $scope.name,

app/scripts/directives/pauseRolloutsCheckbox.js

@@ -0,0 +1,32 @@
+"use strict";
+
+angular.module('openshiftConsole')
+  .directive('pauseRolloutsCheckbox', function(APIService) {
+    return {
+      restrict: 'E',
+      scope: {
+        // Deployment config or k8s deployment API object.
+        deployment: '=',
+        disabled: '=ngDisabled',
+        // Show the checkbox even if the deployment config doesn't have a
+        // config change trigger.
+        alwaysVisible: '='
+      },
+      templateUrl: 'views/directives/pause-rollouts-checkbox.html',
+      link: function($scope) {
+        var isDeploymentConfig = function() {
+          if (!$scope.deployment) {
+            return false;
+          }
+          var rgv = APIService.objectToResourceGroupVersion($scope.deployment);
+          return rgv.resource === 'deploymentconfigs' && !rgv.group;
+        };
+
+        $scope.$watch('deployment.spec.triggers', function(triggers) {
+          // Hide the checkbox if there's no config change trigger.
+          $scope.missingConfigChangeTrigger =
+            isDeploymentConfig() && !_.some(triggers, { type: 'ConfigChange' });
+        }, true);
+      }
+    };
+  });

app/scripts/filters/resources.js

@@ -1460,4 +1460,23 @@ angular.module('openshiftConsole')
 
       return mount.readOnly ? 'read-only' : 'read-write';
     };
+  })
+  .filter('managesRollouts', function(APIService) {
+    // Return true for API objects that manage rollouts (deployment configs and deployments).
+    return function(object) {
+      if (!object) {
+        return false;
+      }
+
+      var rgv = APIService.objectToResourceGroupVersion(object);
+      if (rgv.resource === 'deploymentconfigs' && !rgv.group) {
+        return true;
+      }
+
+      if (rgv.resource === 'deployments' && rgv.group === 'extensions') {
+        return true;
+      }
+
+      return false;
+    };
   });

app/styles/_forms.less

@@ -79,3 +79,10 @@
   // Use the same spacing as `help-block` so the textarea is evenly spaced under the help text.
   margin: 5px 0;
 }
+
+.health-checks-form .pause-rollouts-checkbox,
+.set-limits-form .pause-rollouts-checkbox {
+  // Add extra margin on some forms so it's clear the checkbox is not part of
+  // the sections just above.
+  margin-top: @line-height-computed;
+}

app/views/attach-pvc.html

@@ -211,6 +211,11 @@ <h3>Volume</h3>
                         </div>
                       </div>
 
+                      <pause-rollouts-checkbox
+                          ng-if="attach.resource | managesRollouts"
+                          deployment="attach.resource">
+                      </pause-rollouts-checkbox>
+
                       <div class="button-group gutter-top gutter-bottom">
                         <button type="submit"
                             class="btn btn-primary btn-lg"

app/views/browse/deployment-config.html

@@ -41,10 +41,10 @@ <h1 class="contains-actions">
                     </li>
                     <li class="divider" ng-if="'deploymentconfigs' | canI : 'update'"></li>
                     <li ng-if="!deploymentConfig.spec.paused && !updatingPausedState && ('deploymentconfigs' | canI : 'update')">
-                      <a href="" ng-click="setPaused(true)" role="button">Pause Deployment</a>
+                      <a href="" ng-click="setPaused(true)" role="button">Pause Rollouts</a>
                     </li>
                     <li ng-if="deploymentConfig.spec.paused && !updatingPausedState && ('deploymentconfigs' | canI : 'update')">
-                      <a href="" ng-click="setPaused(false)" role="button">Resume Deployment</a>
+                      <a href="" ng-click="setPaused(false)" role="button">Resume Rollouts</a>
                     </li>
                     <li ng-if="'deploymentconfigs' | canI : 'update'">
                       <a ng-href="project/{{project.metadata.name}}/attach-pvc?kind=DeploymentConfig&name={{deploymentConfig.metadata.name}}"
@@ -98,10 +98,9 @@ <h1 class="contains-actions">
                 <div ng-if="deploymentConfig.spec.paused" class="alert alert-info animate-if">
                   <span class="pficon pficon-info" aria-hidden="true"></span>
                   <strong>{{deploymentConfig.metadata.name}} is paused.</strong>
-                  This will stop any new deployments and deployment triggers from running
-                  until resumed.
-                  <span ng-if="!updatingPausedState && ('deploymentconfigs' | canI : 'update')">
-                    <a href="" ng-click="setPaused(false)" role="button">Resume deployment</a>
+                  This will stop any new rollouts or triggers from running until resumed.
+                  <span ng-if="!updatingPausedState && ('deploymentconfigs' | canI : 'update')" class="nowrap">
+                    <a href="" ng-click="setPaused(false)" role="button">Resume Rollouts</a>
                   </span>
                 </div>
                 <uib-tabset>

app/views/browse/deployment.html

@@ -20,10 +20,10 @@ <h1 class="contains-actions">
                    data-toggle="dropdown"><i class="fa fa-ellipsis-v"></i><span class="sr-only">Actions</span></a>
                 <ul class="dropdown-menu actions action-button">
                   <li ng-if="!deployment.spec.paused && !updatingPausedState && ({ group: 'extensions', resource: 'deployments' } | canI : 'update')">
-                    <a href="" ng-click="setPaused(true)" role="button">Pause Deployment</a>
+                    <a href="" ng-click="setPaused(true)" role="button">Pause Rollouts</a>
                   </li>
                   <li ng-if="deployment.spec.paused && !updatingPausedState && ({ group: 'extensions', resource: 'deployments' } | canI : 'update')">
-                    <a href="" ng-click="setPaused(false)" role="button">Resume Deployment</a>
+                    <a href="" ng-click="setPaused(false)" role="button">Resume Rollouts</a>
                   </li>
                   <li class="divider" ng-if="!updatingPausedState && ({ group: 'extensions', resource: 'deployments' } | canI : 'update')"></li>
                   <li ng-if="{ group: 'extensions', resource: 'deployments' } | canI : 'update'">
@@ -78,10 +78,10 @@ <h1 class="contains-actions">
               <div ng-if="deployment.spec.paused" class="alert alert-info animate-if">
                 <span class="pficon pficon-info" aria-hidden="true"></span>
                 <strong>{{deployment.metadata.name}} is paused.</strong>
-                This will pause any in-progress rollouts and stop new
+                This pauses any in-progress rollouts and stops new
                 rollouts from running until the deployment is resumed.
-                <span ng-if="!updatingPausedState && ({ group: 'extensions', resource: 'deployments' } | canI : 'update')">
-                  <a href="" ng-click="setPaused(false)" role="button">Resume deployment</a>
+                <span ng-if="!updatingPausedState && ({ group: 'extensions', resource: 'deployments' } | canI : 'update')" class="nowrap">
+                  <a href="" ng-click="setPaused(false)" role="button">Resume Rollouts</a>
                 </span>
               </div>
               <uib-tabset>

app/views/directives/pause-rollouts-checkbox.html

@@ -0,0 +1,17 @@
+<div ng-if="alwaysVisible || !missingConfigChangeTrigger" class="form-group pause-rollouts-checkbox">
+  <div class="checkbox">
+    <label>
+      <input
+          type="checkbox"
+          ng-disabled="disabled"
+          ng-model="deployment.spec.paused"
+          aria-describedby="pause-help">
+      Pause rollouts for this {{deployment.kind | humanizeKind}}
+    </label>
+    <div id="pause-help" class="help-block">
+      Pausing lets you make changes without triggering a rollout. You can resume rollouts at any
+      time.
+      <span ng-if="!alwaysVisible">If unchecked, a new rollout will start on save.</span>
+    </div>
+  </div>
+</div>

app/views/edit/deployment-config.html

@@ -356,6 +356,11 @@ <h4>Container {{containerName}}</h4>
                         </div>
                       </div>
 
+                      <pause-rollouts-checkbox
+                          deployment="updatedDeploymentConfig"
+                          always-visible="true">
+                      </pause-rollouts-checkbox>
+
                       <div class="buttons gutter-top-bottom">
                         <button type="submit" class="btn btn-primary btn-lg" ng-disabled="form.$invalid || form.$pristine || disableInputs">
                           Save

app/views/edit/health-checks.html

@@ -14,7 +14,7 @@
               <div class="col-md-12">
                 <alerts alerts="alerts"></alerts>
                 <div ng-show="!containers.length" class="mar-top-md">Loading...</div>
-                <form ng-show="containers.length" name="form">
+                <form ng-show="containers.length" name="form" class="health-checks-form">
                   <h1>Health Checks: {{name}}</h1>
                   <div class="help-block">
                     Container health is periodically checked using readiness and liveness probes.
@@ -62,6 +62,12 @@ <h3>Liveness Probe</h3>
                         </p>
                       </div>
                     </div>
+
+                    <pause-rollouts-checkbox
+                        ng-if="object | managesRollouts"
+                        deployment="object">
+                    </pause-rollouts-checkbox>
+
                     <div class="button-group gutter-top gutter-bottom">
                       <button type="submit"
                         class="btn btn-primary btn-lg"

app/views/set-limits.html

@@ -14,7 +14,7 @@
               <div class="col-md-12">
                 <alerts alerts="alerts"></alerts>
                 <div ng-show="!containers.length">Loading...</div>
-                <form ng-if="containers.length" name="form">
+                <form ng-if="containers.length" name="form" class="set-limits-form">
                   <h1>Resource Limits: {{name}}</h1>
                   <div class="help-block">
                     Resource limits control how much <span ng-if="!hideCPU">CPU and</span> memory a container will consume on a node.
@@ -49,11 +49,17 @@ <h2 ng-if="containers.length > 1">Container {{container.name}}</h2>
                     <div ng-repeat="problem in memoryProblems" class="has-error">
                       <span class="help-block">{{problem}}</span>
                     </div>
+
+                    <pause-rollouts-checkbox
+                        ng-if="object | managesRollouts"
+                        deployment="object">
+                    </pause-rollouts-checkbox>
+
                     <div class="button-group gutter-top gutter-bottom">
                       <button type="submit"
                         class="btn btn-primary btn-lg"
                         ng-click="save()"
-                        ng-disabled="form.$invalid || disableInputs || cpuProblems.length || memoryProblems.length"
+                        ng-disabled="form.$pristine || form.$invalid || disableInputs || cpuProblems.length || memoryProblems.length"
                         value="">Save</button>
                       <a class="btn btn-default btn-lg" ng-href="{{resourceURL}}">Cancel</a>
                     </div>

dist/scripts/scripts.js

@@ -6997,7 +6997,7 @@ group:d.group
 };
 if (!h.canI(n, "update", d.project)) return void l.toErrorPage("You do not have authority to update " + o(d.kind) + " " + d.name + ".", "access_denied");
 j.get(n, e.name, m).then(function(a) {
-var d = angular.copy(a);
+var d = e.object = angular.copy(a);
 e.breadcrumbs = i.getBreadcrumbs({
 object:d,
 project:c,
@@ -7720,7 +7720,7 @@ resource:h.kindToResource(c.kind),
 group:c.group
 };
 return f.canI(p, "update", c.project) ? void i.get(p, d.name, l).then(function(a) {
-var f = angular.copy(a);
+var f = d.object = angular.copy(a);
 d.breadcrumbs = g.getBreadcrumbs({
 object:f,
 project:k,
@@ -13540,7 +13540,29 @@ scope:{
 build:"="
 }
 };
-}), angular.module("openshiftConsole").filter("duration", function() {
+}), angular.module("openshiftConsole").directive("pauseRolloutsCheckbox", [ "APIService", function(a) {
+return {
+restrict:"E",
+scope:{
+deployment:"=",
+disabled:"=ngDisabled",
+alwaysVisible:"="
+},
+templateUrl:"views/directives/pause-rollouts-checkbox.html",
+link:function(b) {
+var c = function() {
+if (!b.deployment) return !1;
+var c = a.objectToResourceGroupVersion(b.deployment);
+return "deploymentconfigs" === c.resource && !c.group;
+};
+b.$watch("deployment.spec.triggers", function(a) {
+b.missingConfigChangeTrigger = c() && !_.some(a, {
+type:"ConfigChange"
+});
+}, !0);
+}
+};
+} ]), angular.module("openshiftConsole").filter("duration", function() {
 return function(a, b, c, d) {
 function e(a, b, d) {
 if (0 !== a) return 1 === a ? void (c ? h.push(b) :h.push("1 " + b)) :void h.push(a + " " + d);
@@ -14385,7 +14407,13 @@ name:b.name
 });
 return a(d) ? "read-only" :_.get(d, "persistentVolumeClaim.readOnly") ? "read-only" :b.readOnly ? "read-only" :"read-write";
 };
-}), angular.module("openshiftConsole").filter("canI", [ "AuthorizationService", function(a) {
+}).filter("managesRollouts", [ "APIService", function(a) {
+return function(b) {
+if (!b) return !1;
+var c = a.objectToResourceGroupVersion(b);
+return "deploymentconfigs" === c.resource && !c.group || "deployments" === c.resource && "extensions" === c.group;
+};
+} ]), angular.module("openshiftConsole").filter("canI", [ "AuthorizationService", function(a) {
 return function(b, c, d) {
 return a.canI(b, c, d);
 };