From a76459e62cccae4b3b528834578bbbf72b97c293 Mon Sep 17 00:00:00 2001 From: Jared Tabor Date: Fri, 3 Oct 2014 20:04:16 -0400 Subject: [PATCH] made survey taker + prompt for passwords + prompt for variables one modal window --- awx/ui/static/js/helpers/JobSubmission.js | 659 +++++++++++++++------- 1 file changed, 465 insertions(+), 194 deletions(-) diff --git a/awx/ui/static/js/helpers/JobSubmission.js b/awx/ui/static/js/helpers/JobSubmission.js index d0ab44a3fe..2b72713fff 100644 --- a/awx/ui/static/js/helpers/JobSubmission.js +++ b/awx/ui/static/js/helpers/JobSubmission.js @@ -14,26 +14,27 @@ angular.module('JobSubmissionHelper', [ 'RestServices', 'Utilities', 'CredentialFormDefinition', 'CredentialsListDefinition', 'LookUpHelper', 'JobSubmissionHelper', 'JobTemplateFormDefinition', 'ModalDialog', 'FormGenerator', 'JobVarsPromptFormDefinition']) -.factory('LaunchJob', ['Rest', 'Wait', 'ProcessErrors', function(Rest, Wait, ProcessErrors) { - return function(params) { - var scope = params.scope, - passwords = params.passwords || {}, - callback = params.callback || 'JobLaunched', - url = params.url; +.factory('LaunchJob', ['Rest', 'Wait', 'ProcessErrors', + function(Rest, Wait, ProcessErrors) { + return function(params) { + var scope = params.scope, + passwords = params.passwords || {}, + callback = params.callback || 'JobLaunched', + url = params.url; - Wait('start'); - Rest.setUrl(url); - Rest.post(passwords) - .success(function(data) { - scope.new_job_id = data.job; - scope.$emit(callback, data); - }) - .error(function (data, status) { - ProcessErrors(scope, data, status, null, { hdr: 'Error!', - msg: 'Attempt to start job at ' + url + ' failed. POST returned: ' + status }); - }); - }; -}]) + Wait('start'); + Rest.setUrl(url); + Rest.post(passwords) + .success(function(data) { + scope.new_job_id = data.job; + scope.$emit(callback, data); + }) + .error(function (data, status) { + ProcessErrors(scope, data, status, null, { hdr: 'Error!', + msg: 'Attempt to start job at ' + url + ' failed. POST returned: ' + status }); + }); + }; + }]) .factory('PromptForCredential', ['$location', 'Wait', 'GetBasePath', 'LookUpInit', 'JobTemplateForm', 'CredentialList', 'Rest', 'Prompt', 'ProcessErrors', function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialList, Rest, Prompt, ProcessErrors) { @@ -102,29 +103,111 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi }; }]) -.factory('PromptForPasswords', ['$compile', 'Wait', 'Alert', 'CredentialForm', 'CreateDialog', - function($compile, Wait, Alert, CredentialForm, CreateDialog) { + + +.factory('CreateLaunchDialog', ['$compile', 'Rest', 'GetBasePath', 'TextareaResize', 'CreateDialog', 'GenerateForm', 'JobVarsPromptForm', 'Wait', + function($compile, Rest, GetBasePath, TextareaResize,CreateDialog, GenerateForm, JobVarsPromptForm, Wait) { + return function(params) { + var buttons, + scope = params.scope, + html = params.html, + // callback = params.callback, + // job = params.job, + // url = params.url, + e; + + $('#password-modal').empty().html(html); + $('#password-modal').find('textarea').before(scope.helpContainer); + e = angular.element(document.getElementById('password-modal')); + $compile(e)(scope); + + buttons = [{ + label: "Cancel", + onClick: function() { + scope.passwordCancel(); + }, + icon: "fa-times", + "class": "btn btn-default", + "id": "password-cancel-button" + },{ + label: "Continue", + onClick: function() { + scope.passwordAccept(); + }, + icon: "fa-check", + "class": "btn btn-primary", + "id": "password-accept-button" + }]; + + CreateDialog({ + id: 'password-modal', + scope: scope, + buttons: buttons, + width: 600, + height: 700, //(scope.passwords.length > 1) ? 700 : 500, + minWidth: 500, + title: 'Launch Configuration', + callback: 'DialogReady', + onOpen: function(){ + Wait('stop'); + } + }); + + if (scope.removeDialogReady) { + scope.removeDialogReady(); + } + scope.removeDialogReady = scope.$on('DialogReady', function() { + $('#password-modal').dialog('open'); + $('#password-accept-button').attr({ "disabled": "disabled" }); + }); + }; + +}]) + + + + +.factory('PromptForPasswords', ['$compile', 'Wait', 'Alert', 'CredentialForm', + function($compile, Wait, Alert, CredentialForm) { return function(params) { - var parent_scope = params.scope, - passwords = params.passwords, + var scope = params.scope, callback = params.callback || 'PasswordsAccepted', form = CredentialForm, acceptedPasswords = {}, - scope = parent_scope.$new(), - e, buttons; + fld, field, html; - Wait('stop'); + scope.passwords = params.passwords; + // Wait('stop'); - function buildHtml() { - var fld, field, html; - html = ""; - html += "
Launching this job requires the passwords listed below. Enter and confirm each password before continuing.
\n"; - html += "
\n"; + html = ""; + html += "
Launching this job requires the passwords listed below. Enter and confirm each password before continuing.
\n"; + html += "\n"; - passwords.forEach(function(password) { - // Prompt for password - field = form.fields[password]; - fld = password; + scope.passwords.forEach(function(password) { + // Prompt for password + field = form.fields[password]; + fld = password; + scope[fld] = ''; + html += "
\n"; + html += "\n"; + html += "A value is required!
\n"; + html += "
\n"; + html += "\n"; + + // Add the related confirm field + if (field.associated) { + fld = field.associated; + field = form.fields[field.associated]; scope[fld] = ''; html += "
\n"; html += "\n"; @@ -132,85 +215,65 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi html += "ng-model=\"" + fld + '" '; html += "ng-keydown=\"keydown($event)\" "; html += 'name="' + fld + '" '; - html += "class=\"password-field form-control input-sm\" "; - html += (field.associated) ? "ng-change=\"clearPWConfirm('" + field.associated + "')\" " : ""; + html += "class=\"form-control input-sm\" "; + html += "ng-change=\"checkStatus()\" "; html += "required "; - html += " >"; + html += (field.awPassMatch) ? "awpassmatch=\"" + field.associated + "\" " : ""; + html += "/>"; // Add error messages html += "
A value is required!
\n"; + "password_form." + fld + ".$error.required\">A value is required!\n"; + html += (field.awPassMatch) ? "Must match Password value
\n" : ""; html += "
\n"; html += "\n"; - - // Add the related confirm field - if (field.associated) { - fld = field.associated; - field = form.fields[field.associated]; - scope[fld] = ''; - html += "
\n"; - html += "\n"; - html += "A value is required!\n"; - html += (field.awPassMatch) ? "Must match Password value
\n" : ""; - html += "
\n"; - html += "\n"; - } - }); - html += "
\n"; - return html; - } - - $('#password-modal').empty().html(buildHtml); - e = angular.element(document.getElementById('password-modal')); - $compile(e)(scope); - - buttons = [{ - label: "Cancel", - onClick: function() { - scope.passwordCancel(); - }, - icon: "fa-times", - "class": "btn btn-default", - "id": "password-cancel-button" - },{ - label: "Continue", - onClick: function() { - scope.passwordAccept(); - }, - icon: "fa-check", - "class": "btn btn-primary", - "id": "password-accept-button" - }]; - - CreateDialog({ - id: 'password-modal', - scope: scope, - buttons: buttons, - width: 600, - height: (passwords.length > 1) ? 700 : 500, - minWidth: 500, - title: 'Passwords Required', - callback: 'DialogReady' + } }); + html += "\n"; - if (scope.removeDialogReady) { - scope.removeDialogReady(); - } - scope.removeDialogReady = scope.$on('DialogReady', function() { - $('#password-modal').dialog('open'); - $('#password-accept-button').attr({ "disabled": "disabled" }); - }); + + // $('#password-modal').empty().html(buildHtml); + // e = angular.element(document.getElementById('password-modal')); + // $compile(e)(scope); + scope.$emit(callback, html); + // CreateLaunchDialog({scope: scope}) + // buttons = [{ + // label: "Cancel", + // onClick: function() { + // scope.passwordCancel(); + // }, + // icon: "fa-times", + // "class": "btn btn-default", + // "id": "password-cancel-button" + // },{ + // label: "Continue", + // onClick: function() { + // scope.passwordAccept(); + // }, + // icon: "fa-check", + // "class": "btn btn-primary", + // "id": "password-accept-button" + // }]; + + + // CreateDialog({ + // id: 'password-modal', + // scope: scope, + // buttons: buttons, + // width: 600, + // height: (parent_scope.passwords.length > 1) ? 700 : 500, + // minWidth: 500, + // title: 'parent_scope.passwords Required', + // callback: 'DialogReady' + // }); + + // if (scope.removeDialogReady) { + // scope.removeDialogReady(); + // } + // scope.removeDialogReady = scope.$on('DialogReady', function() { + // $('#password-modal').dialog('open'); + // $('#password-accept-button').attr({ "disabled": "disabled" }); + // }); scope.keydown = function(e){ if(e.keyCode===13){ scope.passwordAccept(); @@ -219,17 +282,17 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi scope.passwordAccept = function() { if (!scope.password_form.$invalid) { - passwords.forEach(function(password) { + scope.passwords.forEach(function(password) { acceptedPasswords[password] = scope[password]; }); $('#password-modal').dialog('close'); - parent_scope.$emit(callback, acceptedPasswords); + scope.$emit(callback, acceptedPasswords); } }; scope.passwordCancel = function() { $('#password-modal').dialog('close'); - parent_scope.$emit('CancelJob'); + scope.$emit('CancelJob'); scope.$destroy(); }; @@ -252,21 +315,22 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi }; }]) -.factory('PromptForVars', ['$compile', 'Rest', 'GetBasePath', 'TextareaResize', 'CreateDialog', 'GenerateForm', 'JobVarsPromptForm', 'Wait', +.factory('PromptForVars', ['$compile', 'Rest', 'GetBasePath', 'TextareaResize', 'CreateLaunchDialog', 'GenerateForm', 'JobVarsPromptForm', 'Wait', 'ParseVariableString', 'ToJSON', 'ProcessErrors', - function($compile, Rest, GetBasePath, TextareaResize,CreateDialog, GenerateForm, JobVarsPromptForm, Wait, ParseVariableString, ToJSON, - ProcessErrors) { + function($compile, Rest, GetBasePath, TextareaResize,CreateLaunchDialog, GenerateForm, JobVarsPromptForm, Wait, + ParseVariableString, ToJSON, ProcessErrors) { return function(params) { - var buttons, - parent_scope = params.scope, - scope = parent_scope.$new(), + var + // parent_scope = params.scope, + scope = params.scope, callback = params.callback, job = params.job, url = params.url, - e, helpContainer, html; + // e, helpContainer, + html = params.html || ""; - html = GenerateForm.buildHTML(JobVarsPromptForm, { mode: 'edit', modal: true, scope: scope }); - helpContainer = "
\n" + + html += GenerateForm.buildHTML(JobVarsPromptForm, { mode: 'edit', modal: true, scope: scope }); + scope.helpContainer = "
\n" + "" + " click for help
\n"; @@ -282,80 +346,81 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi scope.variables = ParseVariableString(params.variables); scope.parseType = 'yaml'; - + scope.$emit(callback, html); + // CreateLaunchDialog({scope: scope, html: html}) // Reuse password modal - $('#password-modal').empty().html(html); - $('#password-modal').find('textarea').before(helpContainer); - e = angular.element(document.getElementById('password-modal')); - $compile(e)(scope); + // $('#password-modal').empty().html(html); + // $('#password-modal').find('textarea').before(helpContainer); + // e = angular.element(document.getElementById('password-modal')); + // $compile(e)(scope); - buttons = [{ - label: "Cancel", - onClick: function() { - scope.varsCancel(); - }, - icon: "fa-times", - "class": "btn btn-default", - "id": "vars-cancel-button" - },{ - label: "Continue", - onClick: function() { - scope.varsAccept(); - }, - icon: "fa-check", - "class": "btn btn-primary", - "id": "vars-accept-button" - }]; + // buttons = [{ + // label: "Cancel", + // onClick: function() { + // scope.varsCancel(); + // }, + // icon: "fa-times", + // "class": "btn btn-default", + // "id": "vars-cancel-button" + // },{ + // label: "Continue", + // onClick: function() { + // scope.varsAccept(); + // }, + // icon: "fa-check", + // "class": "btn btn-primary", + // "id": "vars-accept-button" + // }]; - if (scope.removeDialogReady) { - scope.removeDialogReady(); - } - scope.removeDialogReady = scope.$on('DialogReady', function() { - Wait('stop'); - $('#password-modal').dialog('open'); - setTimeout(function() { - TextareaResize({ - scope: scope, - textareaId: 'job_variables', - modalId: 'password-modal', - formId: 'job_form', - parse: true - }); - }, 300); - }); + // if (scope.removeDialogReady) { + // scope.removeDialogReady(); + // } + // scope.removeDialogReady = scope.$on('DialogReady', function() { + // Wait('stop'); + // $('#password-modal').dialog('open'); + // setTimeout(function() { + // TextareaResize({ + // scope: scope, + // textareaId: 'job_variables', + // modalId: 'password-modal', + // formId: 'job_form', + // parse: true + // }); + // }, 300); + // }); - CreateDialog({ - id: 'password-modal', - scope: scope, - buttons: buttons, - width: 575, - height: 530, - minWidth: 450, - title: 'Extra Variables', - onResizeStop: function() { - TextareaResize({ - scope: scope, - textareaId: 'job_variables', - modalId: 'password-modal', - formId: 'job_form', - parse: true - }); - }, - beforeDestroy: function() { - if (scope.codeMirror) { - scope.codeMirror.destroy(); - } - $('#password-modal').empty(); - }, - onOpen: function() { - $('#job_variables').focus(); - }, - callback: 'DialogReady' - }); + // CreateDialog({ + // id: 'password-modal', + // scope: scope, + // buttons: buttons, + // width: 575, + // height: 530, + // minWidth: 450, + // title: 'Extra Variables', + // onResizeStop: function() { + // TextareaResize({ + // scope: scope, + // textareaId: 'job_variables', + // modalId: 'password-modal', + // formId: 'job_form', + // parse: true + // }); + // }, + // beforeDestroy: function() { + // if (scope.codeMirror) { + // scope.codeMirror.destroy(); + // } + // $('#password-modal').empty(); + // }, + // onOpen: function() { + // $('#job_variables').focus(); + // }, + // callback: 'DialogReady' + // }); scope.varsCancel = function() { $('#password-modal').dialog('close'); - parent_scope.$emit('CancelJob'); + scope.$emit('CancelJob'); scope.$destroy(); }; @@ -368,7 +433,7 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi .success(function() { Wait('stop'); $('#password-modal').dialog('close'); - parent_scope.$emit(callback); + scope.$emit(callback); scope.$destroy(); }) .error(function(data, status) { @@ -379,6 +444,179 @@ function($location, Wait, GetBasePath, LookUpInit, JobTemplateForm, CredentialLi }; }]) + +.factory('PromptForSurvey', ['$compile', 'Wait', 'Alert', 'CredentialForm', 'CreateLaunchDialog', 'SurveyControllerInit' , 'GetBasePath', 'Rest' , 'Empty', + 'SurveyTakerForm', 'GenerateForm', 'ShowSurveyModal', 'ProcessErrors', '$routeParams' , + function($compile, Wait, Alert, CredentialForm, CreateLaunchDialog, SurveyControllerInit, GetBasePath, Rest, Empty, + SurveyTakerForm, GenerateForm, ShowSurveyModal, ProcessErrors, $routeParams) { + return function(params) { + var + // parent_scope = params.scope, + // passwords = params.passwords, + // callback = params.callback || 'PasswordsAccepted', + html = params.html || "", + form = SurveyTakerForm, + id= params.id, + // acceptedPasswords = {}, + scope = params.scope, + // e, buttons, + i, + // survey_vars={}, qst, + // url = params.url, + requiredAsterisk, + requiredClasses, + defaultValue, + choices, + element, + checked, min, max, + // generator = GenerateForm, + survey_url = GetBasePath('job_templates') + id + '/survey_spec/' ; + + // // Get the existing record + // SurveyControllerInit({ + // scope: scope, + // parent_scope: scope, + // id: id + // }); + function buildHtml(question, index){ + + question.index = index; + question[question.variable] = question.default; + scope[question.variable] = question.default; + + + if(!$('#question_'+question.index+':eq(0)').is('div')){ + html+='
'; + $('#survey_taker_finalized_questions').append(html); + } + + requiredAsterisk = (question.required===true) ? "prepend-asterisk" : ""; + requiredClasses = (question.required===true) ? "ng-pristine ng-invalid-required ng-invalid" : ""; + + html += '
'+question.question_name+'
\n'; + if(!Empty(question.question_description)){ + html += '
'+question.question_description+'
\n'; + } + defaultValue = (question.default) ? question.default : ""; + + if(question.type === 'text' ){ + html+='
'+ + '
'+ + ''+ + '
'; + } + if(question.type === "textarea"){ + html+='
'+ + '
'+ + ''+ + '
'; + } + if(question.type === 'multiplechoice' || question.type === "multiselect"){ + choices = question.choices.split(/\n/); + element = (question.type==="multiselect") ? "checkbox" : 'radio'; + + for( i = 0; i'+ + '' +choices[i]+ + ''; + } + + } + if(question.type === 'integer' || question.type === "float"){ + min = (question.min) ? question.min : ""; + max = (question.max) ? question.max : "" ; + html+='
'+ + '
'+ + ''+ + '
'; + + } + if(question.index === scope.survey_questions.length-1){ + CreateLaunchDialog({scope: scope, html: html}); + } + } + + + // if (scope.removeDialogReady) { + // scope.removeDialogReady(); + // } + // scope.removeDialogReady = scope.$on('DialogReady', function() { + // $('#password-modal').dialog('open'); + // $('#finalized_questions').attr('opacity', 1.0); + // // $('#surveyName').focus(); + // // $('#question_unique_required_chbox').prop('checked' , true); + // }); + + // if (scope.removeSurveyTakerCompleted) { + // scope.removeSurveyTakerCompleted(); + // } + // scope.removeSurveyTakerCompleted = scope.$on('SurveyTakerCompleted', function() { + + // for(i=0; i 0) { scope.$emit('PromptForPasswords', data.passwords_needed_to_start); } else if (data.ask_variables_on_launch) { scope.$emit('PromptForVars'); + } else if (data.survey_enabled===true) { + scope.$emit('PromptForSurvey'); } else { scope.$emit('StartPlaybookRun');