AC-369 Inventories->Groups page now loads from /api/v1/inventories/N/trees. All nodes are open on load. Drag-n-drop works. Node add/update/delete working.

awx/ui/static/js/controllers/Groups.js

@@ -8,11 +8,9 @@
  */
 
 function InventoryGroups ($scope, $rootScope, $compile, $location, $log, $routeParams, InventoryGroupsForm,
-                          GenerateForm, Rest, Alert, ProcessErrors, LoadBreadCrumbs, RelatedSearchInit, 
+                          GenerateForm, Rest, Alert, ProcessErrors, LoadBreadCrumbs, ReturnToCaller, ClearScope, Prompt,
-                          RelatedPaginateInit, ReturnToCaller, ClearScope, LookUpInit, Prompt,
+                          TreeInit, GetBasePath, GroupsList, GroupsAdd, GroupsEdit, LoadInventory,
-                          OrganizationList, TreeInit, GetBasePath, GroupsList, GroupsAdd, GroupsEdit, LoadInventory,
+                          GroupsDelete, RefreshGroupName, EditInventory) 
-                          GroupsDelete, HostsList, HostsAdd, HostsEdit, HostsDelete, RefreshGroupName, ParseTypeChange,
-                          HostsReload, EditInventory, RefreshTree, LoadSearchTree, EditHostGroups) 
 {
    ClearScope('htmlTemplate');  //Garbage collection. Don't leave behind any listeners/watchers from the prior
                                 //scope.
@@ -38,7 +36,7 @@ function InventoryGroups ($scope, $rootScope, $compile, $location, $log, $routeP
        }
        });
 
-   LoadInventory({ scope: scope, doPostSteps: true });
+   LoadInventory({ scope: scope, doPostSteps: false });
 
    scope.treeController = function($node) {
 
@@ -185,10 +183,8 @@ function InventoryGroups ($scope, $rootScope, $compile, $location, $log, $routeP
 }
 
 InventoryGroups.$inject = [ '$scope', '$rootScope', '$compile', '$location', '$log', '$routeParams', 'InventoryGroupsForm',
-                            'GenerateForm', 'Rest', 'Alert', 'ProcessErrors', 'LoadBreadCrumbs', 'RelatedSearchInit', 
+                            'GenerateForm', 'Rest', 'Alert', 'ProcessErrors', 'LoadBreadCrumbs', 'ReturnToCaller', 'ClearScope', 'Prompt',
-                            'RelatedPaginateInit', 'ReturnToCaller', 'ClearScope', 'LookUpInit', 'Prompt',
+                            'TreeInit', 'GetBasePath', 'GroupsList', 'GroupsAdd', 'GroupsEdit', 'LoadInventory',
-                            'OrganizationList', 'TreeInit', 'GetBasePath', 'GroupsList', 'GroupsAdd', 'GroupsEdit', 'LoadInventory',
+                            'GroupsDelete', 'RefreshGroupName', 'EditInventory'
-                            'GroupsDelete', 'HostsList', 'HostsAdd', 'HostsEdit', 'HostsDelete', 'RefreshGroupName',
-                            'ParseTypeChange', 'HostsReload', 'EditInventory', 'RefreshTree', 'LoadSearchTree', 'EditHostGroups'
                             ]; 
   

awx/ui/static/js/helpers/inventory.js

@@ -31,6 +31,7 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
         var treeData = [];
 
         // Ater inventory top-level hosts, load top-level groups
+        /*
         if (scope.inventoryLoadedRemove) {
             scope.inventoryLoadedRemove();
         }
@@ -67,6 +68,7 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
                     Alert('Error', 'Failed to laod tree data. Url: ' + groups + ' GET status: ' + status);
                     });
             });
+          */
 
           treeData =
               [{ 
@@ -78,7 +80,6 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
                   id: 'inventory-node',
                   url: inventory_url,
                   'inventory_id': inventory_id,
-                  hosts: hosts,
                   name: inventory_name,
                   description: inventory_descr,
                   "data-failures": inventory.has_active_failures
@@ -86,7 +87,43 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
               state: 'open',
               children:[] 
               }];
-          scope.$emit('inventoryLoaded');
+          
+          function addNodes(tree, data) {
+              for (var i=0; i < data.length; i++) {
+                  tree.children.push({
+                      data: {
+                          title: data[i].name
+                          },
+                      attr: {
+                          id: idx,
+                          group_id: data[i].id,
+                          type: 'group',
+                          name: data[i].name, 
+                          description: data[i].description,
+                          "data-failures": data[i].has_active_failures,
+                          inventory: data[i].inventory
+                          },
+                      state: 'open',
+                      children:[]
+                      });
+                  idx++;
+                  if (data[i].children.length > 0) {
+                     var node = tree.children.length - 1;
+                     addNodes(tree.children[node], data[i].children);
+                  }
+              }
+          }
+
+          Rest.setUrl(scope.treeData); 
+          Rest.get()
+              .success( function(data, status, headers, config) { 
+                  addNodes(treeData[0], data);
+                  scope.$emit('buildTree', treeData, idx);  
+              })
+              .error( function(data, status, headers, config) {
+                  ProcessErrors(scope, data, status, form,
+                      { hdr: 'Error!', msg: 'Failed to retrieve inventory tree data. GET returned status: ' + status });
+              });
 
         }
         }])
@@ -127,7 +164,8 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
                     "select_limit": 1 
                     },
                 "json_data": {
-                    data: treeData,
+                    data: treeData
+                    /*,
                     ajax: {
                         url: function(node){
                             scope.selected_node = node;
@@ -161,6 +199,7 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
                             return response;
                             }
                         }
+                        */
                     },
                 "dnd": { },
                 "crrm": { 
@@ -354,6 +393,7 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
                 scope.TreeParams = { scope: scope, inventory: data };
                 scope.variable_url = data.related.variable_data;
                 scope.relatedSets['hosts'] = { url: data.related.hosts, iterator: 'host' };
+                scope.treeData = data.related.tree;
 
                 // Load the tree view
                 if (params.doPostSteps) {

awx/ui/static/js/lists/Inventories.js

@@ -63,7 +63,7 @@ angular.module('InventoriesListDefinition', [])
             hosts: {
                 label: 'Hosts',
                 ngClick: "editHosts(\{\{ inventory.id \}\})",
-                icon: 'icon-th-large',
+                icon: 'icon-laptop',
                 "class": 'btn-xs btn-default',
                 awToolTip: 'Edit Hosts'
                 },
@@ -71,7 +71,7 @@ angular.module('InventoriesListDefinition', [])
             groups: {
                 label: 'Groups',
                 ngClick: "editGroups(\{\{ inventory.id \}\})",
-                icon: 'icon-group',
+                icon: 'icon-sitemap',
                 "class": 'btn-xs btn-default',
                 awToolTip: 'Edit Groups'
                 },

awx/ui/static/lib/ansible/form-generator.js

@@ -1022,7 +1022,7 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
                  html += "<td>";
                  html += "<div class=\"input-group input-group-sm\">\n";
                  html += "<span class=\"input-group-btn\">\n";
-                 html += "<button class=\"btn btn-default\" type=\"button\" ng-click=\"editHostGroups({{ host.id }})\"><i class=\"icon-list\"></i></button>\n";
+                 html += "<button class=\"btn btn-default\" type=\"button\" ng-click=\"editHostGroups({{ host.id }})\"><i class=\"icon-sitemap\"></i></button>\n";
                  html += "</span>\n";
                  html += "<input type=\"text\" ng-model=\"host.groups\" class=\"form-control\" disabled=\"disabled\" >\n";
                  html += "</div>\n";