Tree drop-down menu now works. Right clicking node and selecting menu option now fires modal dialogs. Using same code as buttons near top-right corner of tree. Clean-up code for deleting a node. It now correctly inspects parenet of selected node and uses either /inventory/N/groups or /groups/N/children to POST the disassociate request.

ansibleworks/ui/static/js/controllers/Inventories.js

@@ -315,7 +315,7 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
           return {
               addGroup: {
                   label: 'Add Group',
-                  action: function() { changePath($location.path() + '/groups'); }
+                  action: function(obj) { GroupsList({ "inventory_id": id, group_id: null }); }
                   }
               }
       }
@@ -323,11 +323,7 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
          return {
              addGroup: { 
                 label: 'Add Subgroup',
-                action: function(obj) { 
+                action: function(obj) { GroupsList({ "inventory_id": id, group_id: $(obj).attr('group_id') }); }    
-                    LoadBreadCrumbs({ path: '/groups/' + $(obj).attr('group_id'), title: $(obj).attr('name') });
-                    changePath($location.path() + '/groups/' + $(obj).attr('group_id') + '/children');    
-                    },
-                "_disabled": (nodeType == 'all-hosts-group') ? true : false
                 },
              /*addHost: { 
                 label: 'Add Host',
@@ -339,41 +335,12 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
                    },*/
              edit: { 
                  label: 'Edit Group',
-                 action: function(obj) { changePath($location.path() + '/groups/' + $(obj).attr('group_id')); },
+                 action: function(obj) { GroupsEdit({ "inventory_id": id, group_id: $(obj).attr('group_id') }); },
-                 separator_before: true,
+                 separator_before: true
-                 "_disabled": (nodeType == 'all-hosts-group') ? true : false
                  },
              delete: {
                  label: 'Delete Group',
-                 action: function(obj) { 
+                 action: function(obj) { GroupsDelete({ scope: scope, "inventory_id": id, group_id: $(obj).attr('group_id') }) }
-                     var action_to_take = function() {
-                         var url = defaultUrl + $routeParams.id + '/groups/';
-                         Rest.setUrl(url);
-                         Rest.post({ id: $(obj).attr('id'), disassociate: 1 })
-                             .success( function(data, status, headers, config) {
-                                 $('#prompt-modal').modal('hide');
-                                 $('#tree-view').jstree("delete_node",obj);
-                                 })
-                             .error( function(data, status, headers, config) {
-                                 $('#prompt-modal').modal('hide');
-                                 ProcessErrors(scope, data, status, null,
-                                          { hdr: 'Error!', msg: 'Call to ' + url + ' failed. DELETE returned status: ' + status });
-                                 });      
-                         };
-                     //Force binds to work. Not working usual way.
-                     var parent = $.jstree._reference('#tree-view')._get_parent(obj);
-                     $('#prompt-header').text('Delete Group');
-                     $('#prompt-body').text('Are you sure you want to remove group ' + $(obj).attr('name') + 
-                         ' from ' + $(parent).attr('name') + '?');
-                     $('#prompt-action-btn').addClass('btn-danger');
-                     scope.promptAction = action_to_take;  // for some reason this binds?
-                     $('#prompt-modal').modal({
-                         backdrop: 'static',
-                         keyboard: true,
-                         show: true
-                         });
-                     },
-                 "_disabled": (nodeType == 'all-hosts-group') ? true : false
                  }
              }
       }
@@ -427,7 +394,7 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
       }
 
   scope.deleteGroup = function() {
-      GroupsDelete({ scope: scope });
+      GroupsDelete({ scope: scope, "inventory_id": id, group_id: scope.group_id });
       }
 }
 

ansibleworks/ui/static/js/helpers/Groups.js

@@ -65,6 +65,10 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
         PaginateInit({ scope: scope, list: list, url: defaultUrl });
         scope.search(list.iterator);
 
+        if (!scope.$$phase) {
+           scope.$digest();
+        }
+
         scope.formModalAction = function() {
            var url = (group_id) ? GetBasePath('groups') + group_id + '/children/' :
                GetBasePath('inventory') + inventory_id + '/groups/'; 
@@ -171,6 +175,10 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
         generator.reset();
         var master={};
 
+        if (!scope.$$phase) {
+           scope.$digest();
+        }
+
         // Save
         scope.formModalAction  = function() {
            try { 
@@ -300,6 +308,10 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
                     { hdr: 'Error!', msg: 'Failed to retrieve group: ' + id + '. GET status: ' + status });
                 });
        
+        if (!scope.$$phase) {
+           scope.$digest();
+        }
+        
         // Save changes to the parent
         scope.formModalAction = function() {
             try { 
@@ -358,12 +370,27 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
     function($rootScope, $location, $log, $routeParams, Rest, Alert, GroupForm, GenerateForm, Prompt, ProcessErrors,
         GetBasePath) {
     return function(params) {
+        // Delete the selected group node. Disassociates it from 
         var scope = params.scope;
-        var obj = $('#tree-view li[group_id="' + scope.group_id + '"]');
+        var group_id = params.group_id; 
+        var inventory_id = params.inventory_id; 
+        var obj = $('#tree-view li[group_id="' + group_id + '"]');
+        var parent = (obj.parent().last().prop('tagName') == 'LI') ? obj.parent().last() : obj.parent().parent().last();
+        //if (parent.length > 0) {
+        //   parent = parent.last();
+        //}
+        console.log(parent);
+        var url; 
+        
+        if (parent.attr('type') == 'group') {
+           url = GetBasePath('base') + 'groups/' + parent.attr('group_id') + '/children/';
+        }
+        else {
+           url = GetBasePath('inventory') + inventory_id + '/groups/';
+        }
         var action_to_take = function() {
-            var url = GetBasePath('inventory') + $routeParams.id + '/groups/';
             Rest.setUrl(url);
-            Rest.post({ id: scope.group_id, disassociate: 1 })
+            Rest.post({ id: group_id, disassociate: 1 })
                .success( function(data, status, headers, config) {
                    $('#prompt-modal').modal('hide');
                    $('#tree-view').jstree("delete_node",obj);
@@ -376,7 +403,6 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
                    });      
             };
         //Force binds to work. Not working usual way.
-        var parent = $.jstree._reference('#tree-view')._get_parent(obj);
         $('#prompt-header').text('Delete Group');
         $('#prompt-body').text('Are you sure you want to remove group ' + $(obj).attr('name') + 
            ' from ' + $(parent).attr('name') + '?');