External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-05-25 01:27:45 -02:30
Code Issues Packages Projects Releases Wiki Activity

Group add and edit now mostly work. The Add Group dialog now includes tabs and supports source. The tree is refrshed on load. Moved retrieval of update status info to InventoryTree.

Browse Source
This commit is contained in:
Chris Houseknecht
2013-12-30 09:45:30 +00:00
parent b25c96b0dd
commit f26956d2cc
8 changed files with 399 additions and 214 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
awx/ui/static/js/controllers/Inventories.js
View File

@@ -327,21 +327,15 @@ function InventoriesEdit ($scope, $location, $routeParams, GenerateList, ClearSc
$scope.inventory_id = $routeParams.inventory_id;
$scope.$on('searchTreeReady', function(e, inventory_name, groups) {
if ($scope.removeSearchTreeReady) {
$scope.removeSearchTreeReady();
}
$scope.removeSearchTreeReady = $scope.$on('searchTreeReady', function(e, inventory_name, groups) {
// After the tree data loads, generate the groups list
generator.inject(list, { mode: 'edit', id: 'groups-container', breadCrumbs: false, searchSize: 'col-lg-5' });
$scope.groups = groups;
$scope.inventory_name = inventory_name;
for (var i=0; i < $scope.groups.length; i++) {
var stat = UpdateStatusMsg({ status: $scope.groups[i].status });
$scope.groups[i].status_badge_class = stat['class'];
$scope.groups[i].status_badge_tooltip = stat['tooltip'];
$scope.groups[i].status = stat['status'];
}
InjectHosts({ scope: $scope, inventory_id: $scope.inventory_id });
Wait('stop');
});

12
awx/ui/static/js/forms/Groups.js
View File

@@ -47,7 +47,7 @@ angular.module('GroupFormDefinition', [])
rows: 10,
'default': '---',
dataTitle: 'Group Variables',
dataPlacement: 'left',
dataPlacement: 'right',
awPopOver: "<p>Variables defined here apply to all child groups and hosts.</p>" +
"<p>Enter variables using either JSON or YAML syntax. Use the " +
"radio button to toggle between the two.</p>" +
@@ -96,7 +96,7 @@ angular.module('GroupFormDefinition', [])
editRequired: false,
awMultiselect: 'source_region_choices',
dataTitle: 'Source Regions',
dataPlacement: 'left',
dataPlacement: 'right',
awPopOver: "<p>Click on the regions field to see a list of regions for your cloud provider. You can select multiple regions, " +
"or choose <em>All</em> to include all regions. AWX will only be updated with Hosts associated with the selected regions." +
"</p>",
@@ -113,7 +113,7 @@ angular.module('GroupFormDefinition', [])
'default': '---',
parseTypeName: 'envParseType',
dataTitle: 'Source Variables',
dataPlacement: 'left',
dataPlacement: 'right',
awPopOver: "<p>Override variables found in ec2.ini and used by the inventory update script. For a detailed description of these variables " +
"<a href=\"https://github.com/ansible/ansible/blob/devel/plugins/inventory/ec2.ini\" target=\"_blank\">" +
"view ec2.ini in the Ansible github repo.</a></p>" +
@@ -161,7 +161,7 @@ angular.module('GroupFormDefinition', [])
'remain untouched by the inventory update process.</p>',
dataTitle: 'Overwrite',
dataContainer: 'body',
dataPlacement: 'left',
dataPlacement: 'right',
labelClass: 'checkbox-options'
},
{
@@ -176,7 +176,7 @@ angular.module('GroupFormDefinition', [])
'those found on the external source.</p>',
dataTitle: 'Overwrite Variables',
dataContainer: 'body',
dataPlacement: 'left',
dataPlacement: 'right',
labelClass: 'checkbox-options'
},
{
@@ -190,7 +190,7 @@ angular.module('GroupFormDefinition', [])
'executing job tasks.</p>',
dataTitle: 'Update on Launch',
dataContainer: 'body',
dataPlacement: 'left',
dataPlacement: 'right',
labelClass: 'checkbox-options'
}
]

235
awx/ui/static/js/helpers/Groups.js
View File

@@ -12,7 +12,8 @@
angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', 'GroupListDefinition',
'SearchHelper', 'PaginateHelper', 'ListGenerator', 'AuthService', 'GroupsHelper',
'InventoryHelper', 'SelectionHelper', 'JobSubmissionHelper', 'RefreshHelper',
'PromptDialog', 'InventorySummaryHelpDefinition', 'CredentialsListDefinition'
'PromptDialog', 'InventorySummaryHelpDefinition', 'CredentialsListDefinition',
'InventoryTree'
])
.factory('GetSourceTypeOptions', [ 'Rest', 'ProcessErrors', 'GetBasePath', function(Rest, ProcessErrors, GetBasePath) {
@@ -586,13 +587,16 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
}])
.factory('GroupsAdd', ['$rootScope', '$location', '$log', '$routeParams', 'Rest', 'Alert', 'GroupForm', 'GenerateForm',
'Prompt', 'ProcessErrors', 'GetBasePath', 'ParseTypeChange', 'GroupsEdit', 'ClickNode', 'Wait',
'Prompt', 'ProcessErrors', 'GetBasePath', 'ParseTypeChange', 'GroupsEdit', 'ClickNode', 'Wait', 'GetChoices',
'GetSourceTypeOptions', 'CredentialList', 'LookUpInit', 'BuildTree',
function($rootScope, $location, $log, $routeParams, Rest, Alert, GroupForm, GenerateForm, Prompt, ProcessErrors,
GetBasePath, ParseTypeChange, GroupsEdit, ClickNode, Wait) {
GetBasePath, ParseTypeChange, GroupsEdit, ClickNode, Wait, GetChoices, GetSourceTypeOptions, CredentialList,
LookUpInit, BuildTree) {
return function(params) {
var inventory_id = params.inventory_id;
var group_id = (params.group_id !== undefined) ? params.group_id : null;
var inventory_scope = params.scope;
// Inject dynamic view
var defaultUrl = (group_id !== null) ? GetBasePath('groups') + group_id + '/children/' :
@@ -610,17 +614,117 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
$('#form-modal .btn-none').removeClass('btn-none').addClass('btn-success');
$('#form-modal').on('hidden.bs.modal', function () {
if (!groupCreated) {
ClickNode({ selector: '#' + scope['selectedNode'].attr('id') });
}
//if (!groupCreated) {
// ClickNode({ selector: '#' + scope['selectedNode'].attr('id') });
//}
});
generator.reset();
var master={};
if (!scope.$$phase) {
scope.$digest();
if (scope.removeSearchTreeReady) {
scope.removeSearchTreeReady();
}
scope.removeSearchTreeReady = scope.$on('searchTreeReady', function(e) {
Wait('stop');
$('#form-modal').modal('hide');
});
if (scope.removeSaveComplete) {
scope.removeSaveComplete();
}
scope.removeSaveComplete = scope.$on('SaveComplete', function(e, error) {
if (!error) {
scope.formModalActionDisabled = false;
scope.showGroupHelp = false; //get rid of the Hint
BuildTree({ scope: inventory_scope, inventory_id: inventory_id });
}
});
if (scope.removeFormSaveSuccess) {
scope.removeFormSaveSuccess();
}
scope.removeFormSaveSuccess = scope.$on('formSaveSuccess', function(e, group_id, url) {
// Source data gets stored separately from the group. Validate and store Source
// related fields, then call SaveComplete to wrap things up.
var parseError = false;
var saveError = false;
// Update the selector tree with new group name, descr
//SetNodeName({ scope: scope['selectedNode'], group_id: group_id,
// name: scope.name, description: scope.description });
if (scope.source.value !== null && scope.source.value !== '') {
var data = {
group: group_id,
source: scope['source'].value,
source_path: scope['source_path'],
credential: scope['credential'],
overwrite: scope['overwrite'],
overwrite_vars: scope['overwrite_vars'],
update_on_launch: scope['update_on_launch']
//update_interval: scope['update_interval'].value
};
// Create a string out of selected list of regions
var regions = $('#s2id_group_source_regions').select2("data");
var r = [];
for (var i=0; i < regions.length; i++) {
r.push(regions[i].id);
}
data['source_regions'] = r.join();
if (scope['source'].value == 'ec2') {
// for ec2, validate variable data
try {
if (scope.envParseType == 'json') {
var json_data = JSON.parse(scope.source_vars); //make sure JSON parses
}
else {
var json_data = jsyaml.load(scope.source_vars); //parse yaml
}
// Make sure our JSON is actually an object
if (typeof json_data !== 'object') {
throw "failed to return an object!";
}
// Send JSON as a string
if ($.isEmptyObject(json_data)) {
data.source_vars = "";
}
else {
data.source_vars = JSON.stringify(json_data, undefined, '\t');
}
}
catch(err) {
parseError = true;
scope.$emit('SaveComplete', true);
Alert("Error", "Error parsing extra variables. Parser returned: " + err);
}
}
if (!parseError) {
Rest.setUrl(url)
Rest.put(data)
.success( function(data, status, headers, config) {
scope.$emit('SaveComplete', false);
})
.error( function(data, status, headers, config) {
scope.$emit('SaveComplete', true);
ProcessErrors(scope, data, status, form,
{ hdr: 'Error!', msg: 'Failed to update group inventory source. PUT status: ' + status });
});
}
}
else {
// No source value
scope.$emit('SaveComplete', false);
}
});
// Save
scope.formModalAction = function() {
@@ -660,20 +764,7 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
Rest.setUrl(defaultUrl);
Rest.post(data)
.success( function(data, status, headers, config) {
Wait('stop');
groupCreated = true;
scope.formModalActionDisabled = false;
scope.showGroupHelp = false; //get rid of the Hint
$('#form-modal').modal('hide');
/*BuildTree({
scope: scope,
inventory_id: scope['inventory_id'],
emit_on_select: 'NodeSelect',
target_id: 'search-tree-container',
refresh: true,
moveable: true,
group_id: data.id
});*/
scope.$emit('formSaveSuccess', data.id, GetBasePath('inventory_sources') + data.id + '/');
})
.error( function(data, status, headers, config) {
Wait('stop');
@@ -689,21 +780,77 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
}
}
scope.sourceChange = function() {
if (scope['source'].value == 'rax') {
scope['source_region_choices'] = scope['rax_regions'];
//$('#s2id_group_source_regions').select2('data', []);
$('#s2id_group_source_regions').select2('data', [{ id: 'all', text: 'All' }]);
}
else if (scope['source'].value == 'ec2') {
scope['source_region_choices'] = scope['ec2_regions'];
//$('#s2id_group_source_regions').select2('data', []);
$('#s2id_group_source_regions').select2('data', [{ id: 'all', text: 'All' }]);
}
LookUpInit({
url: GetBasePath('credentials') +
'?cloud=true&kind=' + [ (scope.source.value == 'rax') ? 'rax' : 'aws' ],
scope: scope,
form: form,
list: CredentialList,
field: 'credential'
});
}
// Cancel
scope.formReset = function() {
// Defaults
generator.reset();
};
var choicesReady = 0;
if (scope.removeChoicesReady) {
scope.removeChoicesReady();
}
scope.removeChoicesReady = scope.$on('choicesReadyGroup', function() {
choicesReady++;
if (choicesReady == 2) {
Wait('stop');
}
});
// Load options for source regions
GetChoices({
scope: scope,
url: GetBasePath('inventory_sources'),
field: 'source_regions',
variable: 'rax_regions',
choice_name: 'rax_region_choices',
callback: 'choicesReadyGroup'
});
GetChoices({
scope: scope,
url: GetBasePath('inventory_sources'),
field: 'source_regions',
variable: 'ec2_regions',
choice_name: 'ec2_region_choices',
callback: 'choicesReadyGroup'
});
GetSourceTypeOptions({ scope: scope, variable: 'source_type_options' });
Wait('start');
}
}])
.factory('GroupsEdit', ['$rootScope', '$location', '$log', '$routeParams', 'Rest', 'Alert', 'GroupForm', 'GenerateForm',
'Prompt', 'ProcessErrors', 'GetBasePath', 'SetNodeName', 'ParseTypeChange', 'GetSourceTypeOptions', 'InventoryUpdate',
'GetUpdateIntervalOptions', 'ClickNode', 'LookUpInit', 'CredentialList', 'Empty', 'Wait', 'GetChoices',
'GetUpdateIntervalOptions', 'ClickNode', 'LookUpInit', 'CredentialList', 'Empty', 'Wait', 'GetChoices', 'UpdateGroup',
function($rootScope, $location, $log, $routeParams, Rest, Alert, GroupForm, GenerateForm, Prompt, ProcessErrors,
GetBasePath, SetNodeName, ParseTypeChange, GetSourceTypeOptions, InventoryUpdate, GetUpdateIntervalOptions, ClickNode,
LookUpInit, CredentialList, Empty, Wait, GetChoices) {
LookUpInit, CredentialList, Empty, Wait, GetChoices, UpdateGroup) {
return function(params) {
var group_id = params.group_id;
@@ -711,7 +858,9 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
var generator = GenerateForm;
var form = GroupForm;
var defaultUrl = GetBasePath('groups') + group_id + '/';
var groups_scope = params.scope;
//var scope =
var scope = generator.inject(form, { mode: 'edit', modal: true, related: false });
generator.reset();
@@ -751,9 +900,11 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
else {
scope.variables = jsyaml.safeDump(data);
}
Wait('stop');
})
.error( function(data, status, headers, config) {
scope.variables = null;
Wait('stop');
ProcessErrors(scope, data, status, form,
{ hdr: 'Error!', msg: 'Failed to retrieve group variables. GET returned status: ' + status });
});
@@ -833,7 +984,7 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
LookUpInit({
url: GetBasePath('credentials') +
'?cloud=true&kind=' + [(scope.source.value == 'rax') ? 'rax' : 'aws'],
'?cloud=true&kind=' + (scope.source.value == 'rax') ? 'rax' : 'aws',
scope: scope,
form: form,
list: CredentialList,
@@ -862,12 +1013,12 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
// If empty, default to all
master['source_regions'] = [{ id: 'all', text: 'All' }];
}
scope['group_update_url'] = data.related['update'];
Wait('stop');
})
.error( function(data, status, headers, config) {
scope.source = "";
Wait('stop');
ProcessErrors(scope, data, status, form,
{ hdr: 'Error!', msg: 'Failed to retrieve inventory source. GET status: ' + status });
});
@@ -936,19 +1087,29 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
callback: 'choicesReadyGroup'
});
if (!scope.$$phase) {
scope.$digest();
}
Wait('start');
//if (!scope.$$phase) {
// scope.$digest();
//}
if (scope.removeSaveComplete) {
scope.removeSaveComplete();
}
scope.removeSaveComplete = scope.$on('SaveComplete', function(e, error) {
if (!error) {
//scope['flashMessage'] = 'Your changes to ' + scope['name'] + ' were saved.';
//ClickNode({ selector: '#inventory-root-node' });
UpdateGroup({
scope: groups_scope,
group_id: group_id,
properties: {
name: scope.name,
description: scope.description,
has_inventory_sources: (scope.source) ? true : false
}
});
scope.formModalActionDisabled = false;
scope.showGroupHelp = false; //get rid of the Hint
Wait('stop');
$('#form-modal').modal('hide');
}
});
@@ -981,7 +1142,11 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
// Create a string out of selected list of regions
var regions = $('#s2id_group_source_regions').select2("data");
data['source_regions'] = regions.join();
var r = [];
for (var i=0; i < regions.length; i++) {
r.push(regions[i].id);
}
data['source_regions'] = r.join();
if (scope['source'].value == 'ec2') {
// for ec2, validate variable data
@@ -1055,12 +1220,12 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
for (var fld in form.fields) {
data[fld] = scope[fld];
}
data['inventory'] = inventory_id;
Rest.setUrl(defaultUrl);
Rest.put(data)
.success( function(data, status, headers, config) {
Wait('stop');
if (scope.variables) {
//update group variables
Rest.setUrl(scope.variable_url);
@@ -1106,7 +1271,7 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
}
LookUpInit({
url: GetBasePath('credentials') +
'?cloud=true&kind=' + [(scope.source.value == 'rax') ? 'rax' : 'aws'],
'?cloud=true&kind=' + (scope.source.value == 'rax') ? 'rax' : 'aws',
scope: scope,
form: form,
list: CredentialList,

2
awx/ui/static/less/ansible-ui.less
View File

@@ -882,7 +882,7 @@ input[type="checkbox"].checkbox-no-label {
}
.field-badge {
font-size: 14px;
font-size: 12px;
}
.license-warning,

33
awx/ui/static/lib/ansible/InventoryTree.js
View File

@@ -9,7 +9,7 @@
*
*/
angular.module('InventoryTree', ['Utilities', 'RestServices'])
angular.module('InventoryTree', ['Utilities', 'RestServices', 'GroupsHelper'])
.factory('SortNodes', [ function() {
return function(data) {
@@ -171,8 +171,8 @@ angular.module('InventoryTree', ['Utilities', 'RestServices'])
}
}])
.factory('BuildTree', ['Rest', 'GetBasePath', 'ProcessErrors', 'SortNodes', 'Wait',
function(Rest, GetBasePath, ProcessErrors, SortNodes, Wait) {
.factory('BuildTree', ['Rest', 'GetBasePath', 'ProcessErrors', 'SortNodes', 'Wait', 'UpdateStatusMsg',
function(Rest, GetBasePath, ProcessErrors, SortNodes, Wait, UpdateStatusMsg) {
return function(params) {
var inventory_id = params.inventory_id;
@@ -185,6 +185,7 @@ angular.module('InventoryTree', ['Utilities', 'RestServices'])
var sorted = SortNodes(tree_data);
for (var i=0; i < sorted.length; i++) {
var currentId= id;
var stat = UpdateStatusMsg({ status: sorted[i].status });
var group = {
name: sorted[i].name,
has_active_failures: sorted[i].has_active_failures,
@@ -194,12 +195,15 @@ angular.module('InventoryTree', ['Utilities', 'RestServices'])
groups_with_active_failures: sorted[i].groups_with_active_failures,
parent: parent,
has_children: (sorted[i].children.length > 0) ? true : false,
has_inventory_sources: sorted[i].has_inventory_sources,
id: id,
group_id: sorted[i].id,
event_level: level,
ngicon: (sorted[i].children.length > 0) ? 'icon-collapse-alt' : null,
related: { children: (sorted[i].children.length > 0) ? sorted[i].related.children : '' },
status: sorted[i].summary_fields.inventory_source.status
status: sorted[i].summary_fields.inventory_source.status,
status_badge_class: stat['class'],
status_badge_tooltip: stat['tooltip']
}
groups.push(group);
id++;
@@ -244,10 +248,29 @@ angular.module('InventoryTree', ['Utilities', 'RestServices'])
}
loadTreeData();
}
}])
// Update a group with a set of properties
.factory('UpdateGroup', [ function() {
return function(params) {
var scope = params.scope;
var group_id = params.group_id;
var properties = params.properties; // object of key:value pairs to update
for (var i=0; i < scope.groups.length; i++) {
if (scope.groups[i].group_id == group_id) {
var grp = scope.groups[i];
for (var p in properties) {
scope.groups[i][p] = properties[p];
}
}
}
}
}])
// Set node name and description after an update to Group properties.
.factory('SetNodeName', [ function() {
return function(params) {

4
awx/ui/static/lib/ansible/Utilities.js
View File

@@ -129,6 +129,10 @@ angular.module('Utilities',['RestServices', 'Utilities'])
else if (form) {
var fieldErrors = false;
for (var field in form.fields ) {
if (data[field] && form.fields[field].tab) {
// If the form is part of a tab group, activate the tab
$('#' + form.name + "_tabs a[href=\"#" + form.fields[field].tab + '"]').tab('show');
}
if (form.fields[field].realName) {
if (data[form.fields[field].realName]) {
scope[field + '_api_error'] = data[form.fields[field]][0];

2
awx/ui/static/lib/ansible/form-generator.js
View File

@@ -1240,7 +1240,7 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies', 'Utilities'])
html += "</div>\n";
}
else if (this.form.tabs) {
html += "<ul class=\"nav nav-tabs\">\n";
html += "<ul id=\"" + this.form.name + "_tabs\" class=\"nav nav-tabs\">\n";
for (var i=0; i < this.form.tabs.length; i++) {
var tab = this.form.tabs[i];
html += "<li";

1
awx/ui/templates/ui/index.html
View File

@@ -72,7 +72,6 @@
<script src="{{ STATIC_URL }}js/forms/ProjectStatus.js"></script>
<script src="{{ STATIC_URL }}js/forms/Permissions.js"></script>
<script src="{{ STATIC_URL }}js/forms/JobEventData.js"></script>
<script src="{{ STATIC_URL }}js/forms/License.js"></script>
<script src="{{ STATIC_URL }}js/forms/HostGroups.js"></script>
<script src="{{ STATIC_URL }}js/forms/InventoryStatus.js"></script>
<script src="{{ STATIC_URL }}js/forms/ActivityDetail.js"></script>