Merge pull request ansible#766 from mabashian/activity-stream

Added activity stream route and view

awx/ui/client/legacy-styles/ansible-ui.less

@@ -1713,33 +1713,6 @@ tr td button i {
   }
 }
 
-/* Activity Stream Widget */
-
-  #stream-container {
-    display: none;
-    border-radius: 8px;
-    z-index: 20;  /* has to be greater than tree selector */
-
-    .nav-path {
-      margin-bottom: 15px;
-      margin-top: 5px;
-    }
-
-    padding-left: 10px;
-    padding-right: 10px;
-  }
-
-  #stream-content {
-    border: 1px solid @grey;
-    border-radius: 8px;
-    padding: 8px;
-
-    h5 {
-        margin-top: 0;
-        margin-bottom: 20px;
-    }
-  }
-
 /* job stdout */
 
   #pre-container {

awx/ui/client/src/activity-stream/activitystream.controller.js

@@ -0,0 +1,21 @@
+/*************************************************
+ * Copyright (c) 2016 Ansible, Inc.
+ *
+ * All Rights Reserved
+ *************************************************/
+
+/**
+ * @ngdoc function
+ * @name controllers.function:Activity Stream
+ * @description This controller controls the activity stream.
+*/
+function activityStreamController($scope, Stream) {
+
+    // Open the stream
+    Stream({
+        scope: $scope
+    });
+
+}
+
+export default ['$scope', 'Stream', activityStreamController];

awx/ui/client/src/activity-stream/activitystream.partial.html

@@ -0,0 +1,3 @@
+<div class="Panel" id="stream-container">
+    <div id="stream-content"></div>
+</div>

awx/ui/client/src/activity-stream/activitystream.route.js

@@ -0,0 +1,17 @@
+/*************************************************
+ * Copyright (c) 2016 Ansible, Inc.
+ *
+ * All Rights Reserved
+ *************************************************/
+
+ import {templateUrl} from '../shared/template-url/template-url.factory';
+
+export default {
+    name: 'activityStream',
+    route: '/activity_stream?target&id',
+    templateUrl: templateUrl('activity-stream/activitystream'),
+    controller: 'activityStreamController',
+    ncyBreadcrumb: {
+        label: "ACTIVITY STREAM"
+    },
+};

awx/ui/client/src/activity-stream/main.js

@@ -0,0 +1,14 @@
+/*************************************************
+ * Copyright (c) 2016 Ansible, Inc.
+ *
+ * All Rights Reserved
+ *************************************************/
+
+import activityStreamRoute from './activitystream.route';
+import activityStreamController from './activitystream.controller';
+
+export default angular.module('activityStream', [])
+    .controller('activityStreamController', activityStreamController)
+    .run(['$stateExtender', function($stateExtender) {
+        $stateExtender.addState(activityStreamRoute);
+    }]);

awx/ui/client/src/app.js

@@ -42,6 +42,7 @@ import moment from './shared/moment/main';
 import templateUrl from './shared/template-url/main';
 import adhoc from './adhoc/main';
 import login from './login/main';
+import activityStream from './activity-stream/main';
 import {JobDetailController} from './controllers/JobDetail';
 import {JobStdoutController} from './controllers/JobStdout';
 import {JobTemplatesList, JobTemplatesAdd, JobTemplatesEdit} from './controllers/JobTemplates';
@@ -91,6 +92,7 @@ var tower = angular.module('Tower', [
     templateUrl.name,
     adhoc.name,
     login.name,
+    activityStream.name,
     footer.name,
     'templates',
     'Utilities',
@@ -209,6 +211,9 @@ var tower = angular.module('Tower', [
                 url: '/home',
                 templateUrl: urlPrefix + 'partials/home.html',
                 controller: Home,
+                data: {
+                    activityStream: true
+                },
                 ncyBreadcrumb: {
                     label: "DASHBOARD"
                 },
@@ -241,6 +246,10 @@ var tower = angular.module('Tower', [
                 url: '/home/hosts?has_active_failures',
                 templateUrl: urlPrefix + 'partials/subhome.html',
                 controller: HomeHosts,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'host'
+                },
                 ncyBreadcrumb: {
                     parent: 'dashboard',
                     label: "HOSTS"
@@ -361,6 +370,10 @@ var tower = angular.module('Tower', [
                 url: '/job_templates',
                 templateUrl: urlPrefix + 'partials/job_templates.html',
                 controller: JobTemplatesList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'job_template'
+                },
                 ncyBreadcrumb: {
                     label: "JOB TEMPLATES"
                 },
@@ -390,6 +403,9 @@ var tower = angular.module('Tower', [
                 url: '/:template_id',
                 templateUrl: urlPrefix + 'partials/job_templates.html',
                 controller: JobTemplatesEdit,
+                data: {
+                    activityStreamId: 'template_id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -401,6 +417,10 @@ var tower = angular.module('Tower', [
                 url: '/job_templates/:id/schedules',
                 templateUrl: urlPrefix + 'partials/schedule_detail.html',
                 controller: ScheduleEditController,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'schedule'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -412,6 +432,10 @@ var tower = angular.module('Tower', [
                 url: '/projects',
                 templateUrl: urlPrefix + 'partials/projects.html',
                 controller: ProjectsList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'project'
+                },
                 ncyBreadcrumb: {
                     label: "PROJECTS"
                 },
@@ -441,6 +465,9 @@ var tower = angular.module('Tower', [
                 url: '/:id',
                 templateUrl: urlPrefix + 'partials/projects.html',
                 controller: ProjectsEdit,
+                data: {
+                    activityStreamId: 'id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -452,6 +479,10 @@ var tower = angular.module('Tower', [
                 url: '/projects/:id/schedules',
                 templateUrl: urlPrefix + 'partials/schedule_detail.html',
                 controller: ScheduleEditController,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'schedule'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -485,6 +516,10 @@ var tower = angular.module('Tower', [
                 url: '/inventories',
                 templateUrl: urlPrefix + 'partials/inventories.html',
                 controller: InventoriesList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'inventory'
+                },
                 ncyBreadcrumb: {
                     label: "INVENTORIES"
                 },
@@ -514,6 +549,9 @@ var tower = angular.module('Tower', [
                 url: '/:inventory_id',
                 templateUrl: urlPrefix + 'partials/inventories.html',
                 controller: InventoriesEdit,
+                data: {
+                    activityStreamId: 'inventory_id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -558,6 +596,10 @@ var tower = angular.module('Tower', [
                 url: '/organizations',
                 templateUrl: urlPrefix + 'partials/organizations.html',
                 controller: OrganizationsList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'organization'
+                },
                 ncyBreadcrumb: {
                     parent: function($scope) {
                         $scope.$parent.$emit("ReloadOrgListView");
@@ -591,6 +633,9 @@ var tower = angular.module('Tower', [
                 url: '/:organization_id',
                 templateUrl: urlPrefix + 'partials/organizations.crud.html',
                 controller: OrganizationsEdit,
+                data: {
+                    activityStreamId: 'organization_id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -646,6 +691,10 @@ var tower = angular.module('Tower', [
                 url: '/teams',
                 templateUrl: urlPrefix + 'partials/teams.html',
                 controller: TeamsList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'team'
+                },
                 ncyBreadcrumb: {
                     parent: 'setup',
                     label: 'TEAMS'
@@ -676,6 +725,9 @@ var tower = angular.module('Tower', [
                 url: '/:team_id',
                 templateUrl: urlPrefix + 'partials/teams.html',
                 controller: TeamsEdit,
+                data: {
+                    activityStreamId: 'team_id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -775,6 +827,10 @@ var tower = angular.module('Tower', [
                 url: '/credentials',
                 templateUrl: urlPrefix + 'partials/credentials.html',
                 controller: CredentialsList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'credential'
+                },
                 ncyBreadcrumb: {
                     parent: 'setup',
                     label: 'CREDENTIALS'
@@ -805,6 +861,9 @@ var tower = angular.module('Tower', [
                 url: '/:credential_id',
                 templateUrl: urlPrefix + 'partials/credentials.html',
                 controller: CredentialsEdit,
+                data: {
+                    activityStreamId: 'credential_id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -816,6 +875,10 @@ var tower = angular.module('Tower', [
                 url: '/users',
                 templateUrl: urlPrefix + 'partials/users.html',
                 controller: UsersList,
+                data: {
+                    activityStream: true,
+                    activityStreamTarget: 'user'
+                },
                 ncyBreadcrumb: {
                     parent: 'setup',
                     label: 'USERS'
@@ -846,6 +909,9 @@ var tower = angular.module('Tower', [
                 url: '/:user_id',
                 templateUrl: urlPrefix + 'partials/users.html',
                 controller: UsersEdit,
+                data: {
+                    activityStreamId: 'user_id'
+                },
                 resolve: {
                     features: ['FeaturesService', function(FeaturesService) {
                         return FeaturesService.get();
@@ -925,9 +991,9 @@ var tower = angular.module('Tower', [
         }]);
     }])
 
-    .run(['$q', '$compile', '$cookieStore', '$rootScope', '$log', 'CheckLicense', '$location', 'Authorization', 'LoadBasePaths', 'Timer', 'ClearScope', 'HideStream', 'Socket',
+    .run(['$q', '$compile', '$cookieStore', '$rootScope', '$log', 'CheckLicense', '$location', 'Authorization', 'LoadBasePaths', 'Timer', 'ClearScope', 'Socket',
         'LoadConfig', 'Store', 'ShowSocketHelp', 'AboutAnsibleHelp', 'pendoService',
-        function ($q, $compile, $cookieStore, $rootScope, $log, CheckLicense, $location, Authorization, LoadBasePaths, Timer, ClearScope, HideStream, Socket,
+        function ($q, $compile, $cookieStore, $rootScope, $log, CheckLicense, $location, Authorization, LoadBasePaths, Timer, ClearScope, Socket,
         LoadConfig, Store, ShowSocketHelp, AboutAnsibleHelp, pendoService) {
 
 
@@ -1068,11 +1134,6 @@ var tower = angular.module('Tower', [
                             $location.replace($location.search('').$$url);
                     }
 
-                    // Before navigating away from current tab, make sure the primary view is visible
-                    if ($('#stream-container').is(':visible')) {
-                        HideStream();
-                    }
-
                     // remove any lingering intervals
                     if ($rootScope.jobDetailInterval) {
                         window.clearInterval($rootScope.jobDetailInterval);

awx/ui/client/src/bread-crumb/bread-crumb.directive.js

@@ -6,15 +6,39 @@ export default
             restrict: 'E',
             templateUrl: templateUrl('bread-crumb/bread-crumb'),
             link: function(scope, element, attrs) {
-                scope.activityStreamActive = 0;
 
-                scope.toggleActivityStreamActive = function(){
-                    scope.activityStreamActive = !scope.activityStreamActive;
-                };
+                var streamConfig = {};
+
+                scope.showActivityStreamButton = false;
+
+                scope.openActivityStream = function() {
+
+                    var stateGoParams = {};
+
+                    if(streamConfig && streamConfig.activityStream) {
+                        if(streamConfig.activityStreamTarget) {
+                            stateGoParams['target'] = streamConfig.activityStreamTarget;
+                        }
+                        if(streamConfig.activityStreamId) {
+                            stateGoParams['id'] = $state.params[streamConfig.activityStreamId];
+                        }
+                    }
+
+                    $state.go('activityStream', stateGoParams);
+                }
+
+                scope.$on("$stateChangeSuccess", function updateActivityStreamButton(event, toState) {
+
+                    streamConfig = (toState && toState.data) ? toState.data : {};
+
+                    if(streamConfig && streamConfig.activityStream) {
+                        scope.showActivityStreamButton = true;
+                    }
+                    else {
+                        scope.showActivityStreamButton = false;
+                    }
+                });
 
-                scope.isActive = function (path) {
-                    return $state.is(path);
-                };
             }
         };
     }];

awx/ui/client/src/bread-crumb/bread-crumb.partial.html

@@ -7,8 +7,8 @@
         data-trigger="hover"
         data-container="body"
         ng-class="{'BreadCrumb-menuLinkActive' : activityStreamActive}"
-        ng-if="isActive('dashboard')"
-        ng-click="toggleActivityStreamActive()">
+        ng-if="showActivityStreamButton"
+        ng-click="openActivityStream()">
         <i class="BreadCrumb-menuLinkImage icon-activity-stream"
             alt="Activity Stream">
         </i>
@@ -20,7 +20,7 @@
         data-placement="left"
         data-trigger="hover"
         data-container="body"
-        ng-if="!isActive('dashboard')">
+        ng-if="!showActivityStreamButton">
         <i class="BreadCrumb-menuLinkImage fa fa-tachometer"
             alt="Dashboard">
         </i>