feat(mixed data source queries): lots of minor polish to new mixed data source…

feat(mixed data source queries): lots of minor polish to new mixed data source and all the changes it has required, #436

pkg/api/datasources.go

@@ -115,7 +115,7 @@ func GetDataSourcePlugins(c *middleware.Context) {
 	dsList := make(map[string]interface{})
 	dsList := make(map[string]interface{})
 
 
 	for key, value := range plugins.DataSources {
 	for key, value := range plugins.DataSources {
-		if value.(map[string]interface{})["hide"] == nil {
+		if value.(map[string]interface{})["builtIn"] == nil {
 			dsList[key] = value
 			dsList[key] = value
 		}
 		}
 	}
 	}

pkg/api/frontendsettings.go

@@ -86,12 +86,13 @@ func getFrontendSettingsMap(c *middleware.Context) (map[string]interface{}, erro
 
 
 	// add grafana backend data source
 	// add grafana backend data source
 	grafanaDatasourceMeta, _ := plugins.DataSources["grafana"]
 	grafanaDatasourceMeta, _ := plugins.DataSources["grafana"]
-	datasources["grafana"] = map[string]interface{}{
+	datasources["-- Grafana --"] = map[string]interface{}{
 		"type": "grafana",
 		"type": "grafana",
 		"meta": grafanaDatasourceMeta,
 		"meta": grafanaDatasourceMeta,
 	}
 	}
+
 	// add mixed backend data source
 	// add mixed backend data source
-	datasources["mixed"] = map[string]interface{}{
+	datasources["-- Mixed --"] = map[string]interface{}{
 		"type": "mixed",
 		"type": "mixed",
 		"meta": plugins.DataSources["mixed"],
 		"meta": plugins.DataSources["mixed"],
 	}
 	}

public/app/features/panel/panelSrv.js

@@ -48,7 +48,7 @@ function (angular, _, config) {
         var target = {};
         var target = {};
 
 
         if (datasource) {
         if (datasource) {
-          target.datasource = datasource;
+          target.datasource = datasource.name;
         }
         }
 
 
         target.refId = _.find(letters, function(refId) {
         target.refId = _.find(letters, function(refId) {
@@ -66,21 +66,24 @@ function (angular, _, config) {
       };
       };
 
 
       $scope.setDatasource = function(datasource) {
       $scope.setDatasource = function(datasource) {
-        $scope.panel.datasource = datasource;
-        $scope.datasource = null;
-        $scope.panel.targets = _.filter($scope.panel.targets, function(target) {
-          delete target.datasource;
-          return target.datasource === void 0;
+        // switching to mixed
+        if (datasource.meta.mixed) {
+          _.each($scope.panel.targets, function(target) {
+            target.datasource = $scope.panel.datasource;
+            if (target.datasource === null) {
+              target.datasource = config.defaultDatasource;
+            }
           });
           });
-
-        if ($scope.panel.targets.length === 0) {
-          $scope.panel.targets = [{refId: 'A'}];
         }
         }
-
-        if (datasource === 'mixed') {
-          $scope.panel.targets = [];
+        // switching from mixed
+        else if ($scope.datasource && $scope.datasource.meta.mixed) {
+          _.each($scope.panel.targets, function(target) {
+            delete target.datasource;
+          });
         }
         }
 
 
+        $scope.panel.datasource = datasource.value;
+        $scope.datasource = null;
         $scope.get_data();
         $scope.get_data();
       };
       };
 
 

public/app/partials/metrics.html

@@ -6,23 +6,23 @@
 	</div>
 	</div>
 
 
 	<div style="margin: 20px 0 0 0">
 	<div style="margin: 20px 0 0 0">
-		<button class="btn btn-inverse" ng-click="addDataQuery(panel.target)" ng-if="datasource.meta.type !== 'mixed'">
+		<button class="btn btn-inverse" ng-click="addDataQuery()" ng-hide="datasource.meta.builtIn">
 			<i class="fa fa-plus"></i>&nbsp;
 			<i class="fa fa-plus"></i>&nbsp;
 			Query
 			Query
 		</button>
 		</button>
 
 
-		<span class="dropdown" ng-if="datasource.meta.type === 'mixed'">
+		<div class="dropdown" ng-if="datasource.meta.builtIn">
 			<button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown">
 			<button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown">
 				<i class="fa fa-plus"></i>&nbsp;
 				<i class="fa fa-plus"></i>&nbsp;
 				Query &nbsp; <span class="caret"></span>
 				Query &nbsp; <span class="caret"></span>
 			</button>
 			</button>
 
 
 			<ul class="dropdown-menu" role="menu">
 			<ul class="dropdown-menu" role="menu">
-				<li ng-repeat="datasource in datasources" role="menuitem">
-					<a ng-click="addDataQuery(datasource.name);">{{datasource.name}}</a>
+				<li ng-repeat="datasource in datasources" role="menuitem" ng-hide="datasource.meta.builtIn">
+					<a ng-click="addDataQuery(datasource);">{{datasource.name}}</a>
 				</li>
 				</li>
 			</ul>
 			</ul>
-		</span>
+		</div>
 
 
 	</div>
 	</div>
 
 

public/app/plugins/datasource/grafana/plugin.json

 {
 {
   "pluginType": "datasource",
   "pluginType": "datasource",
-  "name": "Grafana (for testing)",
-  "hide": true,
+  "name": "Grafana",
+  "builtIn": true,
 
 
   "type": "grafana",
   "type": "grafana",
   "serviceName": "GrafanaDatasource",
   "serviceName": "GrafanaDatasource",

public/app/plugins/datasource/graphite/plugin.json

@@ -8,7 +8,7 @@
   "module": "plugins/datasource/graphite/datasource",
   "module": "plugins/datasource/graphite/datasource",
 
 
   "partials": {
   "partials": {
-    "config": "app/plugins/datasource/graphite/partials/config.html",
+    "config": "app/plugins/datasource/graphite/partials/config.html"
   },
   },
 
 
   "metrics": true,
   "metrics": true,

public/app/plugins/datasource/influxdb/plugin.json

@@ -8,7 +8,7 @@
   "module": "plugins/datasource/influxdb/datasource",
   "module": "plugins/datasource/influxdb/datasource",
 
 
   "partials": {
   "partials": {
-    "config": "app/plugins/datasource/influxdb/partials/config.html",
+    "config": "app/plugins/datasource/influxdb/partials/config.html"
   },
   },
 
 
   "metrics": true,
   "metrics": true,

public/app/plugins/datasource/mixed/plugin.json

 {
 {
   "pluginType": "datasource",
   "pluginType": "datasource",
   "name": "Mixed datasource",
   "name": "Mixed datasource",
-  "hide": true,
+  "builtIn": true,
+  "mixed": true,
 
 
   "type": "mixed",
   "type": "mixed",
   "serviceName": "MixedDatasource",
   "serviceName": "MixedDatasource",

public/app/plugins/datasource/opentsdb/datasource.js

@@ -3,6 +3,7 @@ define([
   'lodash',
   'lodash',
   'kbn',
   'kbn',
   'moment',
   'moment',
+  './directives',
   './queryCtrl',
   './queryCtrl',
 ],
 ],
 function (angular, _, kbn) {
 function (angular, _, kbn) {

public/app/services/datasourceSrv.js

@@ -20,13 +20,24 @@ function (angular, _, config) {
         if (value.meta && value.meta.metrics) {
         if (value.meta && value.meta.metrics) {
           self.metricSources.push({
           self.metricSources.push({
             value: key === config.defaultDatasource ? null : key,
             value: key === config.defaultDatasource ? null : key,
-            name: key
+            name: key,
+            meta: value.meta,
           });
           });
         }
         }
         if (value.meta && value.meta.annotations) {
         if (value.meta && value.meta.annotations) {
           self.annotationSources.push(value);
           self.annotationSources.push(value);
         }
         }
       });
       });
+
+      this.metricSources.sort(function(a, b) {
+        if (a.meta.builtIn || a.name > b.name) {
+          return 1;
+        }
+        if (a.name < b.name) {
+          return -1;
+        }
+        return 0;
+      });
     };
     };
 
 
     this.get = function(name) {
     this.get = function(name) {

public/vendor/bootstrap/less/bootstrap.less

@@ -32,7 +32,7 @@
 
 
 // Components: Buttons & Alerts
 // Components: Buttons & Alerts
 @import "buttons.less";
 @import "buttons.less";
-// @import "button-groups.less";
+@import "button-groups.less";
 @import "alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less
 @import "alerts.less"; // Note: alerts share common CSS with buttons and thus have styles in buttons.less
 
 
 // Components: Nav
 // Components: Nav