some initial work on making it easy to add a custom datasource without modifing the original source, #701, #553

src/app/app.js

@@ -78,14 +78,20 @@ function (angular, $, _, appLevelRequire, config) {
     apps_deps.push(module_name);
   });
 
+  var preBootRequires = [
+    'controllers/all',
+    'directives/all',
+    'filters/all',
+    'components/partials',
+    'routes/all',
+  ];
+
+  _.each(config.plugins.dependencies, function(dep) {
+    preBootRequires.push('../plugins/' + dep);
+  });
+
   app.boot = function() {
-    require([
-      'controllers/all',
-      'directives/all',
-      'filters/all',
-      'components/partials',
-      'routes/all',
-    ], function () {
+    require(preBootRequires, function () {
 
       // disable tool tip animation
       $.fn.tooltip.defaults.animation = false;

src/app/components/settings.js

@@ -70,7 +70,7 @@ function (_, crypto) {
 
     _.each(settings.datasources, function(datasource, key) {
       datasource.name = key;
-      parseBasicAuth(datasource);
+      if (datasource.url) { parseBasicAuth(datasource); }
       if (datasource.type === 'influxdb') { parseMultipleHosts(datasource); }
     });
 
@@ -78,6 +78,10 @@ function (_, crypto) {
       settings.panels = _.union(settings.panels, settings.plugins.panels);
     }
 
+    if (!settings.plugins.dependencies) {
+      settings.plugins.dependencies = [];
+    }
+
     return settings;
   };
 });

src/app/services/datasourceSrv.js

@@ -67,6 +67,8 @@ function (angular, _, config) {
       case 'elasticsearch':
         Datasource = $injector.get('ElasticDatasource');
         break;
+      default:
+        Datasource = $injector.get(ds.type);
       }
       return new Datasource(ds);
     };

src/config.sample.js

@@ -96,7 +96,11 @@ function (Settings) {
 
     // Add your own custom pannels
     plugins: {
-      panels: []
+      // list of plugin panels
+      panels: [],
+      // requirejs modules in plugins folder that should be loaded
+      // for example custom datasources
+      dependencies: [],
     }
 
   });

src/plugins/datasource.example.js

@@ -0,0 +1,55 @@
+define([
+  'angular',
+  'lodash',
+  'kbn',
+  'moment'
+],
+function (angular, _, kbn) {
+  'use strict';
+
+  var module = angular.module('grafana.services');
+
+  module.factory('CustomDatasource', function($q) {
+
+    // the datasource object passed to constructor
+    // is the same defined in config.js
+    function CustomDatasource(datasource) {
+      this.name = datasource.name;
+      this.supportMetrics = true;
+      this.url = datasource.url;
+    }
+
+    CustomDatasource.prototype.query = function(filterSrv, options) {
+      // get from & to in seconds
+      var from = kbn.parseDate(options.range.from).getTime() / 1000;
+      var to = kbn.parseDate(options.range.to).getTime() / 1000;
+
+      var series = [];
+      var stepInSeconds = (to - from) / options.maxDataPoints;
+
+      for (var i = 0; i < 3; i++) {
+        var walker = Math.random() * 100;
+        var time = from;
+        var timeSeries = {
+          target: "Series " + i,
+          datapoints: []
+        };
+
+        for (var j = 0; j < options.maxDataPoints; j++) {
+          timeSeries.datapoints[j] = [walker, time];
+          walker += Math.random() - 0.5;
+          time += stepInSeconds;
+        }
+
+        series.push(timeSeries);
+      }
+
+      return $q.when({data: series });
+
+    };
+
+    return CustomDatasource;
+
+  });
+
+});