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

completed 'edit question' for survey maker

Browse Source
This commit is contained in:
Jared Tabor
2014-09-26 09:15:00 -04:00
parent 1d9a0e0a1c
commit 832dcc7701
3 changed files with 102 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
awx/ui/static/js/helpers/Survey.js
View File

@@ -81,17 +81,17 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
tempSurv = {}, tempSurv = {},
generator = GenerateForm, generator = GenerateForm,
form = SurveyMakerForm, form = SurveyMakerForm,
labels={ // labels={
"type": "Type", // "type": "Type",
"question_name": "Question Text", // "question_name": "Question Text",
"question_description": "Question Description", // "question_description": "Question Description",
"variable": "Answer Varaible Name", // "variable": "Answer Varaible Name",
"choices": "Choices", // "choices": "Choices",
"min": "Min", // "min": "Min",
"max": "Max", // "max": "Max",
"required": "Required", // "required": "Required",
"default": "Default Answer" // "default": "Default Answer"
}, // },
url = GetBasePath('job_templates') + id + '/survey_spec/', i; url = GetBasePath('job_templates') + id + '/survey_spec/', i;
if (scope.removeDialogReady) { if (scope.removeDialogReady) {
@@ -114,7 +114,7 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
scope.survey_description = tempSurv.survey_description; scope.survey_description = tempSurv.survey_description;
// scope.survey_questions = data.spec; // scope.survey_questions = data.spec;
for(i=0; i<scope.survey_questions.length; i++){ for(i=0; i<scope.survey_questions.length; i++){
scope.finalizeQuestion(scope.survey_questions[i], labels); scope.finalizeQuestion(scope.survey_questions[i], i);
} }
} }
else{ else{
@@ -130,7 +130,7 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
scope.survey_description = data.description; scope.survey_description = data.description;
scope.survey_questions = data.spec; scope.survey_questions = data.spec;
for(i=0; i<scope.survey_questions.length; i++){ for(i=0; i<scope.survey_questions.length; i++){
scope.finalizeQuestion(scope.survey_questions[i], labels); scope.finalizeQuestion(scope.survey_questions[i], i);
} }
// scope.addQuestion(); // scope.addQuestion();
Wait('stop'); Wait('stop');
@@ -264,30 +264,39 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
var scope = params.scope, var scope = params.scope,
// id = params.id, // id = params.id,
question = params.question, question = params.question,
// callback = params.callback, index = params.index,
// url, // url,
// key, // key,
element, choices, i, checked, element, choices, i, checked,
max, min, defaultValue, max, min, defaultValue,
html = '<div class="question_final row">'; html = "";
html += '<div class="col-xs-12"><b>'+question.question_name+'</b></div>\n';
question.index = index;
if(!$('#question_'+question.index+':eq(0)').is('div')){
html+='<div id="question_'+question.index+'" class="question_final row"></div>';
$('#finalized_questions').append(html);
}
html = '<div class="col-xs-12"><b>'+question.question_name+'</b></div>\n';
if(!Empty(question.question_description)){ if(!Empty(question.question_description)){
html += '<div class="col-xs-12"> '+question.question_description+'</div>\n'; html += '<div class="col-xs-12"><i>'+question.question_description+'</i></div>\n';
} }
defaultValue = (question.default) ? question.default : ""; defaultValue = (question.default) ? question.default : "";
if(question.type === 'text' ){ if(question.type === 'text' ){
html+='<div class="row">'+ html+='<div class="row">'+
'<div class="col-xs-8">'+ '<div class="col-xs-8">'+
'<input type="text" placeholder="'+defaultValue+'" class="form-control ng-pristine ng-invalid-required ng-invalid" required="" >'+ '<input type="text" placeholder="'+defaultValue+'" class="form-control ng-pristine ng-invalid-required ng-invalid final" required="" >'+
'</div></div>'; '</div></div>';
} }
if(question.type === "textarea"){ if(question.type === "textarea"){
html+='<div class="row">'+ html+='<div class="row">'+
'<div class="col-xs-8">'+ '<div class="col-xs-8">'+
'<textarea class="form-control ng-pristine ng-invalid-required ng-invalid" required="" rows="3">'+defaultValue+'</textarea>'+ '<textarea class="form-control ng-pristine ng-invalid-required ng-invalid final" required="" rows="3">'+defaultValue+'</textarea>'+
'</div></div>'; '</div></div>';
} }
if(question.type === 'multiplechoice' || question.type === "multiselect"){ if(question.type === 'multiplechoice' || question.type === "multiselect"){
@@ -296,7 +305,7 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
for( i = 0; i<choices.length; i++){ for( i = 0; i<choices.length; i++){
checked = (!Empty(question.default) && question.default.indexOf(choices[i])!==-1) ? "checked" : ""; checked = (!Empty(question.default) && question.default.indexOf(choices[i])!==-1) ? "checked" : "";
html+='<label class="'+element+'-inline">'+ html+='<label class="'+element+'-inline final">'+
'<input type="'+element+'" name="'+question.variable+ ' " id="" value=" '+choices[i]+' " '+checked+'>' +choices[i]+ '<input type="'+element+'" name="'+question.variable+ ' " id="" value=" '+choices[i]+' " '+checked+'>' +choices[i]+
'</label>'; '</label>';
} }
@@ -307,23 +316,20 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
max = (question.max) ? question.max : "" ; max = (question.max) ? question.max : "" ;
html+='<div class="row">'+ html+='<div class="row">'+
'<div class="col-xs-8">'+ '<div class="col-xs-8">'+
'<input type="number" name="'+question.variable+'" min="'+min+'" max="'+max+'" value="'+defaultValue+'">'+ '<input type="number" class="final" name="'+question.variable+'" min="'+min+'" max="'+max+'" value="'+defaultValue+'">'+
'</div></div>'; '</div></div>';
}
if(question.type === "json"){
} }
html += '<div class="col-xs-12 text-right" id="question_actions">'; html += '<div class="col-xs-12 text-right" id="question_actions">';
html += '<a id="edit-action" data-placement="top" ng-click="editQuestion(this)" aw-tool-tip="Edit question" data-original-title="" title=""><i class="fa fa-pencil"></i> </a>'; html += '<a id="edit-action" data-placement="top" ng-click="editQuestion('+question.index+')" aw-tool-tip="Edit question" data-original-title="" title=""><i class="fa fa-pencil"></i> </a>';
html += '<a id="delete-action" data-placement="top" ng-click="deleteQuestion(job_template.id, job_template.name)" aw-tool-tip="Delete template" data-original-title="" title=""><i class="fa fa-trash-o"></i> </a>'; html += '<a id="delete-action" data-placement="top" ng-click="deleteQuestion(job_template.id, job_template.name)" aw-tool-tip="Delete template" data-original-title="" title=""><i class="fa fa-trash-o"></i> </a>';
html += '<a id="edit-action" data-placement="top" ng-click="moveQuestion(this)" aw-tool-tip="Move up" data-original-title="" title=""><i class="fa fa-sort-desc"></i> </a>'; html += '<a id="edit-action" data-placement="top" ng-click="moveQuestion(this)" aw-tool-tip="Move up" data-original-title="" title=""><i class="fa fa-sort-desc"></i> </a>';
html += '<a id="edit-action" data-placement="top" ng-click="editQuestion(this)" aw-tool-tip="Edit question" data-original-title="" title=""><i class="fa fa-sort-asc"></i> </a>'; html += '<a id="edit-action" data-placement="top" ng-click="editQuestion(question)" aw-tool-tip="Edit question" data-original-title="" title=""><i class="fa fa-sort-asc"></i> </a>';
html+='</div></div>'; html+='</div></div>';
$('#finalized_questions').append(html); $('#question_'+question.index).append(html);
element = angular.element(document.getElementById('finalized_questions')); element = angular.element(document.getElementById('question_'+question.index));
// element.html(html); // element.html(html);
$compile(element)(scope); $compile(element)(scope);
// var questionScope = scope.$new; // var questionScope = scope.$new;
@@ -335,14 +341,44 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
}]) }])
.factory('EditQuestion', ['GetBasePath','Rest', 'Wait', 'ProcessErrors', '$compile', 'GenerateForm', 'SurveyQuestionForm',
function(GetBasePath, Rest, Wait, ProcessErrors, $compile, GenerateForm, SurveyQuestionForm) {
return function(params) {
var scope = params.scope,
index = params.index,
element, fld, i,
form = SurveyQuestionForm;
element = $('.question_final:eq('+index+')');
element.attr('id', 'question_'+index);
element.empty();
// $('#new_question .aw-form-well').remove();
GenerateForm.inject(form, { id: 'question_'+index, mode: 'edit' , scope:scope, breadCrumbs: false});
for(fld in form.fields){
if(form.fields[fld].type === 'select'){
for (i = 0; i < scope.answer_types.length; i++) {
if (scope.survey_questions[index][fld] === scope.answer_types[i].type) {
scope[fld] = scope.answer_types[i];
}
}
} else {
scope[fld] = scope.survey_questions[index][fld];
}
}
};
}])
.factory('SurveyControllerInit', ['$location', 'DeleteSurvey', 'EditSurvey', 'AddSurvey', 'GenerateForm', 'SurveyQuestionForm', 'Wait', 'Alert', .factory('SurveyControllerInit', ['$location', 'DeleteSurvey', 'EditSurvey', 'AddSurvey', 'GenerateForm', 'SurveyQuestionForm', 'Wait', 'Alert',
'GetBasePath', 'Rest', 'ProcessErrors' , '$compile', 'FinalizeQuestion', 'GetBasePath', 'Rest', 'ProcessErrors' , '$compile', 'FinalizeQuestion', 'EditQuestion',
function($location, DeleteSurvey, EditSurvey, AddSurvey, GenerateForm, SurveyQuestionForm, Wait, Alert, function($location, DeleteSurvey, EditSurvey, AddSurvey, GenerateForm, SurveyQuestionForm, Wait, Alert,
GetBasePath, Rest, ProcessErrors, $compile, FinalizeQuestion) { GetBasePath, Rest, ProcessErrors, $compile, FinalizeQuestion, EditQuestion) {
return function(params) { return function(params) {
var scope = params.scope, var scope = params.scope,
// parent_scope = params.parent_scope, // parent_scope = params.parent_scope,
id = params.id, id = params.id,
// element, i,
url; url;
// iterator = (params.iterator) ? params.iterator : scope.iterator, // iterator = (params.iterator) ? params.iterator : scope.iterator,
// base = $location.path().replace(/^\//, '').split('/')[0]; // base = $location.path().replace(/^\//, '').split('/')[0];
@@ -353,7 +389,6 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
{name: 'Textarea', type: 'textarea'}, {name: 'Textarea', type: 'textarea'},
{name: 'Multiple Choice (single select)', type: 'multiplechoice'}, {name: 'Multiple Choice (single select)', type: 'multiplechoice'},
{name: 'Multiple Choice (multiple select)', type: 'multiselect'}, {name: 'Multiple Choice (multiple select)', type: 'multiselect'},
{name: 'JSON', type: 'json'},
{name: 'Integer', type: 'integer'}, {name: 'Integer', type: 'integer'},
{name: 'Float', type: 'float'} {name: 'Float', type: 'float'}
]; ];
@@ -384,15 +419,19 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
GenerateForm.inject(SurveyQuestionForm, { id:'new_question', mode: 'add' , scope:scope, breadCrumbs: false}); GenerateForm.inject(SurveyQuestionForm, { id:'new_question', mode: 'add' , scope:scope, breadCrumbs: false});
scope.required = true; //set the required checkbox to true via the ngmodel attached to scope.required. scope.required = true; //set the required checkbox to true via the ngmodel attached to scope.required.
}; };
scope.editQuestion = function(question){ scope.editQuestion = function(index){
alert('success : ' + question); EditQuestion({
index: index,
scope: scope
});
}; };
scope.finalizeQuestion= function(data){ scope.finalizeQuestion= function(data, index){
FinalizeQuestion({ FinalizeQuestion({
scope: scope, scope: scope,
question: data, question: data,
id: id, id: id,
index: index
//callback? //callback?
}); });
}; };
@@ -410,7 +449,7 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
labels={}, labels={},
min= "min", min= "min",
max = "max", max = "max",
fld; fld, key, elementID;
//generator.clearApiErrors(); //generator.clearApiErrors();
Wait('start'); Wait('start');
@@ -433,14 +472,23 @@ angular.module('SurveyHelper', [ 'Utilities', 'RestServices', 'SchedulesHelper',
} }
} }
Wait('stop'); Wait('stop');
scope.survey_questions.push(data);
$('#new_question .aw-form-well').remove(); if(GenerateForm.mode === 'add'){
// scope.addQuestion() scope.survey_questions.push(data);
$('#add_question_btn').show(); $('#new_question .aw-form-well').remove();
// for(fld in form.fields){ // scope.addQuestion()
// $scope[fld] = ''; $('#add_question_btn').show();
// } scope.finalizeQuestion(data , scope.survey_questions.length-1);
scope.finalizeQuestion(data , labels); }
if(GenerateForm.mode === 'edit'){
elementID = event.target.parentElement.parentElement.parentElement.parentElement.parentElement.id;
key = elementID.split('_')[1];
scope.survey_questions[key] = data;
$('#'+elementID).empty();
scope.finalizeQuestion(data , key);
}
} catch (err) { } catch (err) {
Wait('stop'); Wait('stop');

20
awx/ui/static/less/survey-maker.less
View File

@@ -34,26 +34,20 @@
} }
.question_final{ .question_final{
/*border: 1px dashed; border-top: 1px dashed;
*border-color: rgb(204,204,204); border-color: rgb(204,204,204);
*border-radius: 4px; border-radius: 4px;
/* opacity: 0.7;
*/ */
padding: 5px; padding: 5px;
opacity: 0.7;
.final{
textarea{
margin-left: 15px; margin-left: 15px;
} }
input{
margin-left: 15px;
}
label{
margin-left: 15px;
}
} }
#new_question{ #new_question{
margin-top: 5px; margin-top: 5px;
} }

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

@@ -1439,6 +1439,9 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'Utilities', 'ListGenerator
html += "\" "; html += "\" ";
html += "id=\"" + this.form.name + "_" + btn + "_btn\" "; html += "id=\"" + this.form.name + "_" + btn + "_btn\" ";
if(button.ngShow){
html += this.attr(button, 'ngShow');
}
if (button.ngClick) { if (button.ngClick) {
html += this.attr(button, 'ngClick'); html += this.attr(button, 'ngClick');
} }