External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-01-11 10:00:01 -03:30
Code Issues Packages Projects Releases Wiki Activity

Latest UI changes -working on Job Templates

Browse Source
This commit is contained in:
chouseknecht 2013-05-14 13:50:45 -04:00
parent c9018a0aca
commit 0818e6ab3d
8 changed files with 272 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
lib/ui/static/js/app.js
View File

@ -41,12 +41,19 @@ angular.module('ansible', [
'CredentialsListDefinition',
'CredentialFormDefinition',
'LookUpHelper',
'JobTemplatesListDefinition'
'JobTemplatesListDefinition',
'JobTemplateFormDefinition'
])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/job_templates', { templateUrl: urlPrefix + 'partials/job_templates.html',
controller: JobTemplatesList }).
when('/job_templates/add', { templateUrl: urlPrefix + 'partials/job_templates.html',
controller: JobTemplatesAdd }).
// when('/job_templates/:id', { templateUrl: urlPrefix + 'partials/job_templates.html',
// controller: JobTemplatesEdit }).
when('/inventories', { templateUrl: urlPrefix + 'partials/inventories.html',
controller: InventoriesList }).
@ -173,6 +180,7 @@ angular.module('ansible', [
Authorization.restoreUserInfo(); //user must have hit browser refresh
}
}
console.log($rootScope.breadcrumbs)
});
if (! Authorization.isTokenValid() ) {

68
lib/ui/static/js/controllers/JobTemplates.js
View File

@ -21,7 +21,6 @@ function JobTemplatesList ($scope, $rootScope, $location, $log, $routeParams, Re
var view = GenerateList;
var base = $location.path().replace(/^\//,'').split('/')[0];
var mode = (base == 'job_templates') ? 'edit' : 'select'; // if base path 'credentials', we're here to add/edit
console.log(base);
var scope = view.inject(list, { mode: mode }); // Inject our view
scope.selected = [];
@ -31,15 +30,15 @@ function JobTemplatesList ($scope, $rootScope, $location, $log, $routeParams, Re
LoadBreadCrumbs();
scope.addCredential = function() {
scope.addJobTemplate = function() {
$location.path($location.path() + '/add');
}
scope.editCredential = function(id) {
scope.editJobTemplate = function(id) {
$location.path($location.path() + '/' + id);
}
scope.deleteCredential = function(id, name) {
scope.deleteJobTemplate = function(id, name) {
var action = function() {
var url = defaultUrl + id + '/';
@ -130,3 +129,64 @@ function JobTemplatesList ($scope, $rootScope, $location, $log, $routeParams, Re
JobTemplatesList.$inject = [ '$scope', '$rootScope', '$location', '$log', '$routeParams', 'Rest', 'Alert', 'JobTemplateList',
'GenerateList', 'LoadBreadCrumbs', 'Prompt', 'SearchInit', 'PaginateInit', 'ReturnToCaller', 'ClearScope',
'ProcessErrors','GetBasePath' ];
function JobTemplatesAdd ($scope, $rootScope, $compile, $location, $log, $routeParams, JobTemplateForm,
GenerateForm, Rest, Alert, ProcessErrors, LoadBreadCrumbs, ReturnToCaller, ClearScope,
GetBasePath, InventoryList, CredentialList, LookUpInit)
{
ClearScope('htmlTemplate'); //Garbage collection. Don't leave behind any listeners/watchers from the prior
//scope.
// Inject dynamic view
var defaultUrl = GetBasePath('job_templates');
var form = JobTemplateForm;
var generator = GenerateForm;
var scope = generator.inject(form, {mode: 'add', related: false});
generator.reset();
LoadBreadCrumbs();
LookUpInit({
scope: scope,
form: form,
current_item: null,
list: InventoryList,
field: 'inventory'
});
LookUpInit({
scope: scope,
form: form,
current_item: null,
list: CredentialList,
field: 'credential'
});
// Save
scope.formSave = function() {
Rest.setUrl(defaultUrl);
var data = {}
for (var fld in form.fields) {
data[fld] = scope[fld];
}
Rest.post(data)
.success( function(data, status, headers, config) {
ReturnToCaller(1);
})
.error( function(data, status, headers, config) {
ProcessErrors(scope, data, status, form,
{ hdr: 'Error!', msg: 'Failed to add new user. Post returned status: ' + status });
});
};
// Cancel
scope.formReset = function() {
// Defaults
generator.reset();
};
}
JobTemplatesAdd.$inject = [ '$scope', '$rootScope', '$compile', '$location', '$log', '$routeParams', 'JobTemplateForm',
'GenerateForm', 'Rest', 'Alert', 'ProcessErrors', 'LoadBreadCrumbs', 'ReturnToCaller', 'ClearScope',
'GetBasePath', 'InventoryList', 'CredentialList', 'LookUpInit' ];

2
lib/ui/static/js/forms/Credentials.js
View File

@ -12,7 +12,7 @@ angular.module('CredentialFormDefinition', [])
addTitle: 'Create Credential', //Legend in add mode
editTitle: '{{ name }}', //Legend in edit mode
name: 'team',
name: 'credential',
well: true,
fields: {

132
lib/ui/static/js/forms/JobTemplates.js Normal file
View File

@ -0,0 +1,132 @@
/*********************************************
* Copyright (c) 2013 AnsibleWorks, Inc.
*
* JobTemplates.js
* Form definition for Credential model
*
*
*/
angular.module('JobTemplateFormDefinition', [])
.value(
'JobTemplateForm', {
addTitle: 'Create Job Templates', //Legend in add mode
editTitle: '{{ name }}', //Legend in edit mode
name: 'job_templates',
well: true,
fields: {
name: {
label: 'Name',
type: 'text',
addRequired: true,
editRequired: true
},
description: {
label: 'Description',
type: 'text',
addRequired: false,
editRequired: false
},
job_type: {
label: 'Job Type',
type: 'select',
options: [{ value: 'run', label: 'Run' }, { value: 'check', label: 'Check' }],
default: 'run',
addRequired: false,
editRequired: false
},
inventory: {
label: 'Inventory',
type: 'lookup',
sourceModel: 'inventory',
sourceField: 'name',
addRequired: false,
editRequired: false,
ngClick: 'lookUpInventory()'
},
project: {
label: 'Project',
type: 'lookup',
sourceModel: 'project',
sourceField: 'name',
addRequired: false,
editRequired: false,
ngClick: 'lookUpProject()'
},
playbook: {
label: 'Playbook',
type:'text',
addRequired: false,
editRequired: false
},
credential: {
label: 'Credential',
type: 'lookup',
sourceModel: 'credential',
sourceField: 'name',
addRequired: true,
editRequired: true,
ngClick: 'lookUpCredential()',
addRequired: false,
editRequired: false
},
forks: {
label: 'Forks',
type: 'integer',
default: 0,
min: 0,
max: 10,
addRequired: false,
editRequired: false
},
limit: {
label: 'Limit',
type: 'integer',
default: 0,
min: 0,
max: 10,
addRequired: false,
editRequired: false
},
verbosity: {
label: 'Verbosity',
type: 'integer',
default: 0,
min: 0,
max: 5,
addRequired: false,
editRequired: false
},
extra_vars: {
label: 'Extra Variables',
type: 'textarea',
rows: 10,
addRequired: false,
editRequired: false
}
},
buttons: { //for now always generates <button> tags
save: {
label: 'Save',
icon: 'icon-ok',
class: 'btn btn-success',
ngClick: 'formSave()', //$scope.function to call on click, optional
ngDisabled: true //Disable when $pristine or $invalid, optional
},
reset: {
ngClick: 'formReset()',
label: 'Reset',
icon: 'icon-remove',
class: 'btn',
ngDisabled: true //Disabled when $pristine
}
},
related: { //related colletions (and maybe items?)
}
}); //InventoryForm

2
lib/ui/static/js/helpers/Lookup.js
View File

@ -31,7 +31,7 @@ angular.module('LookUpHelper', [ 'RestServices', 'Utilities', 'SearchHelper', 'P
scope['lookUp' + name] = function() {
var listGenerator = GenerateList;
var listScope = listGenerator.inject(list, { mode: 'lookup', hdr: 'Select ' + name });
var defaultUrl = GetBasePath(list.name);
var defaultUrl = (list.name == 'inventories') ? GetBasePath('inventory') : GetBasePath(list.name);
listScope.selectAction = function() {
var found = false;

2
lib/ui/static/lib/ansible/filters.js
View File

@ -11,7 +11,7 @@ angular.module('AWFilters', [])
//
.filter('capitalize', function() {
return function(input) {
var values = input.split(" ");
var values = input.replace(/\_/g,' ').split(" ");
var result = "";
for (i = 0; i < values.length; i++){
result += values[i].charAt(0).toUpperCase() + values[i].substr(1) + ' ';

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

@ -260,6 +260,68 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
}
}
//select field
if (field.type == 'select') {
if ( (! field.readonly) || (field.readonly && options.mode == 'edit') ) {
html += "<div class=\"control-group\""
html += (field.ngShow) ? this.attr(field,'ngShow') : "";
html += ">\n";
html += "<label class=\"control-label\" for=\"" + fld + '">' + field.label + '</label>' + "\n";
html += "<div class=\"controls\">\n";
html += "<select ";
html += "ng-model=\"" + fld + '" ';
html += 'name="' + fld + '" ';
html += (field.ngChange) ? this.attr(field,'ngChange') : "";
html += (field.id) ? this.attr(field,'id') : "";
html += (options.mode == 'edit' && field.editRequired) ? "required " : "";
html += (options.mode == 'add' && field.addRequired) ? "required " : "";
html += (field.readonly) ? "readonly " : "";
html += ">\n";
for (var i=0; i < field.options.length; i++) {
html += "<option value=\"" + field.options[i].value + "\" ";
html += (field.options[i].selected) ? "selected=\"selected\" " : "";
html += ">" + field.options[i].label + "</option>\n";
}
html += "</select>\n";
// Add error messages
if ( (options.mode == 'add' && field.addRequired) || (options.mode == 'edit' && field.editRequired) ) {
html += "<span class=\"error\" ng-show=\"" + this.form.name + '_form.' + fld + ".$dirty && " +
this.form.name + '_form.' + fld + ".$error.required\">A value is required!</span>\n";
}
html += "<span class=\"error api-error\" ng-bind=\"" + fld + "_api_error\"></span>\n";
html += "</div>\n";
html += "</div>\n";
}
}
//integer field
if (field.type == 'integer') {
if ( (! field.readonly) || (field.readonly && options.mode == 'edit') ) {
html += "<div class=\"control-group\""
html += (field.ngShow) ? this.attr(field,'ngShow') : "";
html += ">\n";
html += "<label class=\"control-label\" for=\"" + fld + '">' + field.label + '</label>' + "\n";
html += "<div class=\"controls\">\n";
html += "<input type=\"integer\" value=\"" + field.default + "\" class=\"spinner\" ";
html += "ng-model=\"" + fld + '" ';
html += 'name="' + fld + '" ';
html += (field.ngChange) ? this.attr(field,'ngChange') : "";
html += (field.id) ? this.attr(field,'id') : "";
html += (options.mode == 'edit' && field.editRequired) ? "required " : "";
html += (options.mode == 'add' && field.addRequired) ? "required " : "";
html += (field.readonly) ? "readonly " : "";
html += "/>\n";
// Add error messages
if ( (options.mode == 'add' && field.addRequired) || (options.mode == 'edit' && field.editRequired) ) {
html += "<span class=\"error\" ng-show=\"" + this.form.name + '_form.' + fld + ".$dirty && " +
this.form.name + '_form.' + fld + ".$error.required\">A value is required!</span>\n";
}
html += "<span class=\"error api-error\" ng-bind=\"" + fld + "_api_error\"></span>\n";
html += "</div>\n";
html += "</div>\n";
}
}
//checkbox
if (field.type == 'checkbox') {
if ( (! field.readonly) || (field.readonly && options.mode == 'edit') ) {
@ -369,7 +431,7 @@ angular.module('FormGenerator', ['GeneratorHelpers'])
html += this.buildCollections();
}
//console.log(html);
console.log(html);
return html;

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

@ -41,6 +41,7 @@
<script src="{{ STATIC_URL }}js/forms/Hosts.js"></script>
<script src="{{ STATIC_URL }}js/forms/Groups.js"></script>
<script src="{{ STATIC_URL }}js/forms/Credentials.js"></script>
<script src="{{ STATIC_URL }}js/forms/JobTemplates.js"></script>
<script src="{{ STATIC_URL }}js/lists/Users.js"></script>
<script src="{{ STATIC_URL }}js/lists/Organizations.js"></script>
<script src="{{ STATIC_URL }}js/lists/Admins.js"></script>