From db9a4b809694d98b88929132c51cc60d2dc2006c Mon Sep 17 00:00:00 2001 From: Akita Noek Date: Wed, 8 Jun 2016 13:18:21 -0400 Subject: [PATCH 1/3] Added CodeMirror for notification http headers field #1752 --- .../src/notifications/add/add.controller.js | 46 +++++++++++-- .../src/notifications/edit/edit.controller.js | 65 +++++++++++++++++-- .../notificationTemplates.form.js | 10 ++- 3 files changed, 111 insertions(+), 10 deletions(-) diff --git a/awx/ui/client/src/notifications/add/add.controller.js b/awx/ui/client/src/notifications/add/add.controller.js index 1415c9bf05..e2fa103996 100644 --- a/awx/ui/client/src/notifications/add/add.controller.js +++ b/awx/ui/client/src/notifications/add/add.controller.js @@ -9,13 +9,13 @@ export default 'NotificationsFormObject', 'ProcessErrors', 'GetBasePath', 'Empty', 'GenerateForm', 'SearchInit' , 'PaginateInit', 'LookUpInit', 'OrganizationList', '$scope', '$state', 'CreateSelect2', 'GetChoices', - 'NotificationsTypeChange', + 'NotificationsTypeChange', 'ParseTypeChange', function( $rootScope, pagination, $compile, SchedulerInit, Rest, Wait, NotificationsFormObject, ProcessErrors, GetBasePath, Empty, GenerateForm, SearchInit, PaginateInit, LookUpInit, OrganizationList, $scope, $state, CreateSelect2, GetChoices, - NotificationsTypeChange + NotificationsTypeChange, ParseTypeChange ) { var generator = GenerateForm, form = NotificationsFormObject, @@ -45,6 +45,7 @@ export default }); }); + LookUpInit({ url: GetBasePath('organization'), scope: $scope, @@ -62,6 +63,28 @@ export default callback: 'choicesReady' }); + $scope.$watch('headers', function validate_headers(str) { + try { + let headers = JSON.parse(str); + if (_.isObject(headers) && !_.isArray(headers)) { + let valid = true; + for (let k in headers) { + if (_.isObject(headers[k])) { + valid = false; + } + if (headers[k] === null) { + valid = false; + } + } + $scope.notification_template_form.headers.$setValidity('json', valid); + return; + } + } catch (err) { + } + + $scope.notification_template_form.headers.$setValidity('json', false); + }); + $scope.typeChange = function () { for(var fld in form.fields){ if(form.fields[fld] && form.fields[fld].subForm){ @@ -73,6 +96,18 @@ export default NotificationsTypeChange.getDetailFields($scope.notification_type.value).forEach(function(field) { $scope[field[0]] = field[1]; }); + + + $scope.parse_type = 'json'; + if (!$scope.headers) { + $scope.headers = "{\n}"; + } + ParseTypeChange({ + scope: $scope, + parse_variable: 'parse_type', + variable: 'headers', + field_id: 'notification_template_headers' + }); }; // Save @@ -91,7 +126,11 @@ export default function processValue(value, i , field){ if(field.type === 'textarea'){ - $scope[i] = $scope[i].toString().split('\n'); + if (field.name == 'headers') { + $scope[i] = JSON.parse($scope[i]); + } else { + $scope[i] = $scope[i].toString().split('\n'); + } } if(field.type === 'checkbox'){ $scope[i] = Boolean($scope[i]); @@ -100,7 +139,6 @@ export default $scope[i] = Number($scope[i]); } return $scope[i]; - } params.notification_configuration = _.object(Object.keys(form.fields) diff --git a/awx/ui/client/src/notifications/edit/edit.controller.js b/awx/ui/client/src/notifications/edit/edit.controller.js index 03b4e52105..379f9db0e4 100644 --- a/awx/ui/client/src/notifications/edit/edit.controller.js +++ b/awx/ui/client/src/notifications/edit/edit.controller.js @@ -10,14 +10,14 @@ export default 'GenerateForm', 'SearchInit' , 'PaginateInit', 'LookUpInit', 'OrganizationList', 'notification_template', '$scope', '$state', 'GetChoices', 'CreateSelect2', 'Empty', - '$rootScope', 'NotificationsTypeChange', + '$rootScope', 'NotificationsTypeChange', 'ParseTypeChange', function( Rest, Wait, NotificationsFormObject, ProcessErrors, GetBasePath, GenerateForm, SearchInit, PaginateInit, LookUpInit, OrganizationList, notification_template, $scope, $state, GetChoices, CreateSelect2, Empty, - $rootScope, NotificationsTypeChange + $rootScope, NotificationsTypeChange, ParseTypeChange ) { var generator = GenerateForm, id = notification_template.id, @@ -59,7 +59,11 @@ export default master[fld] = data.notification_configuration[fld]; if(form.fields[fld].type === 'textarea'){ - $scope[fld] = $scope[fld].toString().replace(',' , '\n'); + if (form.fields[fld].name == 'headers') { + $scope[fld] = JSON.stringify($scope[fld], null, 2); + } else { + $scope[fld] = $scope[fld].toString().replace(',' , '\n'); + } } } @@ -88,6 +92,17 @@ export default $scope[field[0]] = field[1]; }); $scope.notification_obj = data; + + $scope.parse_type = 'json'; + if (!$scope.headers) { + $scope.headers = "{\n}"; + } + ParseTypeChange({ + scope: $scope, + parse_variable: 'parse_type', + variable: 'headers', + field_id: 'notification_template_headers', + }); Wait('stop'); }) .error(function (data, status) { @@ -112,6 +127,29 @@ export default callback: 'choicesReady' }); + + $scope.$watch('headers', function validate_headers(str) { + try { + let headers = JSON.parse(str); + if (_.isObject(headers) && !_.isArray(headers)) { + let valid = true; + for (let k in headers) { + if (_.isObject(headers[k])) { + valid = false; + } + if (headers[k] === null) { + valid = false; + } + } + $scope.notification_template_form.headers.$setValidity('json', valid); + return; + } + } catch (err) { + } + + $scope.notification_template_form.headers.$setValidity('json', false); + }); + $scope.typeChange = function () { for(var fld in form.fields){ if(form.fields[fld] && form.fields[fld].subForm){ @@ -123,6 +161,17 @@ export default NotificationsTypeChange.getDetailFields($scope.notification_type.value).forEach(function(field) { $scope[field[0]] = field[1]; }); + + $scope.parse_type = 'json'; + if (!$scope.headers) { + $scope.headers = "{\n}"; + } + ParseTypeChange({ + scope: $scope, + parse_variable: 'parse_type', + variable: 'headers', + field_id: 'notification_template_headers', + }); }; $scope.formSave = function(){ @@ -140,13 +189,19 @@ export default function processValue(value, i , field){ if(field.type === 'textarea'){ - $scope[i] = $scope[i].toString().split('\n'); + if (field.name == 'headers') { + $scope[i] = JSON.parse($scope[i]); + } else { + $scope[i] = $scope[i].toString().split('\n'); + } } if(field.type === 'checkbox'){ $scope[i] = Boolean($scope[i]); } + if(field.type === 'number'){ + $scope[i] = Number($scope[i]); + } return $scope[i]; - } params.notification_configuration = _.object(Object.keys(form.fields) diff --git a/awx/ui/client/src/notifications/notificationTemplates.form.js b/awx/ui/client/src/notifications/notificationTemplates.form.js index f3a6c29f3c..e2f03dfe5d 100644 --- a/awx/ui/client/src/notifications/notificationTemplates.form.js +++ b/awx/ui/client/src/notifications/notificationTemplates.form.js @@ -297,11 +297,19 @@ export default function() { }, headers: { label: 'HTTP Headers', - type: 'text', + type: 'textarea', + rows: 5, awRequiredWhen: { reqExpression: "webhook_required", init: "false" }, + awPopOver: '

Specify HTTP Headers in JSON format

' + + '

For example:

\n'
+                         + '{\n'
+                         + '  "X-Auth-Token": "828jf0",\n'
+                         + '  "X-Ansible": "Is great!"\n'
+                         + '}\n'
+                         + '

', ngShow: "notification_type.value == 'webhook' ", subForm: 'typeSubForm' }, From f1d915084a1b7391fb7b1988d9fd79f1a967bac5 Mon Sep 17 00:00:00 2001 From: Akita Noek Date: Wed, 8 Jun 2016 13:31:50 -0400 Subject: [PATCH 2/3] jshint --- .../client/src/notifications/add/add.controller.js | 2 +- .../src/notifications/edit/edit.controller.js | 4 ++-- .../notifications/notificationTemplates.form.js | 14 +++++++------- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/awx/ui/client/src/notifications/add/add.controller.js b/awx/ui/client/src/notifications/add/add.controller.js index e2fa103996..2d4d45fc43 100644 --- a/awx/ui/client/src/notifications/add/add.controller.js +++ b/awx/ui/client/src/notifications/add/add.controller.js @@ -126,7 +126,7 @@ export default function processValue(value, i , field){ if(field.type === 'textarea'){ - if (field.name == 'headers') { + if (field.name === 'headers') { $scope[i] = JSON.parse($scope[i]); } else { $scope[i] = $scope[i].toString().split('\n'); diff --git a/awx/ui/client/src/notifications/edit/edit.controller.js b/awx/ui/client/src/notifications/edit/edit.controller.js index 379f9db0e4..c81b7220c0 100644 --- a/awx/ui/client/src/notifications/edit/edit.controller.js +++ b/awx/ui/client/src/notifications/edit/edit.controller.js @@ -59,7 +59,7 @@ export default master[fld] = data.notification_configuration[fld]; if(form.fields[fld].type === 'textarea'){ - if (form.fields[fld].name == 'headers') { + if (form.fields[fld].name === 'headers') { $scope[fld] = JSON.stringify($scope[fld], null, 2); } else { $scope[fld] = $scope[fld].toString().replace(',' , '\n'); @@ -189,7 +189,7 @@ export default function processValue(value, i , field){ if(field.type === 'textarea'){ - if (field.name == 'headers') { + if (field.name === 'headers') { $scope[i] = JSON.parse($scope[i]); } else { $scope[i] = $scope[i].toString().split('\n'); diff --git a/awx/ui/client/src/notifications/notificationTemplates.form.js b/awx/ui/client/src/notifications/notificationTemplates.form.js index e2f03dfe5d..7ad0898b97 100644 --- a/awx/ui/client/src/notifications/notificationTemplates.form.js +++ b/awx/ui/client/src/notifications/notificationTemplates.form.js @@ -303,13 +303,13 @@ export default function() { reqExpression: "webhook_required", init: "false" }, - awPopOver: '

Specify HTTP Headers in JSON format

' - + '

For example:

\n'
-                         + '{\n'
-                         + '  "X-Auth-Token": "828jf0",\n'
-                         + '  "X-Ansible": "Is great!"\n'
-                         + '}\n'
-                         + '

', + awPopOver: '

Specify HTTP Headers in JSON format

' + + '

For example:

\n' +
+                           '{\n' +
+                           '  "X-Auth-Token": "828jf0",\n' +
+                           '  "X-Ansible": "Is great!"\n' +
+                           '}\n' +
+                           '

', ngShow: "notification_type.value == 'webhook' ", subForm: 'typeSubForm' }, From a2137a54a9e0c666876829c2cba903b3f4c4a9f8 Mon Sep 17 00:00:00 2001 From: Akita Noek Date: Thu, 9 Jun 2016 12:18:05 -0400 Subject: [PATCH 3/3] Made HTTP Header field full width To match our style guidelines --- awx/ui/client/src/notifications/notificationTemplates.form.js | 1 + 1 file changed, 1 insertion(+) diff --git a/awx/ui/client/src/notifications/notificationTemplates.form.js b/awx/ui/client/src/notifications/notificationTemplates.form.js index 7ad0898b97..0a4b2d5499 100644 --- a/awx/ui/client/src/notifications/notificationTemplates.form.js +++ b/awx/ui/client/src/notifications/notificationTemplates.form.js @@ -299,6 +299,7 @@ export default function() { label: 'HTTP Headers', type: 'textarea', rows: 5, + 'class': 'Form-formGroup--fullWidth', awRequiredWhen: { reqExpression: "webhook_required", init: "false"