From a16c63a43e1f4d29e351d197249d373014a974af Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 16 Aug 2015 20:52:30 +0200 Subject: [PATCH] feat(mixed datasources): continued work on editor design change --- pkg/api/datasources.go | 10 +++- pkg/api/frontendsettings.go | 5 ++ .../features/annotations/partials/editor.html | 3 +- public/app/features/panel/panelDirective.js | 53 +++++++++++++------ public/app/features/panel/panelSrv.js | 2 +- public/app/partials/metrics.html | 5 +- .../plugins/datasource/grafana/plugin.json | 6 +-- .../plugins/datasource/graphite/datasource.js | 1 + .../plugins/datasource/graphite/directives.js | 21 ++++++++ .../plugins/datasource/graphite/plugin.json | 2 - .../plugins/datasource/graphite/queryCtrl.js | 13 ----- .../plugins/datasource/influxdb/datasource.js | 1 + .../plugins/datasource/influxdb/directives.js | 21 ++++++++ .../plugins/datasource/influxdb/plugin.json | 2 - .../plugins/datasource/influxdb/queryCtrl.js | 13 ----- .../app/plugins/datasource/mixed/plugin.json | 6 +-- .../plugins/datasource/opentsdb/directives.js | 16 ++++++ .../plugins/datasource/opentsdb/plugin.json | 3 +- .../plugins/datasource/opentsdb/queryCtrl.js | 7 --- 19 files changed, 117 insertions(+), 73 deletions(-) create mode 100644 public/app/plugins/datasource/graphite/directives.js create mode 100644 public/app/plugins/datasource/influxdb/directives.js create mode 100644 public/app/plugins/datasource/opentsdb/directives.js diff --git a/pkg/api/datasources.go b/pkg/api/datasources.go index e0253df3cdb..52655556483 100644 --- a/pkg/api/datasources.go +++ b/pkg/api/datasources.go @@ -112,5 +112,13 @@ func UpdateDataSource(c *middleware.Context, cmd m.UpdateDataSourceCommand) { } func GetDataSourcePlugins(c *middleware.Context) { - c.JSON(200, plugins.DataSources) + dsList := make(map[string]interface{}) + + for key, value := range plugins.DataSources { + if value.(map[string]interface{})["hide"] == nil { + dsList[key] = value + } + } + + c.JSON(200, dsList) } diff --git a/pkg/api/frontendsettings.go b/pkg/api/frontendsettings.go index 7851f1d8f0d..98f8ee338b9 100644 --- a/pkg/api/frontendsettings.go +++ b/pkg/api/frontendsettings.go @@ -90,6 +90,11 @@ func getFrontendSettingsMap(c *middleware.Context) (map[string]interface{}, erro "type": "grafana", "meta": grafanaDatasourceMeta, } + // add mixed backend data source + datasources["mixed"] = map[string]interface{}{ + "type": "mixed", + "meta": plugins.DataSources["mixed"], + } if defaultDatasource == "" { defaultDatasource = "grafana" diff --git a/public/app/features/annotations/partials/editor.html b/public/app/features/annotations/partials/editor.html index 799b1f69fe4..2ff4040d098 100644 --- a/public/app/features/annotations/partials/editor.html +++ b/public/app/features/annotations/partials/editor.html @@ -72,8 +72,7 @@ -
-
+
diff --git a/public/app/features/panel/panelDirective.js b/public/app/features/panel/panelDirective.js index a697aab4722..bb60d209aad 100644 --- a/public/app/features/panel/panelDirective.js +++ b/public/app/features/panel/panelDirective.js @@ -40,6 +40,31 @@ function (angular, $, config) { }; }); + module.service('dynamicDirectiveSrv', function($compile, $parse, datasourceSrv) { + var self = this; + + this.addDirective = function(options, type, editorScope) { + var panelEl = angular.element(document.createElement(options.name + '-' + type)); + options.parentElem.append(panelEl); + $compile(panelEl)(editorScope); + }; + + this.define = function(options) { + var editorScope; + options.scope.$watch(options.datasourceProperty, function(newVal) { + if (editorScope) { + editorScope.$destroy(); + options.parentElem.empty(); + } + + editorScope = options.scope.$new(); + datasourceSrv.get(newVal).then(function(ds) { + self.addDirective(options, ds.meta.type, editorScope); + }); + }); + }; + }); + module.directive('queryEditorLoader', function($compile, $parse, datasourceSrv) { return { restrict: 'E', @@ -58,6 +83,10 @@ function (angular, $, config) { editorScope = scope.$new(); editorScope.datasource = ds; + if (!scope.target.refId) { + scope.target.refId = 'A'; + } + var panelEl = angular.element(document.createElement('metric-query-editor-' + ds.meta.type)); elem.append(panelEl); $compile(panelEl)(editorScope); @@ -67,25 +96,15 @@ function (angular, $, config) { }; }); - module.directive('queryOptionsLoader', function($compile, $parse, datasourceSrv) { + module.directive('datasourceEditorView', function(dynamicDirectiveSrv) { return { restrict: 'E', - link: function(scope, elem) { - var editorScope; - - scope.$watch("panel.datasource", function() { - - datasourceSrv.get(scope.panel.datasource).then(function(ds) { - if (editorScope) { - editorScope.$destroy(); - elem.empty(); - } - - editorScope = scope.$new(); - var panelEl = angular.element(document.createElement('metric-query-options-' + ds.meta.type)); - elem.append(panelEl); - $compile(panelEl)(editorScope); - }); + link: function(scope, elem, attrs) { + dynamicDirectiveSrv.define({ + datasourceProperty: attrs.datasource, + name: attrs.name, + scope: scope, + parentElem: elem, }); } }; diff --git a/public/app/features/panel/panelSrv.js b/public/app/features/panel/panelSrv.js index 784525c0528..adb28031a4b 100644 --- a/public/app/features/panel/panelSrv.js +++ b/public/app/features/panel/panelSrv.js @@ -74,7 +74,7 @@ function (angular, _, config) { }); if ($scope.panel.targets.length === 0) { - $scope.panel.targets = [{}]; + $scope.panel.targets = [{refId: 'A'}]; } if (datasource === 'mixed') { diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html index 9343747f53f..7b30c42a066 100644 --- a/public/app/partials/metrics.html +++ b/public/app/partials/metrics.html @@ -19,15 +19,14 @@ - - +
diff --git a/public/app/plugins/datasource/grafana/plugin.json b/public/app/plugins/datasource/grafana/plugin.json index 9358cb29af1..2baffb991eb 100644 --- a/public/app/plugins/datasource/grafana/plugin.json +++ b/public/app/plugins/datasource/grafana/plugin.json @@ -1,15 +1,11 @@ { "pluginType": "datasource", "name": "Grafana (for testing)", + "hide": true, "type": "grafana", "serviceName": "GrafanaDatasource", "module": "plugins/datasource/grafana/datasource", - - "partials": { - "query": "app/plugins/datasource/grafana/partials/query.editor.html" - }, - "metrics": true } diff --git a/public/app/plugins/datasource/graphite/datasource.js b/public/app/plugins/datasource/graphite/datasource.js index cd7c66d67a8..400ec7abc77 100644 --- a/public/app/plugins/datasource/graphite/datasource.js +++ b/public/app/plugins/datasource/graphite/datasource.js @@ -5,6 +5,7 @@ define([ 'config', 'kbn', 'moment', + './directives', './queryCtrl', './funcEditor', './addGraphiteFunc', diff --git a/public/app/plugins/datasource/graphite/directives.js b/public/app/plugins/datasource/graphite/directives.js new file mode 100644 index 00000000000..91e52bb9546 --- /dev/null +++ b/public/app/plugins/datasource/graphite/directives.js @@ -0,0 +1,21 @@ +define([ + 'angular', +], +function (angular) { + 'use strict'; + + var module = angular.module('grafana.directives'); + + module.directive('metricQueryEditorGraphite', function() { + return {controller: 'GraphiteQueryCtrl', templateUrl: 'app/plugins/datasource/graphite/partials/query.editor.html'}; + }); + + module.directive('metricQueryOptionsGraphite', function() { + return {templateUrl: 'app/plugins/datasource/graphite/partials/query.options.html'}; + }); + + module.directive('annotationsQueryEditorGraphite', function() { + return {templateUrl: 'app/plugins/datasource/graphite/partials/annotations.editor.html'}; + }); + +}); diff --git a/public/app/plugins/datasource/graphite/plugin.json b/public/app/plugins/datasource/graphite/plugin.json index 8e6766f087a..d45c446f40f 100644 --- a/public/app/plugins/datasource/graphite/plugin.json +++ b/public/app/plugins/datasource/graphite/plugin.json @@ -9,8 +9,6 @@ "partials": { "config": "app/plugins/datasource/graphite/partials/config.html", - "query": "app/plugins/datasource/graphite/partials/query.editor.html", - "annotations": "app/plugins/datasource/graphite/partials/annotations.editor.html" }, "metrics": true, diff --git a/public/app/plugins/datasource/graphite/queryCtrl.js b/public/app/plugins/datasource/graphite/queryCtrl.js index 0d1087dc53c..21b1534fbe1 100644 --- a/public/app/plugins/datasource/graphite/queryCtrl.js +++ b/public/app/plugins/datasource/graphite/queryCtrl.js @@ -10,19 +10,6 @@ function (angular, _, config, gfunc, Parser) { var module = angular.module('grafana.controllers'); - module.directive('metricQueryEditorGraphite', function() { - return { - controller: 'GraphiteQueryCtrl', - templateUrl: 'app/plugins/datasource/graphite/partials/query.editor.html', - }; - }); - - module.directive('metricQueryOptionsGraphite', function() { - return { - templateUrl: 'app/plugins/datasource/graphite/partials/query.options.html', - }; - }); - module.controller('GraphiteQueryCtrl', function($scope, $sce, templateSrv) { $scope.init = function() { diff --git a/public/app/plugins/datasource/influxdb/datasource.js b/public/app/plugins/datasource/influxdb/datasource.js index cca93fd4e3b..71714b7b40c 100644 --- a/public/app/plugins/datasource/influxdb/datasource.js +++ b/public/app/plugins/datasource/influxdb/datasource.js @@ -4,6 +4,7 @@ define([ 'kbn', './influxSeries', './queryBuilder', + './directives', './queryCtrl', './funcEditor', ], diff --git a/public/app/plugins/datasource/influxdb/directives.js b/public/app/plugins/datasource/influxdb/directives.js new file mode 100644 index 00000000000..a4c66137751 --- /dev/null +++ b/public/app/plugins/datasource/influxdb/directives.js @@ -0,0 +1,21 @@ +define([ + 'angular', +], +function (angular) { + 'use strict'; + + var module = angular.module('grafana.directives'); + + module.directive('metricQueryEditorInfluxdb', function() { + return {controller: 'InfluxQueryCtrl', templateUrl: 'app/plugins/datasource/influxdb/partials/query.editor.html'}; + }); + + module.directive('metricQueryOptionsInfluxdb', function() { + return {templateUrl: 'app/plugins/datasource/influxdb/partials/query.options.html'}; + }); + + module.directive('annotationsQueryEditorInfluxdb', function() { + return {templateUrl: 'app/plugins/datasource/influxdb/partials/annotations.editor.html'}; + }); + +}); diff --git a/public/app/plugins/datasource/influxdb/plugin.json b/public/app/plugins/datasource/influxdb/plugin.json index c93b41747a7..560b7cfb8f9 100644 --- a/public/app/plugins/datasource/influxdb/plugin.json +++ b/public/app/plugins/datasource/influxdb/plugin.json @@ -9,8 +9,6 @@ "partials": { "config": "app/plugins/datasource/influxdb/partials/config.html", - "query": "app/plugins/datasource/influxdb/partials/query.editor.html", - "annotations": "app/plugins/datasource/influxdb/partials/annotations.editor.html" }, "metrics": true, diff --git a/public/app/plugins/datasource/influxdb/queryCtrl.js b/public/app/plugins/datasource/influxdb/queryCtrl.js index 0d8a18ebd33..be87edcad21 100644 --- a/public/app/plugins/datasource/influxdb/queryCtrl.js +++ b/public/app/plugins/datasource/influxdb/queryCtrl.js @@ -8,19 +8,6 @@ function (angular, _, InfluxQueryBuilder) { var module = angular.module('grafana.controllers'); - module.directive('metricQueryEditorInfluxdb', function() { - return { - controller: 'InfluxQueryCtrl', - templateUrl: 'app/plugins/datasource/influxdb/partials/query.editor.html', - }; - }); - - module.directive('metricQueryOptionsInfluxdb', function() { - return { - templateUrl: 'app/plugins/datasource/influxdb/partials/query.options.html', - }; - }); - module.controller('InfluxQueryCtrl', function($scope, $timeout, $sce, templateSrv, $q) { $scope.init = function() { diff --git a/public/app/plugins/datasource/mixed/plugin.json b/public/app/plugins/datasource/mixed/plugin.json index af737142548..e9f99e6ead9 100644 --- a/public/app/plugins/datasource/mixed/plugin.json +++ b/public/app/plugins/datasource/mixed/plugin.json @@ -1,15 +1,11 @@ { "pluginType": "datasource", "name": "Mixed datasource", + "hide": true, "type": "mixed", "serviceName": "MixedDatasource", "module": "plugins/datasource/mixed/datasource", - - "partials": { - "query": "app/plugins/datasource/mixed/partials/query.editor.html" - }, - "metrics": true } diff --git a/public/app/plugins/datasource/opentsdb/directives.js b/public/app/plugins/datasource/opentsdb/directives.js new file mode 100644 index 00000000000..3ff4c3c2ccc --- /dev/null +++ b/public/app/plugins/datasource/opentsdb/directives.js @@ -0,0 +1,16 @@ +define([ + 'angular', +], +function (angular) { + 'use strict'; + + var module = angular.module('grafana.directives'); + + module.directive('metricQueryEditorOpentsdb', function() { + return { + controller: 'OpenTSDBQueryCtrl', + templateUrl: 'app/plugins/datasource/opentsdb/partials/query.editor.html', + }; + }); + +}); diff --git a/public/app/plugins/datasource/opentsdb/plugin.json b/public/app/plugins/datasource/opentsdb/plugin.json index dd7ab96d828..de0eb037d78 100644 --- a/public/app/plugins/datasource/opentsdb/plugin.json +++ b/public/app/plugins/datasource/opentsdb/plugin.json @@ -8,8 +8,7 @@ "module": "plugins/datasource/opentsdb/datasource", "partials": { - "config": "app/plugins/datasource/opentsdb/partials/config.html", - "query": "app/plugins/datasource/opentsdb/partials/query.editor.html" + "config": "app/plugins/datasource/opentsdb/partials/config.html" }, "metrics": true diff --git a/public/app/plugins/datasource/opentsdb/queryCtrl.js b/public/app/plugins/datasource/opentsdb/queryCtrl.js index 4f16983848f..44c8496ca8a 100644 --- a/public/app/plugins/datasource/opentsdb/queryCtrl.js +++ b/public/app/plugins/datasource/opentsdb/queryCtrl.js @@ -8,13 +8,6 @@ function (angular, _, kbn) { var module = angular.module('grafana.controllers'); - module.directive('metricQueryEditorOpentsdb', function() { - return { - controller: 'OpenTSDBQueryCtrl', - templateUrl: 'app/plugins/datasource/opentsdb/partials/query.editor.html', - }; - }); - module.controller('OpenTSDBQueryCtrl', function($scope, $timeout) { $scope.init = function() {