From d32240803e9ed007768c6bfafe36a36e0f73f226 Mon Sep 17 00:00:00 2001 From: chouseknecht Date: Wed, 4 Sep 2013 11:06:55 -0400 Subject: [PATCH] Fixes for AC-389, 391, 392, 397 --- awx/ui/static/js/controllers/Hosts.js | 2 + awx/ui/static/js/forms/Inventories.js | 13 +++ awx/ui/static/js/helpers/inventory.js | 2 +- awx/ui/static/js/lists/Projects.js | 2 +- awx/ui/static/less/ansible-ui.less | 107 ++++++-------------- awx/ui/static/lib/ansible/form-generator.js | 66 +++++++++--- awx/ui/static/lib/ansible/utilities.js | 3 +- 7 files changed, 105 insertions(+), 90 deletions(-) diff --git a/awx/ui/static/js/controllers/Hosts.js b/awx/ui/static/js/controllers/Hosts.js index f26d6cc282..5860ad5cc6 100644 --- a/awx/ui/static/js/controllers/Hosts.js +++ b/awx/ui/static/js/controllers/Hosts.js @@ -29,6 +29,7 @@ function InventoryHosts ($scope, $rootScope, $compile, $location, $log, $routePa scope['hostAddHide'] = true; scope['hostCreateHide'] = true; scope['hosts'] = null; + scope['helpCount'] = 0; if (scope.loadBreadCrumbsRemove) { scope.loadBreadCrumbsRemove(); @@ -114,6 +115,7 @@ function InventoryHosts ($scope, $rootScope, $compile, $location, $log, $routePa scope.refreshHostRemove = scope.$on('refreshHost', function(e, group, title) { scope.groupTitle = title; scope.group_id = group; + scope.helpCount++; if (scope.group_id == null) { scope.hostAddHide = true; scope.hostCreateHide = true; diff --git a/awx/ui/static/js/forms/Inventories.js b/awx/ui/static/js/forms/Inventories.js index 60e7776f74..4e9d59e47d 100644 --- a/awx/ui/static/js/forms/Inventories.js +++ b/awx/ui/static/js/forms/Inventories.js @@ -15,6 +15,19 @@ angular.module('InventoryFormDefinition', []) name: 'inventory', parseTypeName: 'inventoryParseType', well: true, + + navigationLinks: { + hosts: { + href: "/#/inventories/{{ inventory_id }}/hosts", + label: 'Hosts', + icon: 'icon-laptop' + }, + Groups: { + href: "/#/inventories/{{ inventory_id }}/groups", + label: 'Groups', + icon: 'icon-sitemap' + } + }, fields: { inventory_name: { diff --git a/awx/ui/static/js/helpers/inventory.js b/awx/ui/static/js/helpers/inventory.js index 566b7f6677..7914faa2b8 100644 --- a/awx/ui/static/js/helpers/inventory.js +++ b/awx/ui/static/js/helpers/inventory.js @@ -630,7 +630,7 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi .factory('SetShowGroupHelp', ['Rest', 'ProcessErrors', 'GetBasePath', function(Rest, ProcessErrors, GetBasePath) { return function(params) { // Check if inventory has groups. If not, turn on hints to let user know groups are required - // before we can + // before hosts can be added var scope = params.scope; var url = GetBasePath('inventory') + scope.inventory_id + '/groups/'; Rest.setUrl(url); diff --git a/awx/ui/static/js/lists/Projects.js b/awx/ui/static/js/lists/Projects.js index 510b66bcd6..bc6f69d701 100644 --- a/awx/ui/static/js/lists/Projects.js +++ b/awx/ui/static/js/lists/Projects.js @@ -13,7 +13,7 @@ angular.module('ProjectsListDefinition', []) name: 'projects', iterator: 'project', selectTitle: 'Add Project', - editTitle: '{{ name }}', + editTitle: 'Projects', selectInstructions: '

Select existing projects by clicking each project or checking the related checkbox. When finished, click the blue ' + 'Select button, located bottom right.

Create a brand new project by clicking the green Create New button.

', index: true, diff --git a/awx/ui/static/less/ansible-ui.less b/awx/ui/static/less/ansible-ui.less index 75a771db9b..1fe7ac2421 100644 --- a/awx/ui/static/less/ansible-ui.less +++ b/awx/ui/static/less/ansible-ui.less @@ -407,23 +407,6 @@ select.field-mini-height { margin-left: 10px; } -.tree-container { - background-color: #f5f5f5; - border: 1px solid #e3e3e3; - border-radius: 6px; -} - -.tree-controls { - padding: 10px; - border-bottom: 1px solid #e3e3e3; - - .title { - display: inline-block; - font-weight: bold; - margin-right: 25px; - } -} - .no-padding { padding: 0; margin: 0; @@ -600,75 +583,48 @@ select.field-mini-height { overflow: hidden; } +/* Inventory nav links */ + .navigation-links { + + padding: 0; + margin-top: -10px; -/* Inventory Detail Groups tab */ + a { + margin-right: 15px; + } + + a:last-child { + margin-right: 20px; + } + } + +/* Inventory-> Groups */ + .inventory-content { padding: 15px; border: 1px solid #ddd; border-radius: 6px; } - .groups-menu, .hosts-menu { - min-height: 30px; + .tree-container { background-color: #f5f5f5; border: 1px solid #e3e3e3; border-radius: 6px; - - .nav a { - color: @blue-link; - font-size: 12px; - i { - font-size: 14px; - } - } - - a.disabled { - color: @grey; - } - - .navbar-form { - display: inline-block; - float: right; - margin-top: 13px; - margin-left: 20px; - margin-right: 10px; - - label { - font-size: 12px; - line-height: normal; - } - input[type="checkbox"] { - margin-top: 0; - } - } - - /* the brand is't really a link */ - .navbar-brand { - color: @black; - text-align: left; - font-size: 14px; - max-width: 100%; - i { - color: @red; - } - } - .navbar-brand:hover { - color: @black; - cursor: default; - } - - /* neither is the status spinner */ - .nav .status { - color: @black; - } - .nav .status:hover { - color: @black; - cursor: default; - } - } -/* Inventory Detail Hosts tab */ + .tree-controls { + padding: 10px; + border-bottom: 1px solid #e3e3e3; + + .title { + display: inline-block; + color: #555; + font-size: 14px; + font-weight: normal; + } + } + +/* Inventory-> Hosts */ .hosts-well { padding-top: 5px; @@ -710,7 +666,8 @@ select.field-mini-height { } .search-tree { - + + margin-top: 10px; padding: 10px 3px 10px 3px; .title { diff --git a/awx/ui/static/lib/ansible/form-generator.js b/awx/ui/static/lib/ansible/form-generator.js index 08faec4ca0..ce0a6aee68 100644 --- a/awx/ui/static/lib/ansible/form-generator.js +++ b/awx/ui/static/lib/ansible/form-generator.js @@ -270,6 +270,10 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies']) return html; }, + navigationLink: function(link) { + return "" + this.attr(link, 'icon') + ' ' + link.label + "\n"; + }, + buildField: function(fld, field, options, form) { function getFieldWidth() { @@ -768,6 +772,14 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies']) } html += "\n"; } + + if (this.form.navigationLinks) { + html += "\n"; + } // Start the well if ( this.has('well') ) { @@ -951,6 +963,22 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies']) // // Used to create the inventory detail view // + + + function navigationLinks(page) { + // Returns html for navigation links + var html = "\n"; + return html; + } + var form = this.form; var itm = "groups"; @@ -966,17 +994,20 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies']) "use the Inventories->Hosts page to " + "add hosts to the group.

"; html += "\n"; - html += "
\n"; + + html += navigationLinks('group'); + + html += "
\n"; html += "
\n"; - html += "
\n"; - html += "\n"; + html += "
\n"; + //html += "\n"; html += "\n"; - html += "\n"; + "Properties\n"; + //html += "\n"; html += "\n"; html += "\n"; html += "

Hint: Get started building your inventory by adding a group on the " + "Inventories->Groups page. After creating a group, " + "return here and add hosts to the group.

"; html += "
\n"; + + html += "
\n"; + html += "\n"; + html += "

Hint: To add hosts to the inventory, select a group using the Group Selector.

"; + html += "
\n"; + html += "
\n"; html += "
\n"; html += "
\n"; html += "
\n
\n"; - html += "
\n"; + //html += "
\n"; html += "
\n"; html += "
\n"; html += "
\n"; - html += "
\n"; + + html += navigationLinks('host'); + html += "
\n"; + html += SearchWidget({ iterator: form.iterator, template: form, mini: true, size: 'col-md-6 col-lg-6'}); html += "
\n" html += "
\n"; diff --git a/awx/ui/static/lib/ansible/utilities.js b/awx/ui/static/lib/ansible/utilities.js index f53f9a2b63..494e291b7a 100644 --- a/awx/ui/static/lib/ansible/utilities.js +++ b/awx/ui/static/lib/ansible/utilities.js @@ -171,7 +171,8 @@ angular.module('Utilities',[]) break; } } - if (paths[i] == 'hosts' && $rootScope.crumbCache[j].altPath) { + if ($rootScope.crumbCache[j] && $rootScope.crumbCache[j]['altPath'] !== undefined) { + // Use altPath to override default path construction $rootScope.breadcrumbs.push({ title: child, path: $rootScope.crumbCache[j].altPath }); } else {