AC-331 Group drag-n-drop starting to work.

This commit is contained in:
chouseknecht 2013-08-09 21:31:32 -04:00
parent 8794da7cd1
commit 7199194a8c
8 changed files with 83 additions and 86 deletions

View File

@ -213,34 +213,6 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
scope.createButtonShow = false;
scope.search(scope.relatedSets['hosts'].iterator);
TreeInit(scope.TreeParams);
LookUpInit({
scope: scope,
form: form,
current_item: (scope.organization !== undefined) ? scope.organization : null,
list: OrganizationList,
field: 'organization'
});
if (scope.variable_url) {
Rest.setUrl(scope.variable_url);
Rest.get()
.success( function(data, status, headers, config) {
if ($.isEmptyObject(data)) {
scope.inventory_variables = "---";
}
else {
scope.inventory_variables = jsyaml.safeDump(data);
}
})
.error( function(data, status, headers, config) {
scope.inventory_variables = null;
ProcessErrors(scope, data, status, form,
{ hdr: 'Error!', msg: 'Failed to retrieve inventory variables. GET returned status: ' + status });
});
}
else {
scope.inventory_variables = "---";
}
});
LoadInventory({ scope: scope, doPostSteps: true });
@ -405,18 +377,8 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
}
else {
return {
addGroup: {
label: 'Add Group',
action: function(obj) {
scope.group_id = $(obj).attr('group_id');
if (!scope.$$phase) {
scope.$digest();
}
GroupsList({ "inventory_id": id, group_id: $(obj).attr('group_id') });
}
},
edit: {
label: 'Edit Group',
label: 'Group Properties',
action: function(obj) {
scope.group_id = $(obj).attr('group_id');
if (!scope.$$phase) {
@ -426,6 +388,29 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
},
separator_before: true
},
addGroup: {
label: 'Add Existing',
action: function(obj) {
scope.group_id = $(obj).attr('group_id');
if (!scope.$$phase) {
scope.$digest();
}
GroupsList({ "inventory_id": id, group_id: $(obj).attr('group_id') });
}
},
createGroup: {
label: 'Create New',
action: function(obj) {
scope.group_id = $(obj).attr('group_id');
if (!scope.$$phase) {
scope.$digest();
}
GroupsAdd({ "inventory_id": id, group_id: $(obj).attr('group_id') });
}
},
"delete": {
label: 'Delete Group',
action: function(obj) {
@ -447,19 +432,20 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
var node = $('li[id="' + n.attr.id + '"]');
var type = node.attr('type');
var url;
scope['selectedNode'] = node;
scope['selectedNodeName'] = node.attr('name');
$('#tree-view').jstree('open_node',node);
if (type == 'group') {
url = node.attr('all');
scope.groupAddHide = false;
scope.groupCreateHide = false;
scope.groupEditHide =false;
scope.inventoryEditHide=true;
scope.groupDeleteHide = false;
scope.createButtonShow = true;
scope.addGroupTitle = 'Add Group';
scope.group_id = node.attr('group_id');
scope.groupName = n.data;
scope.groupTitle = '<h4>' + n.data + '</h4>';
@ -467,11 +453,11 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
}
else if (type == 'inventory') {
url = node.attr('hosts');
scope.groupAddHide = false;
scope.groupAddHide = true;
scope.groupCreateHide = false;
scope.groupEditHide =true;
scope.inventoryEditHide=false;
scope.groupDeleteHide = true;
scope.addGroupTitle = 'Create Group';
scope.createButtonShow = false;
scope.groupName = 'All Hosts';
scope.groupTitle = '<h4>All Hosts</h4>';
@ -487,12 +473,11 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
});
scope.addGroup = function() {
if (scope.group_id == null) {
GroupsAdd({ "inventory_id": id, group_id: null });
}
else {
GroupsList({ "inventory_id": id, group_id: scope.group_id });
}
scope.createGroup = function() {
GroupsAdd({ "inventory_id": id, group_id: scope.group_id });
}
scope.editGroup = function() {

View File

@ -70,12 +70,6 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
scope.removeModalClosed = scope.$on('modalClosed', function() {
RefreshTree({ scope: scope });
});
scope.createGroup = function() {
$('#form-modal').modal('hide');
GroupsAdd({ inventory_id: inventory_id, group_id: group_id });
}
}
}])
@ -102,13 +96,13 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
scope.parseType = 'yaml';
ParseTypeChange(scope);
$('#form-modal').on('hidden.bs.modal', function() {
var me = $(this);
$('.modal-backdrop').each(function(index) {
$(this).remove();
});
me.unbind('hidden.bs.modal');
});
//$('#form-modal').on('hidden.bs.modal', function() {
// var me = $(this);
// $('.modal-backdrop').each(function(index) {
// $(this).remove();
// });
// me.unbind('hidden.bs.modal');
// });
$('#form-modal .btn-none').removeClass('btn-none').addClass('btn-success');
@ -374,8 +368,8 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
Rest.post({ id: group_id, disassociate: 1 })
.success( function(data, status, headers, config) {
$('#prompt-modal').modal('hide');
scope.selectedNode = scope.selectedNode.parent().parent();
RefreshTree({ scope: scope });
//$('#tree-view').jstree("delete_node",obj);
})
.error( function(data, status, headers, config) {
$('#prompt-modal').modal('hide');

View File

@ -121,14 +121,17 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
scope.buildTreeRemove = scope.$on('buildTree', function(e, treeData, index) {
var idx = index;
$(tree_id).jstree({
"core": { "initially_open":['inventory-node'] },
"plugins": ['themes', 'json_data', 'ui', 'contextmenu'],
"core": { "initially_open":['inventory_node'] },
"plugins": ['themes', 'json_data', 'ui', 'contextmenu', 'dnd', 'crrm'],
"themes": {
"theme": "ansible",
"dots": false,
"icons": true
},
"ui": { "initially_select": [ 'inventory-node' ]},
"ui": {
"initially_select": [ 'inventory-node' ],
"select_limit": 1
},
"json_data": {
data: treeData,
ajax: {
@ -166,6 +169,8 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
}
}
},
"dnd": { },
"crrm": { },
"contextmenu": {
items: scope.treeController
}
@ -174,12 +179,21 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
$(tree_id).bind("loaded.jstree", function () {
scope.$emit('treeLoaded');
});
$(tree_id).bind('move_node.jstree', function(e, data) {
if (data.rslt.o[0].id !== 'inventory_id') {
console.log('group_id: ' + $('#tree-view li[id="' + data.rslt.o[0].id+ '"]').attr('group_id'));
}
else {
console.log('id: ' + data.rslt.o[0].id);
}
});
// When user clicks on a group, display the related hosts in the list view
$(tree_id).bind("select_node.jstree", function(e, data){
//selected node object: data.inst.get_json()[0];
//selected node text: data.inst.get_json()[0].data
scope.$emit('NodeSelect',data.inst.get_json()[0]);
scope.$emit('NodeSelect', data.inst.get_json()[0]);
});
});
@ -272,6 +286,7 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
// Opens the list in reverse so that nodes open in parent then child order,
// drilling down to the last selected node.
var id, node;
if (openId.length > 0) {
id = openId.pop();
node = $('#tree-view li[id="' + id + '"]');
@ -280,11 +295,13 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
else {
if (selectedId !== null && selectedId !== undefined) {
// Click on the previously selected node
$('#tree-view li[id="' + selectedId + '"] a').first().click();
}
node = $('#tree-view li[id="' + selectedId + '"]');
$('#tree-view').jstree('select_node', node);
//$('#tree-view li[id="' + selectedId + '"] a').first().click();
}
}
});
if (scope.inventoryLoadedRemove) {
scope.inventoryLoadedRemove();
}
@ -302,10 +319,9 @@ angular.module('InventoryHelper', [ 'RestServices', 'Utilities', 'OrganizationLi
selectedId = scope.selectedNode.attr('id');
findOpenNodes(scope.selectedNode);
$('#tree-view').jstree('destroy');
TreeInit(scope.TreeParams);
TreeInit(scope.TreeParams);
});
LoadInventory({ scope: scope });
LoadInventory({ scope: scope, doPostSteps: true });
}
}])

View File

@ -28,18 +28,9 @@ angular.module('GroupListDefinition', [])
},
actions: {
add: {
label: 'Create New Group',
icon: 'icon-plus',
mode: 'all', // One of: edit, select, all
ngClick: 'createGroup()',
"class": 'btn-success btn-mini',
awToolTip: 'Create a new group'
},
help: {
awPopOver: "Select groups by clicking on each group you wish to add. Add the selected groups to your inventory " +
"or to the selected parent group by clicking the <em>Select</em> button. You can also create a new group by clicking the " +
"<em>Create New Group</em> button.",
"or to the selected parent group by clicking the <em>Select</em> button.",
dataPlacement: 'left',
dataContainer: '#form-modal .modal-content',
icon: "icon-question-sign",

View File

@ -114,7 +114,7 @@ hr {
.main-menu .nav > li > a:hover,
.main-menu .nav > li > a:focus {
color: #2078be;
color: @blue;
}
/* Using inline-block rather than block keeps
@ -531,6 +531,9 @@ input[type="text"].job-successful {
color: @black;
cursor: default;
}
.nav a {
color: @blue-link;
}
}
.inventory-title {

View File

@ -919,11 +919,13 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
html += "<li><a href=\"\" ng-click=\"editInventory()\" ng-hide=\"inventoryEditHide\" " +
"aw-tool-tip=\"Edit inventory properties\" data-placement=\"bottom\"><i class=\"icon-edit\"></i> Inventory Properties</a></li>\n";
html += "<li><a href=\"\" ng-click=\"editGroup()\" ng-hide=\"groupEditHide\" " +
"aw-tool-tip=\"Edit the selected group\" data-placement=\"bottom\"><i class=\"icon-edit\"></i> Edit Group</a></li>\n";
"aw-tool-tip=\"Edit the selected group\" data-placement=\"bottom\"><i class=\"icon-edit\"></i> Group Properties</a></li>\n";
html += "<li><a href=\"\" ng-click=\"addGroup()\" ng-hide=\"groupAddHide\" " +
"aw-tool-tip=\"Add a new group\" data-placement=\"bottom\"><i class=\"icon-plus\"></i> \{\{ addGroupTitle \}\}</a></li>\n";
"aw-tool-tip=\"Add an existing group\" data-placement=\"bottom\"><i class=\"icon-check\"></i> Add Existing</a></li>\n";
html += "<li><a href=\"\" ng-click=\"createGroup()\" ng-hide=\"groupCreateHide\" " +
"aw-tool-tip=\"Create a new group\" data-placement=\"bottom\"><i class=\"icon-plus\"></i> Create New</a></li>\n";
html += "<li><a href=\"\" ng-click=\"deleteGroup()\" ng-hide=\"groupDeleteHide\" " +
"aw-tool-tip=\"Delete the group\" data-placement=\"bottom\"><i class=\"icon-trash\"></i> Delete Group</a></li>\n";
"aw-tool-tip=\"Delete the selected group\" data-placement=\"bottom\"><i class=\"icon-trash\"></i> Delete Group</a></li>\n";
html += "</ul>\n";
html += "</div><!-- navbar -->\n";
html += "<div id=\"tree-view\" class=\"tree-container\"></div>\n";

File diff suppressed because one or more lines are too long

View File

@ -339,7 +339,7 @@
</div>
</div><!-- site footer -->
<script src="{{ STATIC_URL }}lib/jquery/jquery-1.9.1.min.js"></script>
<script src="{{ STATIC_URL }}lib/jquery/jquery-1.10.2.min.js"></script>
<script src="{{ STATIC_URL }}lib/jquery/jquery-ui-1.10.3.custom.min.js"></script>
<script src="{{ STATIC_URL }}lib/twitter/bootstrap.min.js"></script>
<script src="{{ STATIC_URL }}lib/jstree/jquery.jstree.js"></script>