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

Latest UI changes, fixes and enhancements.

Browse Source
This commit is contained in:
chouseknecht
2013-10-10 03:40:30 -04:00
parent 2f135f99d4
commit 43aca1972a
23 changed files with 180 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
awx/ui/static/js/controllers/Groups.js
View File

@@ -125,6 +125,7 @@ function InventoryGroups ($scope, $rootScope, $compile, $location, $log, $routeP
// Respond to user clicking on a tree node // Respond to user clicking on a tree node
var node = $('li[id="' + n.attr.id + '"]'); var node = $('li[id="' + n.attr.id + '"]');
var parent = node.parent().parent();
var type = node.attr('type'); var type = node.attr('type');
var url; var url;
@@ -153,6 +154,18 @@ function InventoryGroups ($scope, $rootScope, $compile, $location, $log, $routeP
scope.createButtonShow = true; scope.createButtonShow = true;
scope.group_id = node.attr('group_id'); scope.group_id = node.attr('group_id');
scope.addGroupHelp = "Copy an existing group into " + node.attr('name');
scope.createGroupHelp = "Create a new group, adding it to " + node.attr('name');
scope.updateGroupHelp = "Start the inventory update process, refreshing " + node.attr('name');
if (parent.attr('id') == 'inventory-node') {
scope.deleteGroupHelp = "Remove " + node.attr('name') + " from " + parent.attr('name') +
" Inventory. Any hosts will still be available in All Hosts.";
}
else {
scope.deleteGroupHelp = "Remove " + node.attr('name') + " from " + parent.attr('name') +
". Any hosts will still be available in " + parent.attr('name') + " and All Hosts.";
}
// Load the form // Load the form
GroupsEdit({ "inventory_id": id, group_id: scope.group_id }); GroupsEdit({ "inventory_id": id, group_id: scope.group_id });

3
awx/ui/static/js/controllers/JobEvents.js
View File

@@ -187,7 +187,8 @@ function JobEventsList ($scope, $rootScope, $location, $log, $routeParams, Rest,
.success( function(data, status, headers, config) { .success( function(data, status, headers, config) {
scope.job_status = data.status; scope.job_status = data.status;
scope.job_name = data.summary_fields.job_template.name; scope.job_name = data.summary_fields.job_template.name;
LoadBreadCrumbs({ path: '/jobs/' + scope.job_id, title: scope.job_name }); //LoadBreadCrumbs({ path: '/jobs/' + scope.job_id, title: scope.job_name });
LoadBreadCrumbs({ path: '/jobs/' + scope.job_id, title: scope.job_id + ' - ' + data.summary_fields.job_template.name });
if (!(data.status == 'pending' || data.status == 'waiting' || data.status == 'running')) { if (!(data.status == 'pending' || data.status == 'waiting' || data.status == 'running')) {
if ($rootScope.timer) { if ($rootScope.timer) {
clearInterval($rootScope.timer); clearInterval($rootScope.timer);

3
awx/ui/static/js/controllers/JobHosts.js
View File

@@ -97,7 +97,8 @@ function JobHostSummaryList ($scope, $rootScope, $location, $log, $routeParams,
LoadBreadCrumbs({ path: '/hosts/' + scope['host_id'], title: $routeParams['host_name'] }); LoadBreadCrumbs({ path: '/hosts/' + scope['host_id'], title: $routeParams['host_name'] });
} }
else { else {
LoadBreadCrumbs(); LoadBreadCrumbs({ path: '/jobs/' + scope.job_id, title: scope.job_id + ' - ' +
scope.jobhosts[0].summary_fields.job.job_template_name });
} }
}); });

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

@@ -11,14 +11,57 @@ angular.module('GroupFormDefinition', [])
'GroupForm', { 'GroupForm', {
addTitle: 'Create Group', //Legend in add mode addTitle: 'Create Group', //Legend in add mode
editTitle: 'Group Properties: {{ name }}', //Legend in edit mode editTitle: '{{ name }}', //Legend in edit mode
showTitle: true, showTitle: true,
cancelButton: false, cancelButton: false,
name: 'group', //Form name attribute name: 'group', //Form name attribute
well: false, //Wrap the form with TB well well: true, //Wrap the form with TB well
formLabelSize: 'col-lg-3', formLabelSize: 'col-lg-3',
formFieldSize: 'col-lg-9', formFieldSize: 'col-lg-9',
titleActions: {
copy_action: {
'class': 'btn-success btn-xs',
ngClick: "addGroup()",
ngHide: "groupAddHide",
awToolTip: "\{\{ addGroupHelp \}\}",
dataPlacement: 'top',
ngDisabled: "grpBtnDisable",
icon: "icon-check",
label: 'Copy'
},
create_action: {
'class': 'btn-success btn-xs',
ngClick: "createGroup()",
ngHide: "groupCreateHide",
awToolTip: "\{\{ createGroupHelp \}\}",
dataPlacement: "top",
ngDisabled: "grpBtnDisable",
icon: "icon-plus",
label: "Create New"
},
update_action: {
'class': 'btn-success btn-xs',
ngClick: "updateGroup()",
ngHide: "groupUpdateHide",
awToolTip: "\{\{ updateGroupHelp \}\}",
dataPlacement: "top",
ngDisabled: "grpBtnDisable",
icon: "icon-cloud-download",
label: 'Update'
},
delete_action: {
'class': "btn-danger btn-xs",
ngClick: "deleteGroup()",
ngHide: "groupDeleteHide",
awToolTip: "\{\{ deleteGroupHelp \}\}",
dataPlacement: "top",
ngDisabled: "grpBtnDisable",
icon: "icon-trash",
label: "Delete"
}
},
fields: { fields: {
name: { name: {
label: 'Name', label: 'Name',

4
awx/ui/static/js/forms/InventoryHosts.js
View File

@@ -77,7 +77,7 @@ angular.module('InventoryHostsFormDefinition', [])
ngHide: "hostAddHide", ngHide: "hostAddHide",
awToolTip: "Copy an existing host to the selected group", awToolTip: "Copy an existing host to the selected group",
dataPlacement: 'bottom', dataPlacement: 'bottom',
'class': 'btn-sm btn-success', 'class': 'btn-xs btn-success',
icon: 'icon-check' icon: 'icon-check'
}, },
create: { create: {
@@ -86,7 +86,7 @@ angular.module('InventoryHostsFormDefinition', [])
ngHide: 'hostCreateHide', ngHide: 'hostCreateHide',
awToolTip: 'Create a new host and add it to the selected group', awToolTip: 'Create a new host and add it to the selected group',
dataPlacement: 'bottom', dataPlacement: 'bottom',
'class': 'btn-sm btn-success', 'class': 'btn-xs btn-success',
icon: 'icon-plus' icon: 'icon-plus'
} }
}, },

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

@@ -189,8 +189,8 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
} }
scope.PostRefreshRemove = scope.$on('PostRefresh', function() { scope.PostRefreshRemove = scope.$on('PostRefresh', function() {
for (var i=0; i < scope.groups.length; i++) { for (var i=0; i < scope.groups.length; i++) {
var last_update = null var last_update = (scope.groups[i].summary_fields.inventory_source.last_updated == null) ? null :
//(scope.groups[i].last_updated == null) ? '' : FormatDate(new Date(scope.groups[i].last_updated)); FormatDate(new Date(scope.groups[i].summary_fields.inventory_source.last_updated));
var stat, stat_class, status_tip; var stat, stat_class, status_tip;
@@ -639,7 +639,7 @@ angular.module('GroupsHelper', [ 'RestServices', 'Utilities', 'ListGenerator', '
}) })
.error( function(data, status, headers, config) { .error( function(data, status, headers, config) {
ProcessErrors(scope, data, status, form, ProcessErrors(scope, data, status, form,
{ hdr: 'Error!', msg: 'Failed to retrieve group: ' + id + '. GET status: ' + status }); { hdr: 'Error!', msg: 'Failed to retrieve group: ' + defaultUrl + '. GET status: ' + status });
}); });
if (!scope.$$phase) { if (!scope.$$phase) {

34
awx/ui/static/js/helpers/JobSubmission.js
View File

@@ -59,7 +59,7 @@ angular.module('JobSubmissionHelper', [ 'RestServices', 'Utilities', 'Credential
cancel(); cancel();
} }
else { else {
scope.$emit('UpdateSubmitted'); scope.$emit('UpdateSubmitted','canceled');
} }
} }
@@ -77,7 +77,7 @@ angular.module('JobSubmissionHelper', [ 'RestServices', 'Utilities', 'Credential
Rest.setUrl(start_url); Rest.setUrl(start_url);
Rest.post(pswd) Rest.post(pswd)
.success( function(data, status, headers, config) { .success( function(data, status, headers, config) {
scope.$emit('UpdateSubmitted'); scope.$emit('UpdateSubmitted','started');
if (form.name == 'credential') { if (form.name == 'credential') {
navigate(false); navigate(false);
} }
@@ -292,7 +292,7 @@ angular.module('JobSubmissionHelper', [ 'RestServices', 'Utilities', 'Credential
if (scope.removeUpdateSubmitted) { if (scope.removeUpdateSubmitted) {
scope.removeUpdateSubmitted(); scope.removeUpdateSubmitted();
} }
scope.removeUpdateSubmitted = scope.$on('UpdateSubmitted', function() { scope.removeUpdateSubmitted = scope.$on('UpdateSubmitted', function(e, action) {
// Refresh the project list after update request submitted // Refresh the project list after update request submitted
scope.refresh(); scope.refresh();
}); });
@@ -376,17 +376,19 @@ angular.module('JobSubmissionHelper', [ 'RestServices', 'Utilities', 'Credential
if (scope.removeUpdateSubmitted) { if (scope.removeUpdateSubmitted) {
scope.removeUpdateSubmitted(); scope.removeUpdateSubmitted();
} }
scope.removeUpdateSubmitted = scope.$on('UpdateSubmitted', function() { scope.removeUpdateSubmitted = scope.$on('UpdateSubmitted', function(e, action) {
// Refresh the project list after update request submitted if (action == 'started') {
Alert('Update Started', 'The request to start the inventory process was submitted. Monitor progress from the inventory summary screen. ' + // Refresh the project list after update request submitted
'The screen will refresh every 10 seconds, or refresh manually by clicking the <em>Refresh</em> button.', 'alert-info'); Alert('Update Started', 'The request to start the inventory process was submitted. Monitor progress from the inventory summary screen. ' +
var node = $('#inventory-node') 'The screen will refresh every 10 seconds, or refresh manually by clicking the <em>Refresh</em> button.', 'alert-info');
var selected = $('#tree-view').jstree('get_selected'); var node = $('#inventory-node')
scope['inventorySummaryGroup'] = group_name; var selected = $('#tree-view').jstree('get_selected');
selected.each(function(idx) { scope['inventorySummaryGroup'] = group_name;
$('#tree-view').jstree('deselect_node', $(this)); selected.each(function(idx) {
}); $('#tree-view').jstree('deselect_node', $(this));
$('#tree-view').jstree('select_node', node); });
$('#tree-view').jstree('select_node', node);
}
}); });
if (scope.removeInventorySubmit) { if (scope.removeInventorySubmit) {
@@ -408,8 +410,8 @@ angular.module('JobSubmissionHelper', [ 'RestServices', 'Utilities', 'Credential
Rest.get() Rest.get()
.success( function(data, status, headers, config) { .success( function(data, status, headers, config) {
if (data.can_update) { if (data.can_update) {
var extra_html = "<div class=\"inventory-passwd-msg\">Starting inventory update for the <em>" + group_name + var extra_html = "<div class=\"inventory-passwd-msg\">Starting inventory update for <em>" + group_name +
"</em> group. Please provide the " + group_source + " credentials:</div>\n"; "</em>. Please provide the " + group_source + " credentials:</div>\n";
scope.$emit('InventorySubmit', data.passwords_needed_to_update, extra_html); scope.$emit('InventorySubmit', data.passwords_needed_to_update, extra_html);
} }
else { else {

2
awx/ui/static/js/lists/Credentials.js
View File

@@ -50,7 +50,7 @@ angular.module('CredentialsListDefinition', [])
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addCredential()', ngClick: 'addCredential()',
basePaths: ['teams','users'], // base path must be in list, or action not available basePaths: ['teams','users'], // base path must be in list, or action not available
"class": 'btn-success btn-sm', "class": 'btn-success btn-xs',
awToolTip: 'Create a new credential' awToolTip: 'Create a new credential'
} }
}, },

2
awx/ui/static/js/lists/Groups.js
View File

@@ -31,7 +31,7 @@ angular.module('GroupListDefinition', [])
help: { help: {
awPopOver: "Choose groups by clicking on each group you wish to add. Click the <em>Select</em> button to add the groups to " + awPopOver: "Choose groups by clicking on each group you wish to add. Click the <em>Select</em> button to add the groups to " +
"the selected inventory group.", "the selected inventory group.",
dataPlacement: 'left', dataPlacement: 'top',
dataContainer: '#form-modal .modal-content', dataContainer: '#form-modal .modal-content',
icon: "icon-question-sign", icon: "icon-question-sign",
mode: 'all', mode: 'all',

2
awx/ui/static/js/lists/Hosts.js
View File

@@ -31,7 +31,7 @@ angular.module('HostListDefinition', [])
actions: { actions: {
help: { help: {
awPopOver: "Select hosts by clicking on each host you wish to add. Add the selected hosts to the group by clicking the <em>Select</em> button.", awPopOver: "Select hosts by clicking on each host you wish to add. Add the selected hosts to the group by clicking the <em>Select</em> button.",
dataPlacement: 'left', dataPlacement: 'top',
dataContainer: '#form-modal .modal-content', dataContainer: '#form-modal .modal-content',
icon: "icon-question-sign", icon: "icon-question-sign",
mode: 'all', mode: 'all',

2
awx/ui/static/js/lists/Inventories.js
View File

@@ -79,7 +79,7 @@ angular.module('InventoriesListDefinition', [])
icon: 'icon-plus', icon: 'icon-plus',
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addInventory()', ngClick: 'addInventory()',
"class": 'btn-sm btn-success', "class": 'btn-xs btn-success',
awToolTip: 'Create a new inventory' awToolTip: 'Create a new inventory'
} }
}, },

29
awx/ui/static/js/lists/InventorySummary.js
View File

@@ -14,7 +14,7 @@ angular.module('InventorySummaryDefinition', [])
iterator: 'group', iterator: 'group',
editTitle: 'Inventory Summary: {{ inventory_name }}', editTitle: 'Inventory Summary: {{ inventory_name }}',
showTitle: true, showTitle: true,
well: false, well: true,
index: false, index: false,
hover: true, hover: true,
@@ -32,7 +32,7 @@ angular.module('InventorySummaryDefinition', [])
awToolTip: '# of hosts with job failures. Click to view hosts.', awToolTip: '# of hosts with job failures. Click to view hosts.',
dataPlacement: 'top', dataPlacement: 'top',
searchable: false, searchable: false,
nosort: true nosort: false
}, },
status: { status: {
label: 'Update<br>Status', label: 'Update<br>Status',
@@ -55,8 +55,10 @@ angular.module('InventorySummaryDefinition', [])
}, },
last_updated: { last_updated: {
label: 'Last<br>Updated', label: 'Last<br>Updated',
sourceModel: 'inventory_source',
sourceField: 'last_updated',
searchable: false, searchable: false,
nosort: true nosort: false
}, },
source: { source: {
label: 'Source', label: 'Source',
@@ -95,9 +97,16 @@ angular.module('InventorySummaryDefinition', [])
}, },
actions: { actions: {
refresh: { create: {
awRefresh: true, label: 'Create New',
mode: 'all' mode: 'all',
icon: 'icon-plus',
'class': "btn-success btn-xs",
ngClick: "createGroup()",
ngHide: "groupCreateHide",
ngDisabled: 'grpBtnDisabled',
awToolTip: "Create a new top-level group",
dataPlacement: 'top'
}, },
help: { help: {
awPopOver: awPopOver:
@@ -108,14 +117,18 @@ angular.module('InventorySummaryDefinition', [])
"<dt>successful</dt><dd>The most recent inventory update ran to completion without incident.</dd>\n" + "<dt>successful</dt><dd>The most recent inventory update ran to completion without incident.</dd>\n" +
"<dt>updating</dt><dd>The inventory update is currently running.</dd>\n" + "<dt>updating</dt><dd>The inventory update is currently running.</dd>\n" +
"</dl>\n", "</dl>\n",
dataPlacement: 'left', dataPlacement: 'top',
dataContainer: 'body', dataContainer: 'body',
icon: "icon-question-sign", icon: "icon-question-sign",
mode: 'all', mode: 'all',
'class': 'btn-xs btn-info btn-help pull-right', 'class': 'btn-xs btn-info btn-help',
awToolTip: 'Click for help', awToolTip: 'Click for help',
dataTitle: 'Update Status', dataTitle: 'Update Status',
iconSize: 'large' iconSize: 'large'
},
refresh: {
awRefresh: true,
mode: 'all'
} }
}, },

14
awx/ui/static/js/lists/JobHosts.js
View File

@@ -102,11 +102,6 @@ angular.module('JobHostDefinition', [])
}, },
actions: { actions: {
refresh: {
awRefresh: true,
ngShow: "host_id == null && (job_status == 'pending' || job_status == 'waiting' || job_status == 'running')",
mode: 'all'
},
help: { help: {
awPopOver: "<dl>\n<dt>Success</dt><dd>Tasks successfully executed on the host.</dd>\n" + awPopOver: "<dl>\n<dt>Success</dt><dd>Tasks successfully executed on the host.</dd>\n" +
"<dt>Changed</dt><dd>Actions taken on the host.</dd>\n" + "<dt>Changed</dt><dd>Actions taken on the host.</dd>\n" +
@@ -114,15 +109,20 @@ angular.module('JobHostDefinition', [])
"<dt>Unreachable</dt><dd>Times the ansible server could not reach the host.</dd>\n" + "<dt>Unreachable</dt><dd>Times the ansible server could not reach the host.</dd>\n" +
"<dt>Skipped</dt><dd>Tasks bypassed and not performed on the host due to prior task failure or the host being unreachable.</dd>\n" + "<dt>Skipped</dt><dd>Tasks bypassed and not performed on the host due to prior task failure or the host being unreachable.</dd>\n" +
"</dl>\n", "</dl>\n",
dataPlacement: 'left', dataPlacement: 'top',
dataContainer: "body", dataContainer: "body",
icon: "icon-question-sign", icon: "icon-question-sign",
mode: 'all', mode: 'all',
'class': 'btn-info btn-xs btn-help pull-right', 'class': 'btn-info btn-xs btn-help',
awToolTip: 'Click for help', awToolTip: 'Click for help',
dataTitle: 'Job Host Summary', dataTitle: 'Job Host Summary',
id: 'jobhost-help-button', id: 'jobhost-help-button',
iconSize: 'large' iconSize: 'large'
},
refresh: {
awRefresh: true,
ngShow: "host_id == null && (job_status == 'pending' || job_status == 'waiting' || job_status == 'running')",
mode: 'all'
} }
}, },

2
awx/ui/static/js/lists/JobTemplates.js
View File

@@ -34,7 +34,7 @@ angular.module('JobTemplatesListDefinition', [])
icon: 'icon-plus', icon: 'icon-plus',
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addJobTemplate()', ngClick: 'addJobTemplate()',
"class": 'btn-success btn-sm', "class": 'btn-success btn-xs',
basePaths: ['job_templates'], basePaths: ['job_templates'],
awToolTip: 'Create a new template' awToolTip: 'Create a new template'
} }

2
awx/ui/static/js/lists/Organizations.js
View File

@@ -33,7 +33,7 @@ angular.module('OrganizationListDefinition', [])
icon: 'icon-plus', icon: 'icon-plus',
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addOrganization()', ngClick: 'addOrganization()',
"class": 'btn-success btn-sm', "class": 'btn-success btn-xs',
awToolTip: 'Create a new organization' awToolTip: 'Create a new organization'
} }
}, },

2
awx/ui/static/js/lists/Permissions.js
View File

@@ -47,7 +47,7 @@ angular.module('PermissionListDefinition', [])
label: 'Create New', label: 'Create New',
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addPermission()', ngClick: 'addPermission()',
"class": 'btn-success btn-sm', "class": 'btn-success btn-xs',
awToolTip: 'Add a new permission', awToolTip: 'Add a new permission',
ngShow: 'PermissionAddAllowed' ngShow: 'PermissionAddAllowed'
} }

14
awx/ui/static/js/lists/Projects.js
View File

@@ -49,13 +49,9 @@ angular.module('ProjectsListDefinition', [])
icon: 'icon-plus', icon: 'icon-plus',
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addProject()', ngClick: 'addProject()',
"class": 'btn-success btn-sm', "class": 'btn-success btn-xs',
awToolTip: 'Create a new project' awToolTip: 'Create a new project'
}, },
refresh: {
awRefresh: true,
mode: 'all'
},
help: { help: {
awPopOver: "<dl>\n<dt>Updating</dt><dd>An SCM update is in progress.</dd>\n" + awPopOver: "<dl>\n<dt>Updating</dt><dd>An SCM update is in progress.</dd>\n" +
"<dt>Never Updated</dt><dd>No SCM update has ever run for the project.</dd>\n" + "<dt>Never Updated</dt><dd>No SCM update has ever run for the project.</dd>\n" +
@@ -64,14 +60,18 @@ angular.module('ProjectsListDefinition', [])
"<dt>Missing</dt><dd>The local project directory is missing.</dd>\n" + "<dt>Missing</dt><dd>The local project directory is missing.</dd>\n" +
"<dt>N/A</dt><dd>The project does not use SCM, so an update status is not available.</dd>\n" + "<dt>N/A</dt><dd>The project does not use SCM, so an update status is not available.</dd>\n" +
"</dl>\n", "</dl>\n",
dataPlacement: 'left', dataPlacement: 'top',
dataContainer: 'body', dataContainer: 'body',
icon: "icon-question-sign", icon: "icon-question-sign",
mode: 'all', mode: 'all',
'class': 'btn-xs btn-info btn-help pull-right', 'class': 'btn-xs btn-info btn-help',
awToolTip: 'Click for help', awToolTip: 'Click for help',
dataTitle: 'Project Status', dataTitle: 'Project Status',
iconSize: 'large' iconSize: 'large'
},
refresh: {
awRefresh: true,
mode: 'all'
} }
}, },

2
awx/ui/static/js/lists/Teams.js
View File

@@ -40,7 +40,7 @@ angular.module('TeamsListDefinition', [])
icon: 'icon-plus', icon: 'icon-plus',
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addTeam()', ngClick: 'addTeam()',
"class": 'btn-sm btn-success', "class": 'btn-xs btn-success',
awToolTip: 'Create a new team' awToolTip: 'Create a new team'
} }
}, },

2
awx/ui/static/js/lists/Users.js
View File

@@ -40,7 +40,7 @@ angular.module('UserListDefinition', [])
mode: 'all', // One of: edit, select, all mode: 'all', // One of: edit, select, all
ngClick: 'addUser()', ngClick: 'addUser()',
basePaths: ['organizations','users'], // base path must be in list, or action not available basePaths: ['organizations','users'], // base path must be in list, or action not available
"class": 'btn-success btn-sm', "class": 'btn-success btn-xs',
awToolTip: 'Create a new user' awToolTip: 'Create a new user'
} }
}, },

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

@@ -157,6 +157,7 @@ td.actions {
.refresh-grp { .refresh-grp {
display: inline-block; display: inline-block;
text-align: right;
margin-left: 10px; margin-left: 10px;
margin-top: 0; margin-top: 0;
padding: 0; padding: 0;
@@ -555,18 +556,10 @@ select.field-mini-height {
} }
/* Display list actions next to search widget */ /* Display list actions next to search widget */
/*
.list-actions { .list-actions {
display: inline-block; text-align: right;
padding-bottom: 22px;
margin-left: 10px;
vertical-align: top;
} }
.list-actions .btn {
margin-right: 3px;
}
*/
.btn-help { .btn-help {
margin-left: 15px; margin-left: 15px;
@@ -868,12 +861,7 @@ select.field-mini-height {
border-radius: 6px; border-radius: 6px;
} }
.tree-container { /*
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
border-radius: 6px;
}
.tree-view-container { .tree-view-container {
padding: 0 0 10px 0; padding: 0 0 10px 0;
@@ -881,16 +869,19 @@ select.field-mini-height {
padding-right: 10px; padding-right: 10px;
} }
} }
*/
.tree-form-container {
padding-left: 0;
padding-right: 25px;
}
#tree-view { #tree-view {
background-color: #f5f5f5;
border: 1px solid #e3e3e3; border: 1px solid #e3e3e3;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
/*border: 1px solid #e3e3e3;
border-radius: 6px; border-radius: 6px;
background-color: #e3e3e3; background-color: #e3e3e3;
*/
padding-top: 10px; padding-top: 10px;
padding-left: 10px; padding-left: 10px;
padding-bottom: 10px; padding-bottom: 10px;
@@ -905,11 +896,11 @@ select.field-mini-height {
#tree-form { #tree-form {
display: none; display: none;
padding: 15px 10px 10px 10px; /*padding: 15px 10px 10px 10px;
margin-top: 5px; margin-top: 5px;
border: 1px solid #e3e3e3; border: 1px solid #e3e3e3;
background-color: #e3e3e3; background-color: #e3e3e3;
border-radius: 6px; border-radius: 6px;*/
.form-title { .form-title {
color: #888; color: #888;
@@ -924,28 +915,6 @@ select.field-mini-height {
} }
} }
.tree-controls {
.btn-container{
padding-left: 0;
}
.btn-container-inner {
padding-top: 10px;
}
.title {
padding-top: 15px;
padding-left: 13px;
color: @grey;
font-weight: bold;
}
}
.tree-control-divider {
width: 98%;
margin: 10px auto;
}
/* Inventory-> Hosts */ /* Inventory-> Hosts */
.hosts-well { .hosts-well {
@@ -1216,11 +1185,6 @@ tr td button i {
width: 60px; width: 60px;
} }
#tree-view {
margin-left: 10px;
margin-top: 5px;
}
.label-text { .label-text {
text-align: right; text-align: right;
} }

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

@@ -978,9 +978,12 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
if ( (!options.modal) && this.form.showTitle ) { if ( (!options.modal) && this.form.showTitle ) {
html += "<div class=\"form-title\">"; html += "<div class=\"form-title\">";
html += (options.mode == 'edit') ? this.form.editTitle : this.form.addTitle; html += (options.mode == 'edit') ? this.form.editTitle : this.form.addTitle;
if (this.form.cancelButton) { if (this.has('titleActions')) {
html += "<button type=\"button\" ng-click=\"closeForm()\" class=\"close form-cancel\" aria-hidden=\"true\">" + html += "<div class=\"title-actions pull-right\">\n";
"&times;</button>\n"; for (btn in this.form.titleActions) {
html += this.button(this.form.titleActions[btn]);
}
html += "</div>\n";
} }
html += "</div>\n"; html += "</div>\n";
html += "<hr class=\"form-title-hr\">\n"; html += "<hr class=\"form-title-hr\">\n";
@@ -1202,6 +1205,7 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
"add hosts to the group.</p>"; "add hosts to the group.</p>";
html += "</div>\n"; html += "</div>\n";
/*
html += "<div class=\"row\">\n"; html += "<div class=\"row\">\n";
html += "<div class=\"col-lg-12\">\n"; html += "<div class=\"col-lg-12\">\n";
html += "<div class=\"tree-view-container well\">\n"; html += "<div class=\"tree-view-container well\">\n";
@@ -1211,10 +1215,6 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
html += "</div>\n"; html += "</div>\n";
html += "<div class=\"col-lg-8 btn-container\">\n"; html += "<div class=\"col-lg-8 btn-container\">\n";
html += "<div class=\"btn-container-inner\">\n"; html += "<div class=\"btn-container-inner\">\n";
/*html += "<button type=\"button\" id=\"edit_group_btn\" class=\"btn btn-default btn-sm\" ng-click=\"editGroup()\" ng-hide=\"groupEditHide\" " +
"aw-tool-tip=\"Edit the selected group's properties\" data-placement=\"bottom\" ng-disabled=\"grpBtnDisable\"><i class=\"icon-edit\"></i> " +
"properties</button>\n";
*/
html += "<button type=\"button\" id=\"copy_group_btn\" class=\"btn btn-success btn-sm\" ng-click=\"addGroup()\" ng-hide=\"groupAddHide\" " + html += "<button type=\"button\" id=\"copy_group_btn\" class=\"btn btn-success btn-sm\" ng-click=\"addGroup()\" ng-hide=\"groupAddHide\" " +
"aw-tool-tip=\"Copy existing groups to the selected group\" data-placement=\"bottom\" ng-disabled=\"grpBtnDisable\"><i class=\"icon-check\"></i> Copy</button>\n"; "aw-tool-tip=\"Copy existing groups to the selected group\" data-placement=\"bottom\" ng-disabled=\"grpBtnDisable\"><i class=\"icon-check\"></i> Copy</button>\n";
html += "<button type=\"button\" id=\"create_group_btn\" class=\"btn btn-success btn-sm\" ng-click=\"createGroup()\" ng-hide=\"groupCreateHide\" " + html += "<button type=\"button\" id=\"create_group_btn\" class=\"btn btn-success btn-sm\" ng-click=\"createGroup()\" ng-hide=\"groupCreateHide\" " +
@@ -1229,14 +1229,16 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
html += "</div>\n"; html += "</div>\n";
html += "</div><!-- tree controls -->\n"; html += "</div><!-- tree controls -->\n";
html += "<hr class=\"tree-control-divider\">\n"; html += "<hr class=\"tree-control-divider\">\n";
*/
html += "<div class=\"row\">\n"; html += "<div class=\"row\">\n";
html += "<div class=\"col-lg-4\">\n" + html += "<div class=\"col-lg-3\">\n" +
"<div id=\"tree-view\"></div>\n" + "<div id=\"tree-view\"></div>\n" +
"</div>\n"; "</div>\n";
html += "<div class=\"col-lg-8 tree-form-container\">\n<div id=\"tree-form\">\n</div>\n</div>\n"; html += "<div class=\"col-lg-9 tree-form-container\">\n";
html += "<div id=\"tree-form\">\n</div>\n";
html += "</div>\n"; html += "</div>\n";
html += "</div><!-- well -->\n"; //html += "</div><!-- well -->\n";
html += "</div><!-- col-lg-12 -->\n"; //html += "</div><!-- col-lg-12 -->\n";
html += "</div><!-- row -->\n"; html += "</div><!-- row -->\n";
} }
@@ -1454,21 +1456,23 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
html += SearchWidget({ iterator: form.related[itm].iterator, template: form.related[itm], mini: true }); html += SearchWidget({ iterator: form.related[itm].iterator, template: form.related[itm], mini: true });
html += "<div class=\"col-lg-7\">\n"; html += "<div class=\"col-lg-7\">\n";
html += "<div class=\"list-actions\">\n";
for (var act in form.related[itm].actions) { for (var act in form.related[itm].actions) {
var action = form.related[itm].actions[act]; var action = form.related[itm].actions[act];
html += "<button type=\"button\" class=\"btn btn-sm "; html += "<button type=\"button\" class=\"btn btn-xs ";
html += (form.related[itm].actions[act]['class']) ? form.related[itm].actions[act]['class'] : "btn-success"; html += (form.related[itm].actions[act]['class']) ? form.related[itm].actions[act]['class'] : "btn-success";
html += "\" "; html += "\" ";
html += "id=\"" + itm + "_" + act + "_btn\" "; html += "id=\"" + itm + "_" + act + "_btn\" ";
html += this.attr(action,'ngClick'); html += this.attr(action,'ngClick');
html += (action['ngShow']) ? this.attr(action,'ngShow') : ""; html += (action['ngShow']) ? this.attr(action,'ngShow') : "";
html += (action.awToolTip) ? this.attr(action,'awToolTip') : ""; html += (action.awToolTip) ? this.attr(action,'awToolTip') : "";
html += (action.awToolTip) ? "data-placement=\"right\" " : ""; html += (action.awToolTip) ? "data-placement=\"top\" " : "";
html += "><i class=\"" + action.icon + "\"></i>"; html += "><i class=\"" + action.icon + "\"></i>";
html += (action.label) ? " " + action.label : ""; html += (action.label) ? " " + action.label : "";
html += "</button>\n"; html += "</button>\n";
} }
html += "</div>\n"; html += "</div>\n";
html += "</div>\n";
html += "</div><!-- row -->\n" html += "</div><!-- row -->\n"
// Start the list // Start the list

4
awx/ui/static/lib/ansible/generator-helpers.js
View File

@@ -99,7 +99,7 @@ angular.module('GeneratorHelpers', ['GeneratorHelpers'])
// pass in button object, get back html // pass in button object, get back html
var html = ''; var html = '';
if (btn.awRefresh) { if (btn.awRefresh) {
html += "<div class=\"refresh-grp pull-right\" "; html += "<div class=\"refresh-grp\" ";
html += (btn.ngShow) ? Attr(btn, 'ngShow') : ""; html += (btn.ngShow) ? Attr(btn, 'ngShow') : "";
html += ">\n"; html += ">\n";
} }
@@ -129,7 +129,7 @@ angular.module('GeneratorHelpers', ['GeneratorHelpers'])
html += (btn.ngHide) ? Attr(btn,'ngHide') : ""; html += (btn.ngHide) ? Attr(btn,'ngHide') : "";
html += (btn.awToolTip) ? Attr(btn,'awToolTip') : ""; html += (btn.awToolTip) ? Attr(btn,'awToolTip') : "";
html += (btn.awToolTip && btn.dataPlacement == undefined) ? "data-placement=\"top\" " : ""; html += (btn.awToolTip && btn.dataPlacement == undefined) ? "data-placement=\"top\" " : "";
html += (btn.awRefresh && !btn.awTooltip) ? "aw-tool-tip=\"Refresh page\" " : ""; html += (btn.awRefresh && !btn.awTooltip) ? "aw-tool-tip=\"Refresh page\" data-placement=\"top\" ": "";
html += (btn.awPopOver) ? "aw-pop-over=\"" + html += (btn.awPopOver) ? "aw-pop-over=\"" +
btn.awPopOver.replace(/[\'\"]/g, '&quot;') + "\" " : ""; btn.awPopOver.replace(/[\'\"]/g, '&quot;') + "\" " : "";
html += (btn.dataPlacement) ? Attr(btn, 'dataPlacement') : ""; html += (btn.dataPlacement) ? Attr(btn, 'dataPlacement') : "";

45
awx/ui/static/lib/ansible/list-generator.js
View File

@@ -162,22 +162,10 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
html += "</div>\n"; html += "</div>\n";
} }
if (options.mode != 'lookup' && (list.well == undefined || list.well == 'true')) { if (options.mode != 'lookup' && (list.well == undefined || list.well == true)) {
html += "<div class=\"well\">\n"; html += "<div class=\"well\">\n";
} }
// Add a title and optionally a close button (used on Inventory->Groups)
if (options.mode !== 'lookup' && list.showTitle) {
html += "<div class=\"form-title\">";
html += (options.mode == 'edit' || options.mode == 'summary') ? list.editTitle : list.addTitle;
if (list.cancelButton) {
html += "<button type=\"button\" ng-click=\"closeForm()\" class=\"close form-cancel\" aria-hidden=\"true\">" +
"&times;</button>\n";
}
html += "</div>\n";
html += "<hr class=\"form-title-hr\">\n";
}
/* /*
if (list.editTitle.match(/^Inventory Summary/)) { if (list.editTitle.match(/^Inventory Summary/)) {
html += "<div class=\"row groups-issue\">\n"; html += "<div class=\"row groups-issue\">\n";
@@ -203,7 +191,7 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
//actions //actions
var base = $location.path().replace(/^\//,'').split('/')[0]; var base = $location.path().replace(/^\//,'').split('/')[0];
html += "<div class=\"list-actions "; html += "<div class=\"";
if (options.mode == 'summary') { if (options.mode == 'summary') {
html += 'col-lg-5'; html += 'col-lg-5';
} }
@@ -213,22 +201,20 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
else { else {
html += "col-lg-7 col-md-5"; html += "col-lg-7 col-md-5";
} }
html += "\">\n"; html += "\">\n";
html += "<div class=\"list-actions\">\n";
// all but refresh button
for (action in list.actions) { for (action in list.actions) {
if (list.actions[action].mode == 'all' || list.actions[action].mode == options.mode) { if (list.actions[action].mode == 'all' || list.actions[action].mode == options.mode) {
if ( (list.actions[action].basePaths == undefined) || if ( (list.actions[action].basePaths == undefined) ||
(list.actions[action].basePaths && list.actions[action].basePaths.indexOf(base) > -1) ) { (list.actions[action].basePaths && list.actions[action].basePaths.indexOf(base) > -1) ) {
html += this.button(list.actions[action], action); html += this.button(list.actions[action], action);
} }
} }
} }
html += "</div><!-- list-acitons -->\n";
/*if (list.name == 'inventories' && options.mode !== 'select') {
html += "<label class=\"checkbox-inline pull-right\"><input type=\"checkbox\" ng-model=\"inventoryFailureFilter\" " +
"ng-change=\"search('inventory')\" id=\"failed_jobs_chbox\"> Show only inventories with failed jobs</label>\n";
}*/
//select instructions //select instructions
if (options.mode == 'select' && list.selectInstructions) { if (options.mode == 'select' && list.selectInstructions) {
var btn = { var btn = {
@@ -243,14 +229,21 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
}; };
html += this.button(btn, 'select'); html += this.button(btn, 'select');
} }
html += "</div><!-- col-lg-7 -->\n";
} }
else { else {
html += "<div class=\"col-lg-7\"></div>\n"; html += "<div class=\"col-lg-7\"></div>\n";
} }
html += "</div>\n";
html += "</div><!-- row -->\n"; html += "</div><!-- row -->\n";
// Add a title and optionally a close button (used on Inventory->Groups)
if (options.mode !== 'lookup' && list.showTitle) {
html += "<div class=\"form-title\">";
html += (options.mode == 'edit' || options.mode == 'summary') ? list.editTitle : list.addTitle;
html += "</div>\n";
}
// table header row // table header row
html += "<table id=\"" + list.name + "_table\" "; html += "<table id=\"" + list.name + "_table\" ";
@@ -376,7 +369,7 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
html += "</div>\n"; html += "</div>\n";
} }
if (options.mode != 'lookup' && (list.well == undefined || list.well == 'true')) { if (options.mode != 'lookup' && (list.well == undefined || list.well == true)) {
html += "</div>\n"; //well html += "</div>\n"; //well
} }
@@ -386,7 +379,7 @@ angular.module('ListGenerator', ['GeneratorHelpers'])
else { else {
html += PaginateWidget({ set: list.name, iterator: list.iterator, mini: true }); html += PaginateWidget({ set: list.name, iterator: list.iterator, mini: true });
} }
return html; return html;
} }