diff options
| -rw-r--r-- | awx/ui/static/js/controllers/Hosts.js | 3 | ||||
| -rw-r--r-- | awx/ui/static/js/helpers/Hosts.js | 195 | ||||
| -rw-r--r-- | awx/ui/static/less/ansible-ui.less | 24 | ||||
| -rw-r--r-- | awx/ui/static/lib/ansible/directives.js | 375 | ||||
| -rw-r--r-- | awx/ui/static/lib/ansible/form-generator.js | 7 |
5 files changed, 335 insertions, 269 deletions
diff --git a/awx/ui/static/js/controllers/Hosts.js b/awx/ui/static/js/controllers/Hosts.js index 86735dcf98..e25282cfc2 100644 --- a/awx/ui/static/js/controllers/Hosts.js +++ b/awx/ui/static/js/controllers/Hosts.js @@ -33,10 +33,11 @@ function InventoryHosts ($scope, $rootScope, $compile, $location, $log, $routePa if (scope.loadBreadCrumbsRemove) { scope.loadBreadCrumbsRemove(); } - scope.loadBreadCrumbsRemove = scope.$on('hostTabInit', function(e, inventory_name) { + scope.loadBreadCrumbsRemove = scope.$on('buildAllGroups', function(e, inventory_name) { LoadBreadCrumbs({ path: '/inventories/' + id, title: inventory_name }); }); + // Sets up the search tree and loads All Hosts for the inventory LoadSearchTree({ scope: scope, inventory_id: scope['inventory_id'] }); // Add the selected flag to the hosts set. diff --git a/awx/ui/static/js/helpers/Hosts.js b/awx/ui/static/js/helpers/Hosts.js index 770eff73d7..f858f8553a 100644 --- a/awx/ui/static/js/helpers/Hosts.js +++ b/awx/ui/static/js/helpers/Hosts.js @@ -6,7 +6,7 @@ * Routines that handle host add/edit/delete on the Inventory detail page. * */ - + angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'HostListDefinition', 'SearchHelper', 'PaginateHelper', 'ListGenerator', 'AuthService', 'HostsHelper', 'InventoryHelper', 'RelatedSearchHelper','RelatedPaginateHelper', @@ -460,49 +460,194 @@ angular.module('HostsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'H }]) - .factory('LoadSearchTree', ['Rest', 'GetBasePath', 'ProcessErrors', '$compile', - function(Rest, GetBasePath, ProcessErrors, $compile) { + .factory('LoadSearchTree', ['Rest', 'GetBasePath', 'ProcessErrors', '$compile', '$rootScope', 'Wait', + function(Rest, GetBasePath, ProcessErrors, $compile, $rootScope, Wait) { return function(params) { var scope = params.scope; var inventory_id = params.inventory_id; - var newTree = []; - scope.searchTree = []; + var html = ''; + + function buildHTML(tree_data) { + html += (tree_data.length > 0) ? "<ul>\n" : ""; + for(var i=0; i < tree_data.length; i++) { + html += "<li id=\"search-node-1000\" data-state=\"opened\" data-hosts=\"" + tree_data[i].related.hosts + "\" " + + "data-description=\"" + tree_data[i].description + "\" " + + "data-failures=\"" + tree_data[i].has_active_failures + "\" " + + "data-groups=\"" + tree_data[i].related.groups + "\" " + + "data-name=\"" + tree_data[i].name + "\" " + + "data-group-id=\"" + tree_data[i].id + "\" " + + "><a href=\"\" class=\"expand\"><i class=\"icon-caret-down\"></i></a> " + + "<i class=\"field-badge icon-failures-" + tree_data[i].has_active_failures + "\"></i> " + + "<a href=\"\" class=\"activate\">" + tree_data[i].name + "</a> "; + if (tree_data[i].children.length > 0) { + buildHTML(tree_data[i].children); + } + else { + html += "</li>\n"; + } + } + html += "</ul>\n"; + } + + function refresh(parent) { + var group, title; + if (parent.attr('data-group-id')) { + group = parent.attr('data-group-id'); + title = parent.attr('data-name'); + //title += (parent.attr('data-description') !== "") ? '<p>' + parent.attr('data-description') + '</p>' : ''; + } + else { + group = null; + title = 'All Hosts' + } + // The following will trigger the host list to load. See Inventory.js controller. + scope.$emit('refreshHost', group, title); + } + + function activate(e) { + /* Set the clicked node as active */ + var elm = angular.element(e.target); //<a> + var parent = angular.element(e.target.parentNode); //<li> + $('.search-tree .active').removeClass('active'); + elm.addClass('active'); + refresh(parent); + } + + function toggle(e) { + var id, parent, elm, icon; + + if (e.target.tagName == 'I') { + id = e.target.parentNode.parentNode.attributes.id.value; + parent = angular.element(e.target.parentNode.parentNode); //<li> + elm = angular.element(e.target.parentNode); // <a> + } + else { + id = e.target.parentNode.attributes.id.value; + parent = angular.element(e.target.parentNode); + elm = angular.element(e.target); + } + + var sibling = angular.element(parent.children()[2]); // <a> + var state = parent.attr('data-state'); + var icon = angular.element(elm.children()[0]); + + if (state == 'closed') { + // expand the elment + var childlists = parent.find('ul'); + if (childlists && childlists.length > 0) { + // has childen + for (var i=0; i < childlists.length; i++) { + var listChild = angular.element(childlists[i]); + var listParent = angular.element(listChild.parent()); + if (listParent.attr('id') == id) { + angular.element(childlists[i]).removeClass('hidden'); + } + } + } + parent.attr('data-state','open'); + icon.removeClass('icon-caret-right').addClass('icon-caret-down'); + } + else { + // close the element + parent.attr('data-state','closed'); + icon.removeClass('icon-caret-down').addClass('icon-caret-right'); + var childlists = parent.find('ul'); + if (childlists && childlists.length > 0) { + // has childen + for (var i=0; i < childlists.length; i++) { + angular.element(childlists[i]).addClass('hidden'); + } + } + /* When the active node's parent is closed, activate the parent*/ + if ($(parent).find('.active').length > 0) { + $(parent).find('.active').removeClass('active'); + sibling.addClass('active'); + refresh(parent); + } + } + } + + // Responds to searchTreeReady, thrown from Hosts.js helper when the inventory tree + // is ready + if (scope.searchTreeReadyRemove) { + scope.searchTreeReadyRemove(); + } + scope.searchTreeReadyRemove = scope.$on('searchTreeReady', function(e, html) { + var container = angular.element(document.getElementById('search-tree-container')); + container.empty(); + var compiled = $compile(html)(scope); + container.append(compiled); + var links = container.find('a'); + for (var i=0; i < links.length; i++) { + var link = angular.element(links[i]); + if (link.hasClass('expand')) { + link.unbind('click', toggle); + link.bind('click', toggle); + } + if (link.hasClass('activate')) { + link.unbind('click', activate); + link.bind('click', activate); + } + } + Wait('stop'); + }); - // After the inventory is loaded, build an array of all unique groups found therein. - // The lis is used in the group drop-down selector widget for each host. if (scope.buildAllGroupsRemove) { scope.buildAllGroupsRemove(); } - scope.buildAllGroupsRemove = scope.$on('buildAllGroups', function(e, inventory_name) { - scope.inventory_groups = []; - Rest.setUrl(GetBasePath('inventory') + inventory_id + '/groups/?order_by=name'); + scope.buildAllGroupsRemove = scope.$on('buildAllGroups', function(e, inventory_name, inventory_tree) { + Rest.setUrl(inventory_tree); Rest.get() .success( function(data, status, headers, config) { - for (var i=0; i < data.results.length; i++) { - scope.inventory_groups.push({ name: data.results[i].name, id: data.results[i].id }); - } - scope.$emit('hostTabInit', inventory_name); + buildHTML(data); + scope.$emit('searchTreeReady', html + "</li>\n</ul>\n"); }) .error( function(data, status, headers, config) { ProcessErrors(scope, data, status, null, - { hdr: 'Error!', msg: 'Failed to get groups for inventory: ' + inventory_id + '. GET returned: ' + status }); + { hdr: 'Error!', msg: 'Failed to get inventory tree for: ' + inventory_id + '. GET returned: ' + status }); }); }); - + + if (scope.buildGroupListRemove) { + scope.buildGroupListRemove(); + } + scope.buildGroupListRemove = scope.$on('buildAllGroups', function(e, inventory_name, inventory_tree, groups_url) { + scope.inventory_groups = []; + Rest.setUrl(groups_url); + Rest.get() + .success( function(data, status, headers, config) { + for (var i=0; i < data.results.length; i++) { + scope.inventory_groups.push({ + id: data.results[i].id, + description: data.results[i].description, + name: data.results[i].name }); + } + }) + .error( function(data, status, headers, config) { + ProcessErrors(scope, data, status, null, + { hdr: 'Error!', msg: 'Failed to get groups for inventory: ' + inventory_id + '. GET returned: ' + status }); + }); + }); + + Wait('start'); + // Load the inventory root node Rest.setUrl (GetBasePath('inventory') + inventory_id + '/'); Rest.get() .success( function(data, status, headers, config) { - scope.searchTree.push({ - name: data.name, - description: data.description, - hosts: data.related.hosts, - failures: data.has_active_failures, - groups: data.related.root_groups, - children: [] - }); - scope.$emit('buildAllGroups', data.name); + html += "<div class=\"title\">Group Selector:</div>\n" + + "<ul class=\"tree-root\">\n" + + "<li id=\"search-node-1000\" data-state=\"opened\" data-hosts=\"" + data.related.hosts + "\" " + + "data-description=\"" + data.description + "\" " + + "data-failures=\"" + data.has_active_failures + "\" " + + "data-groups=\"" + data.related.groups + "\" " + + "data-name=\"" + data.name + "\" " + + "><a href=\"\" class=\"expand\"><i class=\"icon-caret-down\"></i></a> " + + "<i class=\"field-badge icon-failures-" + data.has_active_failures + "\"></i> " + + "<a href=\"\" class=\"activate active\">" + data.name + "</a>"; + scope.$emit('buildAllGroups', data.name, data.related.tree, data.related.groups); + scope.$emit('refreshHost', null, 'All Hosts'); }) .error( function(data, status, headers, config) { ProcessErrors(scope, data, status, null, diff --git a/awx/ui/static/less/ansible-ui.less b/awx/ui/static/less/ansible-ui.less index c4ec78ee25..106202c327 100644 --- a/awx/ui/static/less/ansible-ui.less +++ b/awx/ui/static/less/ansible-ui.less @@ -687,6 +687,8 @@ select.field-mini-height { } .search-tree { + + padding: 10px 3px 10px 3px; .title { color: @black; @@ -697,20 +699,24 @@ select.field-mini-height { ul { list-style-type: none; - padding-left: 13px; + padding-left: 16px; } - - ul:first-child { + + .tree-root { padding-left: 0; } - + + .activate { + word-break: break-all; + } + .activate:hover { background-color: #ddd; } .active { font-weight: bold; - padding: 5px; + padding: 5px 0 5px 0; } .expand { @@ -730,10 +736,10 @@ select.field-mini-height { } } - -.host-failure-filter { - padding: 10px; -} + + .host-failure-filter { + padding: 10px; + } .disabled { color: @grey; diff --git a/awx/ui/static/lib/ansible/directives.js b/awx/ui/static/lib/ansible/directives.js index 2bedf5bfb5..ed8760549d 100644 --- a/awx/ui/static/lib/ansible/directives.js +++ b/awx/ui/static/lib/ansible/directives.js @@ -344,258 +344,171 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService', 'Hos $(elm).spinner(opts); } } - }]) + }]); /* This has become more than a simple directive. All the logic for building the group selector tree on the Hosts tab is here. Probably needs to move into the Hosts helper and/or Inventory helper. */ - .directive('awTree', ['Rest', 'ProcessErrors', 'Authorization', '$compile', '$rootScope', 'Wait', - function(Rest, ProcessErrors, Authorization, $compile, $rootScope, Wait) { - return { - //require: 'ngModel', + // .directive('awTree', ['Rest', 'ProcessErrors', 'Authorization', '$compile', '$rootScope', 'Wait', + // function(Rest, ProcessErrors, Authorization, $compile, $rootScope, Wait) { + // return { + // //require: 'ngModel', - replace: true, + // replace: true, - transclude: true, + // transclude: true, - scope: { - treeData: '=awTree' - }, + // scope: { + // treeData: '=awTree' + // }, - replace: true, + // replace: true, - template: - "<div class=\"search-tree well\" id=\"search-tree-container\">\n" + - "<ul>\n" + - "<li id=\"search-node-1000\" data-state=\"closed\" data-hosts=\"{{ treeData[0].hosts}}\" " + - "data-hosts=\"{{ treeData[0].hosts }}\" " + - "data-description=\"{{ treeData[0].description }}\" " + - "data-failures=\"{{ treeData[0].failures }}\" " + - "data-groups=\"{{ treeData[0].groups }}\" " + - "data-name=\"{{ treeData[0].name }}\">" + - "<a href=\"\" class=\"expand\"><i class=\"icon-caret-right\"></i></a> <a href=\"\" class=\"activate active\">{{ treeData[0].name }}</a></li>\n" + - "</li>\n"+ - "</ul>\n" + - "</div>\n", + // template: + // "<div class=\"search-tree well\" id=\"search-tree-container\">\n" + + // "<ul>\n" + + // "<li id=\"search-node-1000\" data-state=\"closed\" data-hosts=\"{{ treeData[0].hosts}}\" " + + // "data-hosts=\"{{ treeData[0].hosts }}\" " + + // "data-description=\"{{ treeData[0].description }}\" " + + // "data-failures=\"{{ treeData[0].failures }}\" " + + // "data-groups=\"{{ treeData[0].groups }}\" " + + // "data-name=\"{{ treeData[0].name }}\">" + + // "<a href=\"\" class=\"expand\"><i class=\"icon-caret-right\"></i></a> <a href=\"\" class=\"activate active\">{{ treeData[0].name }}</a></li>\n" + + // "</li>\n"+ + // "</ul>\n" + + // "</div>\n", - link: function(scope, elm , attrs) { + // link: function(scope, elm , attrs) { - var idx=1000; + // var idx=1000; - function refresh(parent) { - var group, title; - if (parent.attr('data-group-id')) { - group = parent.attr('data-group-id'); - title = parent.attr('data-name'); - //title += (parent.attr('data-description') !== "") ? '<p>' + parent.attr('data-description') + '</p>' : ''; - } - else { - group = null; - title = 'All Hosts' - } - // The following will trigger the host list to load. See Inventory.js controller. - scope.$emit('refreshHost', group, title); - } + // function refresh(parent) { + // var group, title; + // if (parent.attr('data-group-id')) { + // group = parent.attr('data-group-id'); + // title = parent.attr('data-name'); + // //title += (parent.attr('data-description') !== "") ? '<p>' + parent.attr('data-description') + '</p>' : ''; + // } + // else { + // group = null; + // title = 'All Hosts' + // } + // // The following will trigger the host list to load. See Inventory.js controller. + // scope.$emit('refreshHost', group, title); + // } - function activate(e) { - /* Set the clicked node as active */ - var elm = angular.element(e.target); //<a> - var parent = angular.element(e.target.parentNode); //<li> - $('.search-tree .active').removeClass('active'); - elm.addClass('active'); - refresh(parent); - } + // function activate(e) { + // /* Set the clicked node as active */ + // var elm = angular.element(e.target); //<a> + // var parent = angular.element(e.target.parentNode); //<li> + // $('.search-tree .active').removeClass('active'); + // elm.addClass('active'); + // refresh(parent); + // } - function toggle(e) { + // function toggle(e) { - var id, parent, elm, icon; + // var id, parent, elm, icon; - if (e.target.tagName == 'I') { - id = e.target.parentNode.parentNode.attributes.id.value; - parent = angular.element(e.target.parentNode.parentNode); //<li> - elm = angular.element(e.target.parentNode); // <a> - } - else { - id = e.target.parentNode.attributes.id.value; - parent = angular.element(e.target.parentNode); - elm = angular.element(e.target); - } + // if (e.target.tagName == 'I') { + // id = e.target.parentNode.parentNode.attributes.id.value; + // parent = angular.element(e.target.parentNode.parentNode); //<li> + // elm = angular.element(e.target.parentNode); // <a> + // } + // else { + // id = e.target.parentNode.attributes.id.value; + // parent = angular.element(e.target.parentNode); + // elm = angular.element(e.target); + // } - var sibling = angular.element(parent.children()[2]); // <a> - var state = parent.attr('data-state'); - var icon = angular.element(elm.children()[0]); - - /* Open/close the node and expand */ - if (scope.childrenLoadedRemove) { - scope.childrenLoadedRemove(); - } - scope.childrenLoadedRemove = scope.$on('childrenLoaded', function() { - childlists = parent.find('ul'); //look for children - if (childlists && childlists.length > 0) { - // bind toggle() to click event of each link in the group we clicked on - var links = parent.find('a'); - for (var i=0; i < links.length; i++) { - var link = angular.element(links[i]); - if (link.hasClass('expand')) { - link.unbind('click', toggle); - link.bind('click', toggle); - } - if (link.hasClass('activate')) { - link.unbind('click', activate); - link.bind('click', activate); - } - } - toggle(e); - } - else { - icon.removeClass('icon-caret-right').addClass('icon-caret-down'); - parent.attr('data-state','open'); - //activate(e); - } - }); - + // var sibling = angular.element(parent.children()[2]); // <a> + // var state = parent.attr('data-state'); + // var icon = angular.element(elm.children()[0]); - if (state == 'closed') { - // expand the elment - var childlists = parent.find('ul'); - if (childlists && childlists.length > 0) { - // already has childen - for (var i=0; i < childlists.length; i++) { - var listChild = angular.element(childlists[i]); - var listParent = angular.element(listChild.parent()); - if (listParent.attr('id') == id) { - angular.element(childlists[i]).removeClass('hidden'); - } - // all the children should be in a closed state - var liList = listChild.find('li'); - for (var j=0; j < liList.length; j++) { - var thisList = angular.element(liList[j]); - var anchor = angular.element(thisList.find('a')[0]); - var thisIcon = angular.element(anchor.children()[0]); - thisIcon.removeClass('icon-caret-down').addClass('icon-caret-right'); - thisList.attr('data-state', 'closed'); - } - } - parent.attr('data-state','open'); - icon.removeClass('icon-caret-right').addClass('icon-caret-down'); - } - else { - getChildren(elm, parent, sibling); - } - } - else { - // close the element - parent.attr('data-state','closed'); - icon.removeClass('icon-caret-down').addClass('icon-caret-right'); - var childlists = parent.find('ul'); - if (childlists && childlists.length > 0) { - // has childen - for (var i=0; i < childlists.length; i++) { - angular.element(childlists[i]).addClass('hidden'); - } - } - /* When the active node's parent is closed, activate the parent*/ - if ($(parent).find('.active').length > 0) { - $(parent).find('.active').removeClass('active'); - sibling.addClass('active'); - refresh(parent); - } - } - } + // if (state == 'closed') { + // // expand the elment + // var childlists = parent.find('ul'); + // if (childlists && childlists.length > 0) { + // // has childen + // for (var i=0; i < childlists.length; i++) { + // var listChild = angular.element(childlists[i]); + // var listParent = angular.element(listChild.parent()); + // if (listParent.attr('id') == id) { + // angular.element(childlists[i]).removeClass('hidden'); + // } + // } + // } + // parent.attr('data-state','open'); + // icon.removeClass('icon-caret-right').addClass('icon-caret-down'); + // } + // else { + // // close the element + // parent.attr('data-state','closed'); + // icon.removeClass('icon-caret-down').addClass('icon-caret-right'); + // var childlists = parent.find('ul'); + // if (childlists && childlists.length > 0) { + // // has childen + // for (var i=0; i < childlists.length; i++) { + // angular.element(childlists[i]).addClass('hidden'); + // } + // } + // /* When the active node's parent is closed, activate the parent*/ + // if ($(parent).find('.active').length > 0) { + // $(parent).find('.active').removeClass('active'); + // sibling.addClass('active'); + // refresh(parent); + // } + // } + // } - function getChildren(elm, parent, sibling) { - var url = parent.attr('data-groups'); - var html = ''; - var token = Authorization.getToken(); - - url += ($rootScope.hostFailureFilter) ? '?has_active_failures=true&order_by=name' : '?order_by=name'; - - /* For reasons unknown calling Rest fails. It just dies with no errors - or any info */ - $.ajax({ - url: url, - headers: { 'Authorization': 'Token ' + token }, - dataType: 'json', - success: function(data) { - // build html and append to parent of clicked link - for (var i=0; i < data.results.length; i++) { - idx++; - html += "<li "; - html += "id=\"search-tree-" + idx +"\" "; - html += "date-state=\"closed\" "; - html += "data-hosts=\"" + data.results[i].related.all_hosts + "\" "; - html += "data-description=\"" + data.results[i].description + "\" "; - html += "data-failures=\"" + data.results[i].has_active_failures + "\" "; - html += "data-groups=\"" + data.results[i].related.children + "\" "; - html += "data-name=\"" + data.results[i].name + "\" "; - html += "data-group-id=\"" + data.results[i].id + "\">"; - html += "<a href=\"\" class=\"expand\"><i class=\"icon-caret-right\"></i></a> "; - html += "<i class=\"field-badge icon-failures-" + data.results[i].has_active_failures + "\"></i>"; - html += " <a href=\"\" class=\"activate\">" + data.results[i].name + "</a> "; - html += "</li>\n"; - } - html = (html !== '') ? "<ul>" + html + "</ul>\n" : ""; - var compiled = $compile(html)(scope); - parent.append(compiled); //append the new list to the parent <li> - if (!scope.$$phase) { - scope.$digest(); - } - scope.$emit('childrenLoaded'); - }, - error: function(data, status) { - Wait('stop'); - ProcessErrors(scope, data, status, null, - { hdr: 'Error!', msg: 'Failed to get child groups for ' + elm.attr('name') + - '. GET returned: ' + status }); - } - }); - } - - function initialize() { - var root = angular.element(document.getElementById('search-node-1000')); - var toggleElm = angular.element(root.find('a')[0]); - var activateElm = angular.element(root.find('a')[1]) - toggleElm.bind('click', toggle); - activateElm.bind('click', activate); - } + // function initialize() { + // var root = angular.element(document.getElementById('search-node-1000')); + // var toggleElm = angular.element(root.find('a')[0]); + // var activateElm = angular.element(root.find('a')[1]) + // toggleElm.bind('click', toggle); + // activateElm.bind('click', activate); + // } - // Responds to hostTabInit event, thrown from Hosts.js helper. Once the initial - // inventory node is loaded, force the root level groups to load and populate the - // host list with All Hosts. - if ($rootScope.hostTabInitRemove) { - $rootScope.hostTabInitRemove(); - } - $rootScope.hostTabInitRemove = $rootScope.$on('hostTabInit', function(e) { - Wait('start'); - var container = angular.element(document.getElementById('search-tree-container')); - container.empty(); - var html = "<div class=\"title\">Group Selector:</div>\n" + - "<ul>\n" + - "<li id=\"search-node-1000\" data-state=\"closed\" data-hosts=\"{{ treeData[0].hosts}}\" " + - "data-hosts=\"{{ treeData[0].hosts }}\" " + - "data-description=\"{{ treeData[0].description }}\" " + - "data-failures=\"{{ treeData[0].failures }}\" " + - "data-groups=\"{{ treeData[0].groups }}\" " + - "data-name=\"{{ treeData[0].name }}\" " + - "><a href=\"\" class=\"expand\"><i class=\"icon-caret-right\"></i></a> " + - "<i class=\"field-badge \{\{ 'icon-failures-' + treeData[0].failures \}\}\"></i> " + - "<a href=\"\" class=\"activate active\">{{ treeData[0].name }}</a> " + - "</li>\n" + - "</ul>\n"; - var compiled = $compile(html)(scope); - container.append(compiled); - initialize(); - // Expand the root node and show All Hosts - setTimeout(function() { - $('#search-node-1000 .expand').click(); - $('#search-node-1000 .activate').click(); - Wait('stop'); - }, 500); - }); + // // Responds to searchTreeReady, thrown from Hosts.js helper when the inventory tree + // // is ready + // if ($rootScope.hostTabInitRemove) { + // $rootScope.hostTabInitRemove(); + // } + // $rootScope.hostTabInitRemove = $rootScope.$on('searchTreeReady', function(e, html) { + // Wait('start'); + // var container = angular.element(document.getElementById('search-tree-container')); + // container.empty(); + // var compiled = $compile(html)(scope); + // container.append(compiled); + + // var links = container.find('a'); + // for (var i=0; i < links.length; i++) { + // var link = angular.element(links[i]); + // if (link.hasClass('expand')) { + // link.unbind('click', toggle); + // link.bind('click', toggle); + // } + // if (link.hasClass('activate')) { + // link.unbind('click', activate); + // link.bind('click', activate); + // } + // } + - } - } - }]); + // Wait('stop'); + + // //initialize(); + // // Expand the root node and show All Hosts + // //setTimeout(function() { + // // $('#search-node-1000 .expand').click(); + // // $('#search-node-1000 .activate').click(); + // // Wait('stop'); + // // }, 500); + // }); + + // } + // } + // }]); diff --git a/awx/ui/static/lib/ansible/form-generator.js b/awx/ui/static/lib/ansible/form-generator.js index b138f6480a..cfb8412f47 100644 --- a/awx/ui/static/lib/ansible/form-generator.js +++ b/awx/ui/static/lib/ansible/form-generator.js @@ -941,7 +941,8 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies']) // build the hosts page html += "<div class=\"row\">\n"; html += "<div class=\"col-lg-3\" id=\"search-tree-target\">\n"; - html += "<div aw-tree=\"searchTree\"></div>\n"; + //html += "<div aw-tree=\"searchTree\"></div>\n"; + html += "<div class=\"search-tree well\" id=\"search-tree-container\">\n</div>\n"; html += "</div>\n"; html += "<div class=\"col-lg-9\">\n"; html += "<div class=\"hosts-well well\">\n"; @@ -978,8 +979,8 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies']) // "data-placement=\"top\"></th>\n"; for (var fld in form.fields) { - html += "<th class=\"list-header\" id=\"" + form.iterator + '-' + fld + "-header\" "; - html += (!form.fields[fld].nosort) ? "ng-click=\"sort('" + form.iterator + "', '" + fld + "')\"" : ""; + html += "<th class=\"list-header\" id=\"" + fld + "-header\" "; + html += (!form.fields[fld].nosort) ? "ng-click=\"sort('"+ fld + "')\"" : ""; html += ">"; html += (form['fields'][fld].label && form['fields'][fld].type !== 'DropDown') ? form['fields'][fld].label : ''; if (form.fields[fld].nosort == undefined || form.fields[fld].nosort == false) { |