Added tooltips to host/group/extra variables using TB popover. Fixed bugs on Inventory detail page causing js errors. Added JSON validation to extra_vars on Job Templates add/edit page. Always grey-out/disable fields on Jobs detail page because upading a Pending job throws a 405 error -will investigate with CC later.

2026-05-12 03:47:36 -02:30 · 2013-05-27 13:18:15 -04:00
parent 2a0f528954
commit e61a966464
11 changed files with 133 additions and 77 deletions
--- a/ansibleworks/ui/static/js/app.js
+++ b/ansibleworks/ui/static/js/app.js
@@ -17,7 +17,6 @@ angular.module('ansible', [
    'OrganizationListDefinition',
    'UserListDefinition', 
    'ListGenerator', 
-    'AWToolTip', 
    'PromptDialog',
    'ApiLoader', 
    'RelatedSearchHelper', 
--- a/ansibleworks/ui/static/js/controllers/Inventories.js
+++ b/ansibleworks/ui/static/js/controllers/Inventories.js
@@ -218,13 +218,6 @@ function InventoriesEdit ($scope, $rootScope, $compile, $location, $log, $routeP
   var id = $routeParams.id;
   var relatedSets = {}; 
  
-   // After inventory is loaded, retrieve each related set and any lookups
-   scope.$on('inventoryLoaded', function() {
-       for (var set in relatedSets) {
-           scope.search(relatedSets[set].iterator);
-       }     
-       });
-
   // Retrieve detail record and prepopulate the form
   Rest.setUrl(defaultUrl + ':id/'); 
   Rest.get({ params: {id: id} })
--- a/ansibleworks/ui/static/js/controllers/JobTemplates.js
+++ b/ansibleworks/ui/static/js/controllers/JobTemplates.js
@@ -216,25 +216,32 @@ function JobTemplatesAdd ($scope, $rootScope, $compile, $location, $log, $routeP

   // Save
   scope.formSave = function() {
-      Rest.setUrl(defaultUrl);
-      var data = {}
-      for (var fld in form.fields) {
-          if (form.fields[fld].type == 'select' && fld != 'playbook') {
-             data[fld] = scope[fld].value;
+      try {
+          // Make sure we have valid JSON 
+          var myjson = JSON.parse(scope.extra_vars);
+          Rest.setUrl(defaultUrl);
+          var data = {}
+          for (var fld in form.fields) {
+              if (form.fields[fld].type == 'select' && fld != 'playbook') {
+                 data[fld] = scope[fld].value;
+              }
+              else {
+                 data[fld] = scope[fld];
+              }      
          }
-          else {
-             data[fld] = scope[fld];
-          }      
+          Rest.post(data)
+              .success( function(data, status, headers, config) {
+                  var base = $location.path().replace(/^\//,'').split('/')[0];
+                  (base == 'job_templates') ? ReturnToCaller() : ReturnToCaller(1);
+                  })
+              .error( function(data, status, headers, config) {
+                  ProcessErrors(scope, data, status, form,
+                      { hdr: 'Error!', msg: 'Failed to add new project. POST returned status: ' + status });
+                  });
+      }
+      catch(err) {
+          Alert("Error", "Error parsing extra variables. Expecting valid JSON. Parser returned " + err); 
      }
-      Rest.post(data)
-          .success( function(data, status, headers, config) {
-              var base = $location.path().replace(/^\//,'').split('/')[0];
-              (base == 'job_templates') ? ReturnToCaller() : ReturnToCaller(1);
-              })
-          .error( function(data, status, headers, config) {
-              ProcessErrors(scope, data, status, form,
-                  { hdr: 'Error!', msg: 'Failed to add new project. POST returned status: ' + status });
-              });
      };

   // Reset
@@ -389,25 +396,32 @@ function JobTemplatesEdit ($scope, $rootScope, $compile, $location, $log, $route

   // Save changes to the parent
   scope.formSave = function() {
-      Rest.setUrl(defaultUrl + $routeParams.id + '/');
-      var data = {}
-      for (var fld in form.fields) {
-          if (form.fields[fld].type == 'select' && fld != 'playbook') {
-             data[fld] = scope[fld].value;
-          }
-          else {
-             data[fld] = scope[fld];
-          }   
-      } 
-      Rest.put(data)
-          .success( function(data, status, headers, config) {
-              var base = $location.path().replace(/^\//,'').split('/')[0];
-              (base == 'job_templates') ? ReturnToCaller() : ReturnToCaller(1);
-              })
-          .error( function(data, status, headers, config) {
-              ProcessErrors(scope, data, status, form,
-                  { hdr: 'Error!', msg: 'Failed to update team: ' + $routeParams.id + '. PUT status: ' + status });
+      try {
+          // Make sure we have valid JSON 
+          var myjson = JSON.parse(scope.extra_vars);
+          Rest.setUrl(defaultUrl + $routeParams.id + '/');
+          var data = {}
+          for (var fld in form.fields) {
+              if (form.fields[fld].type == 'select' && fld != 'playbook') {
+                 data[fld] = scope[fld].value;
+              }
+              else {
+                 data[fld] = scope[fld];
+              }   
+          } 
+          Rest.put(data)
+              .success( function(data, status, headers, config) {
+                  var base = $location.path().replace(/^\//,'').split('/')[0];
+                  (base == 'job_templates') ? ReturnToCaller() : ReturnToCaller(1);
+                  })
+              .error( function(data, status, headers, config) {
+                  ProcessErrors(scope, data, status, form,
+                      { hdr: 'Error!', msg: 'Failed to update team: ' + $routeParams.id + '. PUT status: ' + status });
              });
+      }
+      catch(err) {
+          Alert("Error", "Error parsing extra variables. Expecting valid JSON. Parser returned " + err); 
+      }
      };

   // Cancel
--- a/ansibleworks/ui/static/js/controllers/Jobs.js
+++ b/ansibleworks/ui/static/js/controllers/Jobs.js
@@ -227,11 +227,9 @@ function JobsEdit ($scope, $rootScope, $compile, $location, $log, $routeParams,
               }
           }
            
-           if (data.status != 'new') {
-              $('input[type="text"], textarea').attr('readonly','readonly');
-              $('select').prop('disabled', 'disabled');
-              $('.lookup-btn').prop('disabled', 'disabled');
-           }
+           $('input[type="text"], textarea').attr('readonly','readonly');
+           $('select').prop('disabled', 'disabled');
+           $('.lookup-btn').prop('disabled', 'disabled');

           scope.url = data.url; 
           var related = data.related;
--- a/ansibleworks/ui/static/js/forms/Groups.js
+++ b/ansibleworks/ui/static/js/forms/Groups.js
@@ -35,7 +35,14 @@ angular.module('GroupFormDefinition', [])
                editRequird: false, 
                rows: 10,
                class: 'span12',
-                default: "\{\}"
+                default: "\{\}",
+                dataTitle: 'Group Variables',
+                dataPlacement: 'right',
+                awPopOver: '<p>Enter variables as JSON. Both the key and value must be wrapped in double quotes. ' +
+                    'Separate variables with commas, and wrap the entire string with { }. ' +
+                    '&nbsp;For example:</p><p>{<br\>&quot;ntp_server&quot;: &quot;ntp.example.com&quot;,<br \>' + 
+                    '&quot;proxy&quot;: &quot;proxy.example.com&quot;<br \>}</p><p>See additional JSON examples at <a href="' +
+                    'http://www.json.org" target="_blank">www.json.org</a></p>'
                }
            },

--- a/ansibleworks/ui/static/js/forms/Hosts.js
+++ b/ansibleworks/ui/static/js/forms/Hosts.js
@@ -40,7 +40,14 @@ angular.module('HostFormDefinition', [])
                editRequird: false, 
                rows: 10,
                class: 'span12',
-                default: "\{\}"
+                default: "\{\}",
+                awPopOver: "<p>Enter variables as JSON. Both the key and value must be wrapped in double quotes. " +
+                    "Separate variables with commas, and wrap the entire string with { }. " +
+                    "&nbsp;For example:</p><p>{<br\>&quot;ntp_server&quot;: &quot;ntp.example.com&quot;,<br \>" + 
+                    '&quot;proxy&quot;: &quot;proxy.example.com&quot;<br \>}</p><p>See additional JSON examples at <a href="' +
+                    'http://www.json.org" target="_blank">www.json.org</a></p>',
+                dataTitle: 'Host Variables',
+                dataPlacement: 'right'
                }
            },

--- a/ansibleworks/ui/static/js/forms/JobTemplates.js
+++ b/ansibleworks/ui/static/js/forms/JobTemplates.js
@@ -115,7 +115,15 @@ angular.module('JobTemplateFormDefinition', [])
                class: 'span12',
                addRequired: false, 
                editRequired: false,
-                column: 2
+                default: "\{\}",
+                column: 2,
+                awPopOver: "<p>Enter variables as JSON. Both the key and value must be wrapped in double quotes. " +
+                    "Separate variables with commas, and wrap the entire string with { }. " +
+                    "&nbsp;For example:</p><p>{<br\>&quot;ntp_server&quot;: &quot;ntp.example.com&quot;,<br \>" + 
+                    '&quot;proxy&quot;: &quot;proxy.example.com&quot;<br \>}</p><p>See additional JSON examples at <a href="' +
+                    'http://www.json.org" target="_blank">www.json.org</a></p>',
+                dataTitle: 'Extra Variables',
+                dataPlacement: 'left'
                }
            },