Cleanup of 'loading' and 'no records matching your search'. Removed 'group' from group host status messages. Fixed conflict between group edit and host edit dialogs that caused variable editor to sometimes not display on host edit.

awx/ui/static/js/helpers/Groups.js

@@ -789,6 +789,11 @@ function($compile, SchedulerInit, Rest, Wait, SetSchedulesInnerDialogSize, Sched
                     if (sources_scope.codeMirror) {
                         sources_scope.codeMirror.destroy();
                     }
+                    $('#properties-tab').empty();
+                    $('#sources-tab').empty();
+                    $('#schedules-list').empty();
+                    $('#schedules-form').empty();
+                    $('#schedules-detail').empty();
                     $('#group-modal-dialog').hide();
                     $('#group-modal-dialog').dialog('destroy');
                     modal_scope.cancelModal();
@@ -1265,45 +1270,149 @@ function($compile, SchedulerInit, Rest, Wait, SetSchedulesInnerDialogSize, Sched
 
 
 .factory('GroupsDelete', ['$rootScope', '$location', '$log', '$routeParams', 'Rest', 'Alert', 'GroupForm', 'GenerateForm',
-    'Prompt', 'ProcessErrors', 'GetBasePath', 'Wait', 'BuildTree', 'Find',
+    'Prompt', 'ProcessErrors', 'GetBasePath', 'Wait', 'BuildTree', 'Find', 'CreateDialog',
     function ($rootScope, $location, $log, $routeParams, Rest, Alert, GroupForm, GenerateForm, Prompt, ProcessErrors,
-        GetBasePath, Wait, BuildTree, Find) {
+        GetBasePath, Wait, BuildTree, Find, CreateDialog) {
         return function (params) {
             // Delete the selected group node. Disassociates it from its parent.
 
             var scope = params.scope,
                 tree_id = params.tree_id,
-                inventory_id = params.inventory_id,
                 node = Find({ list: scope.groups, key: 'id', val: tree_id }),
-                url = GetBasePath('inventory') + inventory_id + '/groups/',
+                hosts = [],
-                action_to_take;
+                groups = [],
+                childCount = 0,
+                buttonSet;
 
-            action_to_take = function () {
+            // action_to_take = function () {
-                $('#prompt-modal').on('hidden.bs.modal', function () {
+            //     $('#prompt-modal').on('hidden.bs.modal', function () {
-                    Wait('start');
+            //         Wait('start');
+            //     });
+            //     $('#prompt-modal').modal('hide');
+            //     Rest.setUrl(url);
+            //     Rest.post({ id: node.group_id, disassociate: 1 })
+            //         .success(function () {
+            //             $('#prompt-modal').modal('hide');
+            //             scope.$emit('GroupDeleteCompleted'); // Signal a group refresh to start
+            //         })
+            //         .error(function (data, status) {
+            //             Wait('stop');
+            //             ProcessErrors(scope, data, status, null, {
+            //                 hdr: 'Error!',
+            //                 msg: 'Call to ' + url + ' failed. POST returned status: ' + status
+            //             });
+            //         });
+            // };
+
+            scope.deleteOption = "preserve-all";
+
+            buttonSet = [{
+                label: "Cancel",
+                onClick: function() {
+                    scope.cancel();
+                },
+                icon: "fa-times",
+                "class": "btn btn-default",
+                "id": "group-delete-cancel-button"
+            },{
+                label: "Continue",
+                onClick: function() {
+                    scope.performDelete();
+                },
+                icon: "fa-check",
+                "class": "btn btn-primary",
+                "id": "group-delete-ok-button"
+            }];
+
+            if (scope.removeDeleteDialogReady) {
+                scope.removeDeleteDialogReady();
+            }
+            scope.removeDeleteDialogReady = scope.$on('DeleteDialogReady', function() {
+                Wait('stop');
+                $('#group-delete-dialog').dialog('open');
+            });
+
+            if (scope.removeShowDeleteDialog) {
+                scope.removeShowDeleteDialog();
+            }
+            scope.removeShowDeleteDialog = scope.$on('ShowDeleteDialog', function() {
+                scope.group_name = node.name;
+                scope.groupsCount = groups.length;
+                scope.hostsCount = hosts.length;
+                CreateDialog({
+                    id: 'group-delete-dialog',
+                    scope: scope,
+                    buttons: buttonSet,
+                    width: 650,
+                    height: 350,
+                    minWidth: 500,
+                    title: 'Delete Group',
+                    callback: 'DeleteDialogReady'
                 });
-                $('#prompt-modal').modal('hide');
+            });
-                Rest.setUrl(url);
+
-                Rest.post({ id: node.group_id, disassociate: 1 })
+            if (scope.removeChildrenReady) {
-                    .success(function () {
+                scope.removeChildrenReady();
-                        $('#prompt-modal').modal('hide');
+            }
-                        scope.$emit('GroupDeleteCompleted'); // Signal a group refresh to start
+            scope.removeChildrenReady = scope.$on('ChildrenReady', function() {
+                childCount++;
+                if (childCount === 2) {
+                    scope.$emit('ShowDeleteDialog');
+                }
+            });
+
+            Wait('start');
+
+            if (node.related.children) {
+                Rest.setUrl(node.related.children);
+                Rest.get()
+                    .success(function(data) {
+                        if (data.count) {
+                            data.results.forEach(function(group) {
+                                groups.push(group);
+                            });
+                        }
+                        scope.$emit('ChildrenReady');
                     })
-                    .error(function (data, status) {
+                    .error(function(data, status) {
-                        Wait('stop');
+                        ProcessErrors(scope, data, status, null, { hdr: 'Error!',
-                        ProcessErrors(scope, data, status, null, {
+                            msg: 'Failed to retrieve related groups. GET returned: ' + status
-                            hdr: 'Error!',
-                            msg: 'Call to ' + url + ' failed. POST returned status: ' + status
                         });
                     });
+            }
+            else {
+                scope.$emit('ChildrenReady');
+            }
+
+            if (node.related.all_hosts) {
+                Rest.setUrl(node.related.all_hosts);
+                Rest.get()
+                    .success( function(data) {
+                        if (data.count) {
+                            data.results.forEach(function(host) {
+                                hosts.push(host);
+                            });
+                        }
+                        scope.$emit('ChildrenReady');
+                    })
+                    .error( function(data, status) {
+                        ProcessErrors(scope, data, status, null, { hdr: 'Error!',
+                            msg: 'Failed to retrieve related hosts. GET returned: ' + status
+                        });
+                    });
+            }
+            else {
+                scope.$emit('ChildrenReady');
+            }
+
+            scope.cancel = function() {
+                $('#group-delete-dialog').dialog('close');
+            };
+
+            scope.performDelete = function() {
+                $('#group-delete-dialog').dialog('close');
             };
 
-            Prompt({
-                hdr: 'Delete Group',
-                body: '<div class=\"alert alert-info\">Are you sure you want to delete group <em>' + node.name + '?</div>',
-                action: action_to_take,
-                'class': 'btn-danger'
-            });
         };
     }
 ])

awx/ui/static/js/helpers/Hosts.js

@@ -498,17 +498,16 @@ function($rootScope, $location, $log, $routeParams, Rest, Alert, HostForm, Gener
                     formId: 'host_form'
                 });
             },
+            beforeDestroy: function() {
+                if (scope.codeMirror) {
+                    scope.codeMirror.destroy();
+                }
+                $('#host-modal-dialog').empty();
+            },
             onOpen: function() {
                 $('#host_name').focus();
-                setTimeout(function() {
+            },
-                    TextareaResize({
+            callback: 'HostEditDialogReady'
-                        scope: scope,
-                        textareaId: 'host_variables',
-                        modalId: 'host-modal-dialog',
-                        formId: 'host_form'
-                    });
-                }, 300);
-            }
         });
         
         scope.parseType = 'yaml';
@@ -517,9 +516,17 @@ function($rootScope, $location, $log, $routeParams, Rest, Alert, HostForm, Gener
             scope.hostVariablesLoadedRemove();
         }
         scope.hostVariablesLoadedRemove = scope.$on('hostVariablesLoaded', function() {
-            var callback = function() { Wait('stop'); };
             $('#host-modal-dialog').dialog('open');
-            ParseTypeChange({ scope: scope, field_id: 'host_variables', onReady: callback });
+            setTimeout(function() {
+                TextareaResize({
+                    scope: scope,
+                    textareaId: 'host_variables',
+                    modalId: 'host-modal-dialog',
+                    formId: 'host_form',
+                    parse: true
+                });
+            }, 300);
+            //ParseTypeChange({ scope: scope, field_id: 'host_variables', onReady: callback });
         });
 
         if (scope.hostLoadedRemove) {

awx/ui/static/js/helpers/refresh.js

@@ -26,6 +26,7 @@ angular.module('RefreshHelper', ['RestServices', 'Utilities', 'PaginationHelpers
                     iterator = params.iterator,
                     url = params.url;
                 
+                scope[iterator + 'Loading'] = true;
                 scope.current_url = url;
                 Rest.setUrl(url);
                 Rest.get()
@@ -38,13 +39,12 @@ angular.module('RefreshHelper', ['RestServices', 'Utilities', 'PaginationHelpers
                             previous: data.previous,
                             iterator: iterator
                         });
-                        scope[iterator + 'Loading'] = false;
                         for (i = 1; i <= 3; i++) {
                             modifier = (i === 1) ? '' : i;
                             scope[iterator + 'HoldInput' + modifier] = false;
                         }
                         scope[set] = data.results;
-                        //window.scrollTo(0, 0);
+                        scope[iterator + 'Loading'] = false;
                         Wait('stop');
                         scope.$emit('PostRefresh');
                     })

awx/ui/static/less/ansible-ui.less

@@ -942,9 +942,9 @@ input[type="checkbox"].checkbox-no-label {
 /* Table info rows */
 
 .loading-info {
-  color: @grey-txt; 
+    color: @grey-txt; 
-  font-weight: bold;
+    font-weight: normal;
-  padding: 15px 0;
+    padding: 15px 0;
 }
 
 /* Jobs pages */

awx/ui/static/lib/ansible/InventoryTree.js

@@ -116,10 +116,7 @@ angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper', 'P
                         event_level: level,
                         children: children,
                         ngicon: (sorted[i].children.length > 0) ? 'fa fa-minus-square-o node-toggle' : 'fa fa-square-o node-no-toggle',
-                        related: {
+                        related: sorted[i].related,
-                            children: (sorted[i].children.length > 0) ? sorted[i].related.children : '',
-                            inventory_source: sorted[i].related.inventory_source
-                        },
                         status: sorted[i].summary_fields.inventory_source.status,
                         status_class: stat['class'],
                         status_tooltip: stat.tooltip,

awx/ui/static/lib/ansible/Modal.js

@@ -26,6 +26,7 @@ angular.module('ModalDialog', ['Utilities', 'ParseHelper'])
      *     onResizeStop: - Function to call when user stops resizing the dialog, optional
      *     onClose:      - Function to call after window closes, optional
      *     onOpen:       - Function to call after window opens, optional
+     *     beforeDestroy: - Function to call during onClose and prior to destroying the window
      *     callback:     - String to pass to scope.$emit() after dialog is created, optional
      * })
      *
@@ -46,6 +47,7 @@ angular.module('ModalDialog', ['Utilities', 'ParseHelper'])
                 onClose = params.onClose,
                 onOpen = params.onOpen,
                 callback = params.callback,
+                beforeDestroy = params.beforeDestroy,
                 closeOnEscape = (params.closeOnEscape === undefined) ? false : params.closeOnEscape,
                 buttons,
                 id = params.id,
@@ -132,6 +134,9 @@ angular.module('ModalDialog', ['Utilities', 'ParseHelper'])
                         // remove lingering popover <div> elements
                         $(this).remove();
                     });
+                    if (beforeDestroy) {
+                        beforeDestroy();
+                    }
                     $('#' + id).dialog('destroy');
                     $('#' + id).hide();
                     if (onClose) {
@@ -161,6 +166,7 @@ angular.module('ModalDialog', ['Utilities', 'ParseHelper'])
      *     textareaId:      - id attribute value of the textarea
      *     modalId:         - id attribute of the <div> element used to create the modal
      *     formId:          - id attribute of the textarea's parent form
+     *     parse:           - if true, call ParseTypeChange and replace textarea with codemirror editor
      *  })
      *
      *  Use to resize a textarea field contained on a modal. Has only been tested where the 

awx/ui/static/partials/inventory-edit.html

@@ -49,6 +49,59 @@
         </div>
 
         <div id="host-modal-dialog" style="display: none;" class="dialog-content"></div>
+        
+        <div id="group-delete-dialog" style="display: none;" class="dialog-content">
+            <div ng-show="groupsCount > 0 || hostsCount > 0">
+                <div class="alert alert-info">
+                    <p>Deleting group <em>{{ group_name }}</em>.
+                    <span ng-show="groupsCount > 0 && hostsCount > 0"> This group has {{ groupsCount }} child groups and {{ hostsCount }} child hosts. </span>
+                    <span ng-show="groupsCount == 0 && hostsCount > 0"> This group has {{ hostsCount }} child hosts. </span>
+                    <span ng-show="groupsCopunt > 0 && hostsCount == 0"> This group has {{ groupsCount }} child groups. </span>
+                    Delete or preserve the group's children?</p>
+                    <div style="width: 50%; margin: 15px auto;">
+                        
+                        <div class="radio" ng-show="groupsCount > 0 && hostsCount > 0">
+                            <label>
+                                <input type="radio" ng-model="deleteOption" name="delete_option1" value="preserve-all"> Preserve child groups and hosts
+                            </label>
+                        </div>
+                        <div class="radio" ng-show="groupsCount > 0 && hostsCount > 0">
+                            <label>
+                                <input type="radio" ng-model="deleteOption" name="delete_option1" value="delete-all"> Delete child groups and hosts
+                            </label>
+                        </div>
+
+                        <div class="radio" ng-show="groupsCount > 0 && hostsCount == 0">
+                            <label>
+                                <input type="radio" ng-model="deleteOption" name="delete_option2" value="preserve-all"> Preserve child groups
+                            </label>
+                        </div>
+                        <div class="radio" ng-show="groupsCount > 0 && hostsCount == 0">
+                            <label>
+                                <input type="radio" ng-model="deleteOption" name="delete_option2" value="delete-all"> Delete child groups
+                            </label>
+                        </div>
+
+                        <div class="radio" ng-show="groupsCount == 0 && hostsCount > 0">
+                            <label>
+                                <input type="radio" ng-model="deleteOption" name="delete_option3" value="preserve-all"> Preserve child hosts
+                            </label>
+                        </div>
+                        <div class="radio" ng-show="groupsCount == 0 && hostsCount > 0">
+                            <label>
+                                <input type="radio" ng-model="deleteOption" name="delete_option3" value="delete-all"> Delete child hosts
+                            </label>
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+            <div ng-show="groupsCount == 0 && hostsCount == 0">
+                <div class=\"alert alert-info">Delete group <em>{{ group_name }}</em>?</div> 
+            </div> 
+        </div>
+        
         <div ng-include="'/static/partials/logviewer.html'"></div>
+    
     </div>
 </div>