mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
feat(plugins): now solved all cases of loading plugin directives, now just have to upgrade all panels and data sources
This commit is contained in:
parent
dbafc8c9db
commit
c4ce3293a2
@ -17,6 +17,7 @@ import "./directives/spectrum_picker";
|
||||
import "./directives/tags";
|
||||
import "./directives/topnav";
|
||||
import "./directives/value_select_dropdown";
|
||||
import "./directives/give_focus";
|
||||
import './jquery_extended';
|
||||
import './partials';
|
||||
|
||||
|
@ -2,7 +2,7 @@
|
||||
|
||||
import coreModule from '../core_module';
|
||||
|
||||
coreModule.default.directive('giveFocus', function() {
|
||||
coreModule.directive('giveFocus', function() {
|
||||
return function(scope, element, attrs) {
|
||||
element.click(function(e) {
|
||||
e.stopPropagation();
|
||||
|
@ -28,7 +28,7 @@ class DynamicDirectiveSrv {
|
||||
directiveInfo.fn.registered = true;
|
||||
}
|
||||
|
||||
this.addDirective(elem, directiveInfo.name, scope);
|
||||
this.addDirective(elem, directiveInfo.name, directiveInfo.scope || scope);
|
||||
}).catch(err => {
|
||||
console.log('Plugin load:', err);
|
||||
this.$rootScope.appEvent('alert-error', ['Plugin error', err.toString()]);
|
||||
|
@ -11,7 +11,6 @@ function annotationsQueryEditor(dynamicDirectiveSrv) {
|
||||
},
|
||||
watch: "datasource.type",
|
||||
directive: scope => {
|
||||
console.log(scope.datasource);
|
||||
return System.import(scope.datasource.meta.module).then(function(dsModule) {
|
||||
return {
|
||||
name: 'annotation-query-editor-' + scope.datasource.meta.id,
|
||||
|
@ -5,4 +5,5 @@ define([
|
||||
'./panel_helper',
|
||||
'./solo_panel_ctrl',
|
||||
'./panel_loader',
|
||||
'./query_editor',
|
||||
], function () {});
|
||||
|
@ -23,37 +23,6 @@ function (angular, $) {
|
||||
};
|
||||
});
|
||||
|
||||
module.directive('queryEditorLoader', function($compile, $parse, datasourceSrv) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
link: function(scope, elem) {
|
||||
var editorScope;
|
||||
|
||||
scope.$watch("panel.datasource", function() {
|
||||
var datasource = scope.target.datasource || scope.panel.datasource;
|
||||
|
||||
datasourceSrv.get(datasource).then(function(ds) {
|
||||
if (editorScope) {
|
||||
editorScope.$destroy();
|
||||
elem.empty();
|
||||
}
|
||||
|
||||
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.id));
|
||||
elem.append(panelEl);
|
||||
$compile(panelEl)(editorScope);
|
||||
});
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
module.directive('panelResizer', function($rootScope) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
|
52
public/app/features/panel/query_editor.ts
Normal file
52
public/app/features/panel/query_editor.ts
Normal file
@ -0,0 +1,52 @@
|
||||
///<reference path="../../headers/common.d.ts" />
|
||||
|
||||
import angular from 'angular';
|
||||
|
||||
/** @ngInject */
|
||||
function metricsQueryEditor(dynamicDirectiveSrv, datasourceSrv) {
|
||||
return dynamicDirectiveSrv.create({
|
||||
watch: "panel.datasource",
|
||||
directive: scope => {
|
||||
let datasource = scope.target.datasource || scope.panel.datasource;
|
||||
let editorScope = null;
|
||||
|
||||
return datasourceSrv.get(datasource).then(ds => {
|
||||
if (editorScope) {
|
||||
editorScope.$destroy();
|
||||
}
|
||||
|
||||
editorScope = scope.$new();
|
||||
editorScope.datasource = ds;
|
||||
|
||||
return System.import(ds.meta.module).then(dsModule => {
|
||||
return {
|
||||
name: 'metrics-query-editor-' + ds.meta.id,
|
||||
fn: dsModule.metricsQueryEditor,
|
||||
scope: editorScope,
|
||||
};
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** @ngInject */
|
||||
function metricsQueryOptions(dynamicDirectiveSrv, datasourceSrv) {
|
||||
return dynamicDirectiveSrv.create({
|
||||
watch: "panel.datasource",
|
||||
directive: scope => {
|
||||
return datasourceSrv.get(scope.panel.datasource).then(ds => {
|
||||
return System.import(ds.meta.module).then(dsModule => {
|
||||
return {
|
||||
name: 'metrics-query-options-' + ds.meta.id,
|
||||
fn: dsModule.metricsQueryOptions
|
||||
};
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
angular.module('grafana.directives')
|
||||
.directive('metricsQueryEditor', metricsQueryEditor)
|
||||
.directive('metricsQueryOptions', metricsQueryOptions);
|
@ -1,8 +1,8 @@
|
||||
<div class="editor-row">
|
||||
|
||||
<div class="tight-form-container">
|
||||
<query-editor-loader ng-repeat="target in panel.targets" ng-class="{'tight-form-disabled': target.hide}" >
|
||||
</query-editor-loader>
|
||||
<metrics-query-editor ng-repeat="target in panel.targets" ng-class="{'tight-form-disabled': target.hide}" >
|
||||
</metrics-query-editor>
|
||||
</div>
|
||||
|
||||
<div style="margin: 20px 0 0 0">
|
||||
@ -26,7 +26,7 @@
|
||||
|
||||
</div>
|
||||
|
||||
<datasource-editor-view datasource="panel.datasource" name="metric-query-options"></datasource-editor-view>
|
||||
<metrics-query-options></metrics-query-options>
|
||||
</div>
|
||||
|
||||
<div class="editor-row" style="margin-top: 30px">
|
||||
|
@ -8,6 +8,20 @@ function (angular, _, queryDef) {
|
||||
|
||||
var module = angular.module('grafana.directives');
|
||||
|
||||
module.directive('elasticBucketAgg', function() {
|
||||
return {
|
||||
templateUrl: 'app/plugins/datasource/elasticsearch/partials/bucket_agg.html',
|
||||
controller: 'ElasticBucketAggCtrl',
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
target: "=",
|
||||
index: "=",
|
||||
onChange: "&",
|
||||
getFields: "&",
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
module.controller('ElasticBucketAggCtrl', function($scope, uiSegmentSrv, $q, $rootScope) {
|
||||
var bucketAggs = $scope.target.bucketAggs;
|
||||
|
||||
|
@ -8,6 +8,21 @@ function (angular, _, queryDef) {
|
||||
|
||||
var module = angular.module('grafana.directives');
|
||||
|
||||
module.directive('elasticMetricAgg', function() {
|
||||
return {
|
||||
templateUrl: 'app/plugins/datasource/elasticsearch/partials/metric_agg.html',
|
||||
controller: 'ElasticMetricAggCtrl',
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
target: "=",
|
||||
index: "=",
|
||||
onChange: "&",
|
||||
getFields: "&",
|
||||
esVersion: '='
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
module.controller('ElasticMetricAggCtrl', function($scope, uiSegmentSrv, $q, $rootScope) {
|
||||
var metricAggs = $scope.target.metrics;
|
||||
|
||||
|
@ -1,51 +1,19 @@
|
||||
define([
|
||||
'angular',
|
||||
'./datasource',
|
||||
'./edit_view',
|
||||
'./bucket_agg',
|
||||
'./metric_agg',
|
||||
],
|
||||
function (angular, ElasticDatasource, editView) {
|
||||
function (ElasticDatasource, editView) {
|
||||
'use strict';
|
||||
|
||||
var module = angular.module('grafana.directives');
|
||||
|
||||
module.directive('elasticMetricAgg', function() {
|
||||
return {
|
||||
templateUrl: 'app/plugins/datasource/elasticsearch/partials/metric_agg.html',
|
||||
controller: 'ElasticMetricAggCtrl',
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
target: "=",
|
||||
index: "=",
|
||||
onChange: "&",
|
||||
getFields: "&",
|
||||
esVersion: '='
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
module.directive('elasticBucketAgg', function() {
|
||||
return {
|
||||
templateUrl: 'app/plugins/datasource/elasticsearch/partials/bucket_agg.html',
|
||||
controller: 'ElasticBucketAggCtrl',
|
||||
restrict: 'E',
|
||||
scope: {
|
||||
target: "=",
|
||||
index: "=",
|
||||
onChange: "&",
|
||||
getFields: "&",
|
||||
}
|
||||
};
|
||||
});
|
||||
|
||||
module.directive('metricQueryEditorElasticsearch', function() {
|
||||
function metricsQueryEditor() {
|
||||
return {controller: 'ElasticQueryCtrl', templateUrl: 'app/plugins/datasource/elasticsearch/partials/query.editor.html'};
|
||||
});
|
||||
}
|
||||
|
||||
module.directive('metricQueryOptionsElasticsearch', function() {
|
||||
function metricsQueryOptions() {
|
||||
return {templateUrl: 'app/plugins/datasource/elasticsearch/partials/query.options.html'};
|
||||
});
|
||||
}
|
||||
|
||||
function annotationsQueryEditor() {
|
||||
return {templateUrl: 'app/plugins/datasource/elasticsearch/partials/annotations.editor.html'};
|
||||
@ -55,6 +23,8 @@ function (angular, ElasticDatasource, editView) {
|
||||
Datasource: ElasticDatasource,
|
||||
configView: editView.default,
|
||||
annotationsQueryEditor: annotationsQueryEditor,
|
||||
metricsQueryEditor: metricsQueryEditor,
|
||||
metricsQueryOptions: metricsQueryOptions,
|
||||
};
|
||||
|
||||
});
|
||||
|
@ -1,19 +1,16 @@
|
||||
define([
|
||||
'angular',
|
||||
'./datasource',
|
||||
],
|
||||
function (angular, GraphiteDatasource) {
|
||||
function (GraphiteDatasource) {
|
||||
'use strict';
|
||||
|
||||
var module = angular.module('grafana.directives');
|
||||
|
||||
module.directive('metricQueryEditorGraphite', function() {
|
||||
function metricsQueryEditor() {
|
||||
return {controller: 'GraphiteQueryCtrl', templateUrl: 'app/plugins/datasource/graphite/partials/query.editor.html'};
|
||||
});
|
||||
}
|
||||
|
||||
module.directive('metricQueryOptionsGraphite', function() {
|
||||
function metricsQueryOptions() {
|
||||
return {templateUrl: 'app/plugins/datasource/graphite/partials/query.options.html'};
|
||||
});
|
||||
}
|
||||
|
||||
function annotationsQueryEditor() {
|
||||
return {templateUrl: 'app/plugins/datasource/graphite/partials/annotations.editor.html'};
|
||||
@ -27,5 +24,7 @@ function (angular, GraphiteDatasource) {
|
||||
Datasource: GraphiteDatasource,
|
||||
configView: configView,
|
||||
annotationsQueryEditor: annotationsQueryEditor,
|
||||
metricsQueryEditor: metricsQueryEditor,
|
||||
metricsQueryOptions: metricsQueryOptions,
|
||||
};
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user