diff --git a/awx/ui/static/js/app.js b/awx/ui/static/js/app.js index 7cebb19339..d67b469e35 100644 --- a/awx/ui/static/js/app.js +++ b/awx/ui/static/js/app.js @@ -34,6 +34,7 @@ import dataServices from 'tower/services/_data-services'; import dashboardGraphs from 'tower/directives/_dashboard-graphs'; import routeExtensions from 'tower/shared/route-extensions/main'; +import breadcrumbs from 'tower/shared/breadcrumbs/main'; // modules import browserData from 'tower/browser-data/main'; @@ -78,6 +79,7 @@ var tower = angular.module('Tower', [ dashboardGraphs.name, routeExtensions.name, browserData.name, + breadcrumbs.name, 'AuthService', 'Utilities', 'LicenseHelper', diff --git a/awx/ui/static/js/controllers/Credentials.js b/awx/ui/static/js/controllers/Credentials.js index dab1960d79..91e6456543 100644 --- a/awx/ui/static/js/controllers/Credentials.js +++ b/awx/ui/static/js/controllers/Credentials.js @@ -90,8 +90,6 @@ export function CredentialsList($scope, $rootScope, $location, $log, $routeParam }); - LoadBreadCrumbs(); - $scope.showActivity = function () { Stream({ scope: $scope }); }; @@ -148,7 +146,6 @@ export function CredentialsAdd($scope, $rootScope, $compile, $location, $log, $r generator.inject(form, { mode: 'add', related: false, scope: $scope }); generator.reset(); - LoadBreadCrumbs(); // Load the list of options for Kind GetChoices({ @@ -372,12 +369,10 @@ export function CredentialsEdit($scope, $rootScope, $compile, $location, $log, $ Rest.get({ params: { id: id } }) .success(function (data) { + $scope.credential_name = data.name; + var i, fld; - LoadBreadCrumbs({ - path: '/credentials/' + id, - title: data.name - }); for (fld in form.fields) { if (data[fld] !== null && data[fld] !== undefined) { diff --git a/awx/ui/static/js/controllers/Inventories.js b/awx/ui/static/js/controllers/Inventories.js index 6586ac4951..746a2d255d 100644 --- a/awx/ui/static/js/controllers/Inventories.js +++ b/awx/ui/static/js/controllers/Inventories.js @@ -391,7 +391,7 @@ export function InventoriesAdd($scope, $rootScope, $compile, $location, $log, $r form.formLabelSize = null; form.formFieldSize = null; - generator.inject(form, { mode: 'add', related: false, scope: $scope }); + generator.inject(form, { mode: 'add', related: false, scope: $scope, breadcrumbs: true }); generator.reset(); LoadBreadCrumbs(); @@ -480,7 +480,7 @@ export function InventoriesEdit($scope, $rootScope, $compile, $location, $log, $ form.formLabelSize = null; form.formFieldSize = null; $scope.inventory_id = inventory_id; - generator.inject(form, { mode: 'edit', related: true, scope: $scope }); + generator.inject(form, { mode: 'edit', related: true, scope: $scope, breadcrumbs: true }); generator.reset(); diff --git a/awx/ui/static/js/controllers/JobTemplates.js b/awx/ui/static/js/controllers/JobTemplates.js index 443ab095ee..9f038f85fc 100644 --- a/awx/ui/static/js/controllers/JobTemplates.js +++ b/awx/ui/static/js/controllers/JobTemplates.js @@ -264,7 +264,7 @@ export function JobTemplatesAdd($scope, $rootScope, $compile, $location, $log, $ CallbackHelpInit({ scope: $scope }); $scope.can_edit = true; - generator.inject(form, { mode: 'add', related: false, scope: $scope }); + generator.inject(form, { mode: 'add', related: false, scope: $scope, breadcrumbs: true }); callback = function() { // Make sure the form controller knows there was a change @@ -674,7 +674,7 @@ export function JobTemplatesEdit($scope, $rootScope, $compile, $location, $log, CallbackHelpInit({ scope: $scope }); SchedulesList.well = false; - generator.inject(form, { mode: 'edit', related: true, scope: $scope }); + generator.inject(form, { mode: 'edit', related: true, scope: $scope, breadcrumbs: true }); $scope.mode = 'edit'; $scope.parseType = 'yaml'; $scope.showJobType = false; diff --git a/awx/ui/static/js/controllers/Organizations.js b/awx/ui/static/js/controllers/Organizations.js index d558bd5d30..9d8164ede3 100644 --- a/awx/ui/static/js/controllers/Organizations.js +++ b/awx/ui/static/js/controllers/Organizations.js @@ -166,6 +166,8 @@ export function OrganizationsEdit($scope, $rootScope, $compile, $location, $log, id = $routeParams.organization_id, relatedSets = {}; + $scope.organization_id = id; + generator.inject(form, { mode: 'edit', related: true, scope: $scope}); generator.reset(); @@ -186,7 +188,7 @@ export function OrganizationsEdit($scope, $rootScope, $compile, $location, $log, Rest.get() .success(function (data) { var fld, related, set; - LoadBreadCrumbs({ path: '/organizations/' + id, title: data.name }); + $scope.organization_name = data.name; for (fld in form.fields) { if (data[fld]) { $scope[fld] = data[fld]; @@ -225,6 +227,7 @@ export function OrganizationsEdit($scope, $rootScope, $compile, $location, $log, Rest.put(params) .success(function () { Wait('stop'); + $scope.organization_name = $scope.name; master = params; $rootScope.flashMessage = "Your changes were successfully saved!"; }) @@ -293,4 +296,4 @@ export function OrganizationsEdit($scope, $rootScope, $compile, $location, $log, OrganizationsEdit.$inject = ['$scope', '$rootScope', '$compile', '$location', '$log', '$routeParams', 'OrganizationForm', 'GenerateForm', 'Rest', 'Alert', 'ProcessErrors', 'LoadBreadCrumbs', 'RelatedSearchInit', 'RelatedPaginateInit', 'Prompt', 'ClearScope', 'GetBasePath', 'Wait', 'Stream' -]; \ No newline at end of file +]; diff --git a/awx/ui/static/js/controllers/Projects.js b/awx/ui/static/js/controllers/Projects.js index b3241de5b7..736637b010 100644 --- a/awx/ui/static/js/controllers/Projects.js +++ b/awx/ui/static/js/controllers/Projects.js @@ -404,7 +404,7 @@ export function ProjectsAdd($scope, $rootScope, $compile, $location, $log, $rout defaultUrl = GetBasePath('projects'), master = {}; - generator.inject(form, { mode: 'add', related: false, scope: $scope }); + generator.inject(form, { mode: 'add', related: false, scope: $scope, breadcrumbs: true }); generator.reset(); LoadBreadCrumbs(); @@ -557,7 +557,8 @@ export function ProjectsEdit($scope, $rootScope, $compile, $location, $log, $rou generator.inject(form, { mode: 'edit', related: true, - scope: $scope + scope: $scope, + breadcrumbs: true }); generator.reset(); diff --git a/awx/ui/static/js/controllers/Teams.js b/awx/ui/static/js/controllers/Teams.js index 0bbb5b35f2..ec63530016 100644 --- a/awx/ui/static/js/controllers/Teams.js +++ b/awx/ui/static/js/controllers/Teams.js @@ -191,6 +191,8 @@ export function TeamsEdit($scope, $rootScope, $compile, $location, $log, $routeP id = $routeParams.team_id, relatedSets = {}; + $scope.team_id = id; + generator.inject(form, { mode: 'edit', related: true, scope: $scope }); generator.reset(); @@ -234,7 +236,7 @@ export function TeamsEdit($scope, $rootScope, $compile, $location, $log, $routeP }) .success(function (data) { var fld, related, set; - LoadBreadCrumbs({ path: '/teams/' + id, title: data.name }); + $scope.team_name = data.name; for (fld in form.fields) { if (data[fld]) { $scope[fld] = data[fld]; @@ -296,6 +298,7 @@ export function TeamsEdit($scope, $rootScope, $compile, $location, $log, $routeP .success(function () { Wait('stop'); var base = $location.path().replace(/^\//, '').split('/')[0]; + $scope.team_name = $scope.name; if (base === 'teams') { ReturnToCaller(); } diff --git a/awx/ui/static/js/controllers/Users.js b/awx/ui/static/js/controllers/Users.js index e26e05567c..c1a7eb32fb 100644 --- a/awx/ui/static/js/controllers/Users.js +++ b/awx/ui/static/js/controllers/Users.js @@ -251,7 +251,8 @@ export function UsersEdit($scope, $rootScope, $compile, $location, $log, $routeP Rest.setUrl(defaultUrl + ':id/'); Rest.get({ params: { id: id } }) .success(function (data) { - LoadBreadCrumbs({ path: '/users/' + id, title: data.username }); + $scope.user_id = id; + $scope.username_title = data.username; var fld, related, set; for (fld in form.fields) { if (data[fld]) { @@ -325,6 +326,7 @@ export function UsersEdit($scope, $rootScope, $compile, $location, $log, $routeP Rest.put(data) .success(function () { Wait('stop'); + $scope.username_title = $scope.username; var base = $location.path().replace(/^\//, '').split('/')[0]; if (base === 'users') { ReturnToCaller(); diff --git a/awx/ui/static/js/shared/breadcrumbs/breadcrumb.directive.js b/awx/ui/static/js/shared/breadcrumbs/breadcrumb.directive.js new file mode 100644 index 0000000000..7b223e6b7a --- /dev/null +++ b/awx/ui/static/js/shared/breadcrumbs/breadcrumb.directive.js @@ -0,0 +1,26 @@ +export default function() { + + return { + restrict: 'E', + require: '^breadcrumbs', + transclude: true, + scope: { + path: '@', + title: '@', + current: '@' + }, + link: function(scope, element, attrs, parentController) { + var breadcrumb = + parentController.addBreadcrumb(scope.title, scope.path, scope.current); + + scope.$watch('title', function(value) { + breadcrumb.title = value; + + if (breadcrumb.isCurrent && value) { + parentController.setHidden(false); + } + }); + } + }; + +} diff --git a/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.controller.js b/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.controller.js new file mode 100644 index 0000000000..6429007556 --- /dev/null +++ b/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.controller.js @@ -0,0 +1,34 @@ +export default + [ '$scope', + '$rootScope', + function($scope, $rootScope) { + + $scope.breadcrumbs = []; + + this.addBreadcrumb = function(title, path) { + var breadcrumb = + { title: title, + path: path + }; + + if ($rootScope.enteredPath === path) { + breadcrumb.isCurrent = true; + } + + $scope.breadcrumbs = + $scope.breadcrumbs.concat(breadcrumb); + + return breadcrumb; + }; + + this.setHidden = function(hidden) { + + if (angular.isUndefined(hidden)) { + $scope.isHidden = true; + } else { + $scope.isHidden = hidden; + } + + }; + +}]; diff --git a/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.directive.js b/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.directive.js new file mode 100644 index 0000000000..39d5cd5ae4 --- /dev/null +++ b/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.directive.js @@ -0,0 +1,32 @@ +/* jshint unused: vars */ + +import controller from './breadcrumbs.controller'; +import 'tower/shared/generator-helpers'; + +export default function() { + + return { + restrict: 'E', + controller: controller, + transclude: true, + templateUrl: '/static/js/shared/breadcrumbs/breadcrumbs.partial.html', + scope: { + }, + link: function(scope, element, attrs, controller) { + // make breadcrumbs hidden until the current + // breadcrumb has a title; this avoids + // ugly rendering when an object's title + // is fetched via ajax + // + controller.setHidden(); + + scope.$watch('isHidden', function(value) { + if (value) { + element.hide(); + } else { + element.show(); + } + }); + } + }; +} diff --git a/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.partial.html b/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.partial.html new file mode 100644 index 0000000000..a949cfb172 --- /dev/null +++ b/awx/ui/static/js/shared/breadcrumbs/breadcrumbs.partial.html @@ -0,0 +1,9 @@ + + +
diff --git a/awx/ui/static/js/shared/breadcrumbs/main.js b/awx/ui/static/js/shared/breadcrumbs/main.js new file mode 100644 index 0000000000..47b9761549 --- /dev/null +++ b/awx/ui/static/js/shared/breadcrumbs/main.js @@ -0,0 +1,7 @@ +import breadcrumbs from './breadcrumbs.directive'; +import breadcrumb from './breadcrumb.directive'; + +export default + angular.module('breadcrumbs', []) + .directive('breadcrumb', breadcrumb) + .directive('breadcrumbs', breadcrumbs); diff --git a/awx/ui/static/js/shared/form-generator.js b/awx/ui/static/js/shared/form-generator.js index 5a6ff4ed94..4a791ef370 100644 --- a/awx/ui/static/js/shared/form-generator.js +++ b/awx/ui/static/js/shared/form-generator.js @@ -1441,7 +1441,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat var btn, button, fld, field, html = '', i, section, group, tab, sectionShow, offset, width,ngDisabled; - if (!this.modal && (options.breadCrumbs === undefined || options.breadCrumbs === true)) { + if (!this.modal && (options.breadcrumbs === true)) { if (this.form.navigationLinks) { html += this.breadCrumbs(options, this.form.navigationLinks); } else { diff --git a/awx/ui/static/js/shared/generator-helpers.js b/awx/ui/static/js/shared/generator-helpers.js index 37a9517dc1..8b4e70b20b 100644 --- a/awx/ui/static/js/shared/generator-helpers.js +++ b/awx/ui/static/js/shared/generator-helpers.js @@ -346,8 +346,9 @@ angular.module('GeneratorHelpers', [systemStatus.name]) // Generate breadcrumbs using the list-generator.js method. - var list = params.list, + var list = params.list || {}, mode = params.mode, + title = params.title, html = '', itm, navigation; html += "