Support for async scripted dashboards, and accesss to jquery, window & document, Closes #274)

src/app/dashboards/scripted.js

@@ -5,18 +5,25 @@
  * This script generates a dashboard object that Grafana can load. It also takes a number of user
  * supplied URL parameters (int ARGS variable)
  *
+ * Return a dashboard object, or a function
+ *
+ * For async scripts, return a function, this function must take a single callback function as argument,
+ * call this callback function with the dashboard object (look at scripted_async.js for an example)
  */
 
 'use strict';
 
+// accessable variables in this scope
+var window, document, ARGS, $, jQuery, moment, kbn;
+
 // Setup some variables
-var dashboard, _d_timespan;
+var dashboard, timspan;
 
 // All url parameters are available via the ARGS object
 var ARGS;
 
 // Set a default timespan if one isn't specified
-_d_timespan = '1d';
+timspan = '1d';
 
 // Intialize a skeleton with nothing but a rows array and service object
 dashboard = {
@@ -28,7 +35,7 @@ dashboard = {
 dashboard.title = 'Scripted dash';
 dashboard.services.filter = {
   time: {
-    from: "now-"+(ARGS.from || _d_timespan),
+    from: "now-" + (ARGS.from || timspan),
     to: "now"
   }
 };
@@ -67,8 +74,7 @@ for (var i = 0; i < rows; i++) {
       }
     ]
   });
-
 }
 
-// Now return the object and we're good!
+
 return dashboard;

src/app/dashboards/scripted_async.js

@@ -0,0 +1,81 @@
+/* global _ */
+
+/*
+ * Complex scripted dashboard
+ * This script generates a dashboard object that Grafana can load. It also takes a number of user
+ * supplied URL parameters (int ARGS variable)
+ *
+ * Global accessable variables
+ * window, document, $, jQuery, ARGS, moment
+ *
+ * Return a dashboard object, or a function
+ *
+ * For async scripts, return a function, this function must take a single callback function,
+ * call this function with the dasboard object
+ */
+
+'use strict';
+
+// accessable variables in this scope
+var window, document, ARGS, $, jQuery, moment, kbn;
+
+return function(callback) {
+
+  // Setup some variables
+  var dashboard, timspan;
+
+  // Set a default timespan if one isn't specified
+  timspan = '1d';
+
+  // Intialize a skeleton with nothing but a rows array and service object
+  dashboard = {
+    rows : [],
+    services : {}
+  };
+
+  // Set a title
+  dashboard.title = 'Scripted dash';
+  dashboard.services.filter = {
+    time: {
+      from: "now-" + (ARGS.from || timspan),
+      to: "now"
+    }
+  };
+
+  var rows = 1;
+  var seriesName = 'argName';
+
+  if(!_.isUndefined(ARGS.rows)) {
+    rows = parseInt(ARGS.rows, 10);
+  }
+
+  if(!_.isUndefined(ARGS.name)) {
+    seriesName = ARGS.name;
+  }
+
+  $.ajax({
+    method: 'GET',
+    url: '/'
+  })
+  .done(function(result) {
+
+    dashboard.rows.push({
+      title: 'Chart',
+      height: '300px',
+      panels: [
+        {
+          title: 'Async dashboard test',
+          type: 'text',
+          span: 12,
+          fill: 1,
+          content: '# Async test'
+        }
+      ]
+    });
+
+    // when dashboard is composed call the callback
+    // function and pass the dashboard
+    callback(dashboard);
+
+  });
+}

src/app/services/dashboard.js

@@ -15,7 +15,7 @@ function (angular, $, kbn, _, config, moment, Modernizr) {
 
   module.service('dashboard', function(
     $routeParams, $http, $rootScope, $injector, $location, $timeout,
-    ejsResource, timer, alertSrv
+    ejsResource, timer, alertSrv, $q
   ) {
     // A hash of defaults to use when loading a dashboard
 
@@ -332,13 +332,27 @@ function (angular, $, kbn, _, config, moment, Modernizr) {
     this.script_load = function(file) {
       return $http({
         url: "app/dashboards/"+file.replace(/\.(?!js)/,"/"),
-        method: "GET",
-        transformResponse: function(response) {
-          /*jshint -W054 */
-          var _f = new Function('ARGS','kbn','_','moment','window','document','angular','require','define','$','jQuery',response);
-          return _f($routeParams,kbn,_,moment);
+        method: "GET"
+      })
+      .then(function(result) {
+        /*jshint -W054 */
+        var script_func = new Function('ARGS','kbn','_','moment','window','document','$','jQuery', result.data);
+        var script_result = script_func($routeParams,kbn,_,moment, window, document, $, $);
+
+        // Handle async dashboard scripts
+        if (_.isFunction(script_result)) {
+          var deferred = $q.defer();
+          script_result(function(dashboard) {
+            $rootScope.$apply(function() {
+              deferred.resolve({ data: dashboard });
+            });
+          });
+          return deferred.promise;
         }
-      }).then(function(result) {
+
+        return { data: script_result };
+      })
+      .then(function(result) {
         if(!result) {
           return false;
         }

tasks/options/jshint.js

@@ -18,7 +18,8 @@ module.exports = function(config) {
         'dist/*',
         'sample/*',
         '<%= srcDir %>/vendor/*',
-        '<%= srcDir %>/app/panels/*/{lib,leaflet}/*'
+        '<%= srcDir %>/app/panels/*/{lib,leaflet}/*',
+        '<%= srcDir %>/app/dashboards/*'
       ]
     }
   };