Add the ability to view the system logs in the superuser endpoint

static/js/app.js

@@ -2225,7 +2225,7 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading
                             templateUrl: '/static/partials/repo-list.html', controller: RepoListCtrl, reloadOnSearch: false}).
       when('/user/', {title: 'Account Settings', description:'Account settings for ' + title, templateUrl: '/static/partials/user-admin.html',
                       reloadOnSearch: false, controller: UserAdminCtrl}).
-      when('/superuser/', {title: 'Superuser Admin Panel', description:'Admin panel for ' + title, templateUrl: '/static/partials/super-user.html',
+      when('/superuser/', {title: 'Enterprise Registry Setup', description:'Admin panel for ' + title, templateUrl: '/static/partials/super-user.html',
                            reloadOnSearch: false, controller: SuperUserAdminCtrl, newLayout: true}).
       when('/guide/', {title: 'Guide', description:'Guide to using private docker repositories on ' + title,
                        templateUrl: '/static/partials/guide.html',

static/js/controllers.js

@@ -2810,7 +2810,7 @@ function ManageApplicationCtrl($scope, $routeParams, $rootScope, $location, $tim
 }
 
 
-function SuperUserAdminCtrl($scope, ApiService, Features, UserService) {
+function SuperUserAdminCtrl($scope, $timeout, ApiService, Features, UserService, AngularPollChannel) {
   if (!Features.SUPER_USERS) {
     return;
   }
@@ -2822,6 +2822,52 @@ function SuperUserAdminCtrl($scope, ApiService, Features, UserService) {
   $scope.newUser = {};
   $scope.createdUsers = [];
   $scope.systemUsage = null;
+  $scope.debugServices = null;
+  $scope.debugLogs = null;
+  $scope.pollChannel = null;
+  $scope.logsScrolled = false;
+
+  $scope.viewSystemLogs = function(service) {
+    if ($scope.pollChannel) {
+      $scope.pollChannel.stop();
+    }
+
+    $scope.debugService = service;
+    $scope.debugLogs = null;
+
+    $scope.pollChannel = AngularPollChannel.create($scope, $scope.loadServiceLogs, 1 * 1000 /* 1s */);
+    $scope.pollChannel.start();
+  };
+
+  $scope.loadServiceLogs = function(callback) {
+    if (!$scope.debugService) { return; }
+
+    var params = {
+      'service': $scope.debugService
+    };
+
+    var errorHandler = ApiService.errorDisplay('Cannot load system logs. Please contact support.',
+      function() {
+        callback(false);
+      })
+
+    ApiService.getSystemLogs(null, params, /* background */true).then(function(resp) {
+      $scope.debugLogs = resp['logs'];
+      callback(true);
+    }, errorHandler);
+  };
+
+  $scope.loadDebugServices = function() {
+    if ($scope.pollChannel) {
+      $scope.pollChannel.stop();
+    }
+
+    $scope.debugService = null;
+
+    ApiService.listSystemLogServices().then(function(resp) {
+      $scope.debugServices = resp['services'];
+    }, ApiService.errorDisplay('Cannot load system logs. Please contact support.'))
+  };
 
   $scope.getUsage = function() {
     if ($scope.systemUsage) { return; }

static/js/core-ui.js

@@ -1,4 +1,96 @@
 angular.module("core-ui", [])
+  .directive('corLogBox', function() {
+    var directiveDefinitionObject = {
+      priority: 1,
+      templateUrl: '/static/directives/cor-log-box.html',
+      replace: true,
+      transclude: true,
+      restrict: 'C',
+      scope: {
+        'logs': '=logs'
+      },
+      controller: function($rootScope, $scope, $element, $timeout) {
+        $scope.hasNewLogs = false;
+
+        var scrollHandlerBound = false;
+        var isAnimatedScrolling = false;
+        var isScrollBottom = true;
+
+        var scrollHandler = function() {
+          if (isAnimatedScrolling) { return; }
+          var element = $element.find("#co-log-viewer")[0];
+          isScrollBottom = element.scrollHeight - element.scrollTop === element.clientHeight;
+
+          if (isScrollBottom) {
+            $scope.hasNewLogs = false;
+          }
+        };
+
+        var animateComplete = function() {
+          isAnimatedScrolling = false;
+        };
+
+        $scope.moveToBottom = function() {
+          $scope.hasNewLogs = false;
+          isAnimatedScrolling = true;
+          isScrollBottom = true;
+
+          $element.find("#co-log-viewer").animate(
+            { scrollTop: $element.find("#co-log-content").height() }, "slow", null, animateComplete);
+        };
+
+        $scope.$watch('logs', function(value, oldValue) {
+          if (!value) { return; }
+
+          $timeout(function() {
+            if (!scrollHandlerBound) {
+              $element.find("#co-log-viewer").on('scroll', scrollHandler);
+              scrollHandlerBound = true;
+            }
+
+            if (!isScrollBottom) {
+              $scope.hasNewLogs = true;
+              return;
+            }
+
+            $scope.moveToBottom();
+          }, 500);
+        });
+      }
+    };
+    return directiveDefinitionObject;
+  })
+
+  .directive('corOptionsMenu', function() {
+    var directiveDefinitionObject = {
+      priority: 1,
+      templateUrl: '/static/directives/cor-options-menu.html',
+      replace: true,
+      transclude: true,
+      restrict: 'C',
+      scope: {},
+      controller: function($rootScope, $scope, $element) {
+      }
+    };
+    return directiveDefinitionObject;
+  })
+
+  .directive('corOption', function() {
+    var directiveDefinitionObject = {
+      priority: 1,
+      templateUrl: '/static/directives/cor-option.html',
+      replace: true,
+      transclude: true,
+      restrict: 'C',
+      scope: {
+        'optionClick': '&optionClick'
+      },
+      controller: function($rootScope, $scope, $element) {
+      }
+    };
+    return directiveDefinitionObject;
+  })
+
 
   .directive('corTitle', function() {
     var directiveDefinitionObject = {