Init Containers Watch Status

Watch for init container status updates, and hide details on success

Author: cdcabrera

app/scripts/directives/resources.js

@@ -1,7 +1,7 @@
 'use strict';
 
 angular.module('openshiftConsole')
-  .directive('containerStatuses', function($filter) {
+  .directive('containerStatuses', function($filter, $timeout) {
     return {
       restrict: 'E',
       scope: {
@@ -13,16 +13,21 @@ angular.module('openshiftConsole')
       link: function(scope) {
         scope.hasDebugTerminal = angular.isFunction(scope.startDebugTerminal);
 
-        scope.podContainerStatuses = _.get(scope.pod, 'status.containerStatuses', []);
-        scope.podContainerInitStatuses = _.get(scope.pod, 'status.initContainerStatuses', []);
-
         var haveContainersFailed = function(containerStatuses) {
           return _.some(containerStatuses, function (containerStatus) {
             return $filter('isContainerFailed')(containerStatus) !== false;
           });
         };
 
-        scope.expandInitContainers = scope.initContainersFailed = haveContainersFailed(scope.podContainerInitStatuses);
+        scope.$watch('pod.status.initContainerStatuses', function(updatedInitContainerStatuses) {
+          scope.initContainersFailed = haveContainersFailed(updatedInitContainerStatuses);
+
+          $timeout(function() {
+            if (scope.expandInitContainers !== false) {
+              scope.expandInitContainers = scope.initContainersFailed;
+            }
+          }, 250);
+        }, true);
 
         scope.toggleInitContainer = function() {
           scope.expandInitContainers = !scope.expandInitContainers;

app/views/_container-statuses.html

@@ -9,8 +9,8 @@
   <h4 row>
     <span><i class="pficon" ng-class="{'pficon-ok': !initContainersFailed}"></i></span>
     <span flex>
-      <span ng-if="!initContainersFailed"> &nbsp;{{podContainerInitStatuses.length}}</span>
-      <ng-pluralize count="podContainerInitStatuses.length"
+      <span ng-if="!initContainersFailed"> &nbsp;{{pod.status.initContainerStatuses.length}}</span>
+      <ng-pluralize count="pod.status.initContainerStatuses.length"
                     when="{'1': 'Init Container','other': 'Init Containers'}">
       </ng-pluralize>
       <span ng-if="!initContainersFailed">completed successfully</span>
@@ -19,9 +19,9 @@ <h4 row>
     <a class="page-header-link" href="" ng-click="toggleInitContainer()" ng-if="expandInitContainers">Hide Details</a>
   </h4>
 
-  <div class="pod-template-block"
+  <div class="pod-template-block animate-if"
        ng-if="expandInitContainers"
-       ng-repeat="containerStatus in podContainerInitStatuses" >
+       ng-repeat="containerStatus in pod.status.initContainerStatuses" >
 
     <div class="pod-template">
       <div class="component-label">Init Container: {{containerStatus.name}}</div>
@@ -48,7 +48,7 @@ <h4 row>
   </div>
 </div>
 
-<div ng-repeat="containerStatus in podContainerStatuses" >
+<div ng-repeat="containerStatus in pod.status.containerStatuses" >
   <h4>Container {{containerStatus.name}}</h4>
 
   <dl class="dl-horizontal left">