mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
feat(plugins): updated cloudwatch to new plugin style
This commit is contained in:
@@ -28,7 +28,7 @@ class DynamicDirectiveSrv {
|
|||||||
directiveInfo.fn.registered = true;
|
directiveInfo.fn.registered = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.addDirective(elem, directiveInfo.name, directiveInfo.scope || scope);
|
this.addDirective(elem, directiveInfo.name, scope);
|
||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
console.log('Plugin load:', err);
|
console.log('Plugin load:', err);
|
||||||
this.$rootScope.appEvent('alert-error', ['Plugin error', err.toString()]);
|
this.$rootScope.appEvent('alert-error', ['Plugin error', err.toString()]);
|
||||||
@@ -41,7 +41,14 @@ class DynamicDirectiveSrv {
|
|||||||
scope: options.scope,
|
scope: options.scope,
|
||||||
link: (scope, elem, attrs) => {
|
link: (scope, elem, attrs) => {
|
||||||
if (options.watch) {
|
if (options.watch) {
|
||||||
scope.$watch(options.watch,() => this.link(scope, elem, attrs, options));
|
let childScope = null;
|
||||||
|
scope.$watch(options.watch, () => {
|
||||||
|
if (childScope) {
|
||||||
|
childScope.$destroy();
|
||||||
|
}
|
||||||
|
childScope = scope.$new();
|
||||||
|
this.link(childScope, elem, attrs, options);
|
||||||
|
});
|
||||||
} else {
|
} else {
|
||||||
this.link(scope, elem, attrs, options);
|
this.link(scope, elem, attrs, options);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -31,10 +31,10 @@ function (angular, _, $) {
|
|||||||
};
|
};
|
||||||
|
|
||||||
$scope.datasourceChanged = function() {
|
$scope.datasourceChanged = function() {
|
||||||
$scope.currentDatasource = _.findWhere($scope.datasources, { name: $scope.currentAnnotation.datasource });
|
datasourceSrv.get($scope.currentAnnotation.datasource).then(function(ds) {
|
||||||
if (!$scope.currentDatasource) {
|
$scope.currentDatasource = ds;
|
||||||
$scope.currentDatasource = $scope.datasources[0];
|
$scope.currentAnnotation.datasource = ds.name;
|
||||||
}
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
$scope.edit = function(annotation) {
|
$scope.edit = function(annotation) {
|
||||||
@@ -50,7 +50,6 @@ function (angular, _, $) {
|
|||||||
$scope.currentAnnotation = angular.copy(annotationDefaults);
|
$scope.currentAnnotation = angular.copy(annotationDefaults);
|
||||||
$scope.currentIsNew = true;
|
$scope.currentIsNew = true;
|
||||||
$scope.datasourceChanged();
|
$scope.datasourceChanged();
|
||||||
$scope.currentAnnotation.datasource = $scope.currentDatasource.name;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
$scope.update = function() {
|
$scope.update = function() {
|
||||||
|
|||||||
@@ -8,21 +8,13 @@ function metricsQueryEditor(dynamicDirectiveSrv, datasourceSrv) {
|
|||||||
watch: "panel.datasource",
|
watch: "panel.datasource",
|
||||||
directive: scope => {
|
directive: scope => {
|
||||||
let datasource = scope.target.datasource || scope.panel.datasource;
|
let datasource = scope.target.datasource || scope.panel.datasource;
|
||||||
let editorScope = null;
|
|
||||||
|
|
||||||
return datasourceSrv.get(datasource).then(ds => {
|
return datasourceSrv.get(datasource).then(ds => {
|
||||||
if (editorScope) {
|
scope.datasource = ds;
|
||||||
editorScope.$destroy();
|
|
||||||
}
|
|
||||||
|
|
||||||
editorScope = scope.$new();
|
|
||||||
editorScope.datasource = ds;
|
|
||||||
|
|
||||||
return System.import(ds.meta.module).then(dsModule => {
|
return System.import(ds.meta.module).then(dsModule => {
|
||||||
return {
|
return {
|
||||||
name: 'metrics-query-editor-' + ds.meta.id,
|
name: 'metrics-query-editor-' + ds.meta.id,
|
||||||
fn: dsModule.metricsQueryEditor,
|
fn: dsModule.metricsQueryEditor,
|
||||||
scope: editorScope,
|
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -3,7 +3,6 @@ define([
|
|||||||
'lodash',
|
'lodash',
|
||||||
'moment',
|
'moment',
|
||||||
'app/core/utils/datemath',
|
'app/core/utils/datemath',
|
||||||
'./query_ctrl',
|
|
||||||
],
|
],
|
||||||
function (angular, _, moment, dateMath) {
|
function (angular, _, moment, dateMath) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|||||||
@@ -1,33 +1,18 @@
|
|||||||
define([
|
define([
|
||||||
'angular',
|
|
||||||
'./datasource',
|
'./datasource',
|
||||||
'./query_parameter_ctrl',
|
'./query_parameter_ctrl',
|
||||||
|
'./query_ctrl',
|
||||||
],
|
],
|
||||||
function (angular, CloudWatchDatasource) {
|
function (CloudWatchDatasource) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var module = angular.module('grafana.directives');
|
function metricsQueryEditor() {
|
||||||
|
|
||||||
module.directive('metricQueryEditorCloudwatch', function() {
|
|
||||||
return {controller: 'CloudWatchQueryCtrl', templateUrl: 'app/plugins/datasource/cloudwatch/partials/query.editor.html'};
|
return {controller: 'CloudWatchQueryCtrl', templateUrl: 'app/plugins/datasource/cloudwatch/partials/query.editor.html'};
|
||||||
});
|
}
|
||||||
|
|
||||||
module.directive('annotationsQueryEditorCloudwatch', function() {
|
function annotationsQueryEditor() {
|
||||||
return {templateUrl: 'app/plugins/datasource/cloudwatch/partials/annotations.editor.html'};
|
return {templateUrl: 'app/plugins/datasource/cloudwatch/partials/annotations.editor.html'};
|
||||||
});
|
}
|
||||||
|
|
||||||
module.directive('cloudwatchQueryParameter', function() {
|
|
||||||
return {
|
|
||||||
templateUrl: 'app/plugins/datasource/cloudwatch/partials/query.parameter.html',
|
|
||||||
controller: 'CloudWatchQueryParameterCtrl',
|
|
||||||
restrict: 'E',
|
|
||||||
scope: {
|
|
||||||
target: "=",
|
|
||||||
datasourceName: "@",
|
|
||||||
onChange: "&",
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
function configView() {
|
function configView() {
|
||||||
return {templateUrl: 'app/plugins/datasource/cloudwatch/partials/edit_view.html'};
|
return {templateUrl: 'app/plugins/datasource/cloudwatch/partials/edit_view.html'};
|
||||||
@@ -36,5 +21,7 @@ function (angular, CloudWatchDatasource) {
|
|||||||
return {
|
return {
|
||||||
Datasource: CloudWatchDatasource,
|
Datasource: CloudWatchDatasource,
|
||||||
configView: configView,
|
configView: configView,
|
||||||
|
annotationsQueryEditor: annotationsQueryEditor,
|
||||||
|
metricsQueryEditor: metricsQueryEditor,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1 +1 @@
|
|||||||
<cloudwatch-query-parameter target="currentAnnotation" datasource-name="{{currentAnnotation.datasource}}"></cloudwatch-query-parameter>
|
<cloudwatch-query-parameter target="annotation" datasource="datasource"></cloudwatch-query-parameter>
|
||||||
|
|||||||
@@ -35,4 +35,4 @@
|
|||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<cloudwatch-query-parameter target="target" datasource-name="{{datasource.name}}" on-change="refreshMetricData()"></cloudwatch-query-parameter>
|
<cloudwatch-query-parameter target="target" datasource="datasource" on-change="refreshMetricData()"></cloudwatch-query-parameter>
|
||||||
|
|||||||
@@ -7,6 +7,19 @@ function (angular, _) {
|
|||||||
|
|
||||||
var module = angular.module('grafana.controllers');
|
var module = angular.module('grafana.controllers');
|
||||||
|
|
||||||
|
module.directive('cloudwatchQueryParameter', function() {
|
||||||
|
return {
|
||||||
|
templateUrl: 'app/plugins/datasource/cloudwatch/partials/query.parameter.html',
|
||||||
|
controller: 'CloudWatchQueryParameterCtrl',
|
||||||
|
restrict: 'E',
|
||||||
|
scope: {
|
||||||
|
target: "=",
|
||||||
|
datasource: "=",
|
||||||
|
onChange: "&",
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
module.controller('CloudWatchQueryParameterCtrl', function($scope, templateSrv, uiSegmentSrv, datasourceSrv, $q) {
|
module.controller('CloudWatchQueryParameterCtrl', function($scope, templateSrv, uiSegmentSrv, datasourceSrv, $q) {
|
||||||
|
|
||||||
$scope.init = function() {
|
$scope.init = function() {
|
||||||
@@ -38,12 +51,9 @@ function (angular, _) {
|
|||||||
$scope.removeDimSegment = uiSegmentSrv.newSegment({fake: true, value: '-- remove dimension --'});
|
$scope.removeDimSegment = uiSegmentSrv.newSegment({fake: true, value: '-- remove dimension --'});
|
||||||
$scope.removeStatSegment = uiSegmentSrv.newSegment({fake: true, value: '-- remove stat --'});
|
$scope.removeStatSegment = uiSegmentSrv.newSegment({fake: true, value: '-- remove stat --'});
|
||||||
|
|
||||||
datasourceSrv.get($scope.datasourceName).then(function(datasource) {
|
if (_.isEmpty($scope.target.region)) {
|
||||||
$scope.datasource = datasource;
|
$scope.target.region = $scope.datasource.getDefaultRegion();
|
||||||
if (_.isEmpty($scope.target.region)) {
|
}
|
||||||
$scope.target.region = $scope.datasource.getDefaultRegion();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!$scope.onChange) {
|
if (!$scope.onChange) {
|
||||||
$scope.onChange = function() {};
|
$scope.onChange = function() {};
|
||||||
|
|||||||
@@ -1,14 +1,14 @@
|
|||||||
<div class="editor-row">
|
<div class="editor-row">
|
||||||
<div class="section" ng-if="currentAnnotation.index">
|
<div class="section" ng-if="annotation.index">
|
||||||
<h5>Index name</h5>
|
<h5>Index name</h5>
|
||||||
<div class="editor-option">
|
<div class="editor-option">
|
||||||
<input type="text" class="span4" ng-model='currentAnnotation.index' placeholder="events-*"></input>
|
<input type="text" class="span4" ng-model='annotation.index' placeholder="events-*"></input>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="section">
|
<div class="section">
|
||||||
<h5>Search query (lucene) <tip>Use [[filterName]] in query to replace part of the query with a filter value</tip></h5>
|
<h5>Search query (lucene) <tip>Use [[filterName]] in query to replace part of the query with a filter value</tip></h5>
|
||||||
<div class="editor-option">
|
<div class="editor-option">
|
||||||
<input type="text" class="span6" ng-model='currentAnnotation.query' placeholder="tags:deploy"></input>
|
<input type="text" class="span6" ng-model='annotation.query' placeholder="tags:deploy"></input>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -18,22 +18,22 @@
|
|||||||
<h5>Field mappings</h5>
|
<h5>Field mappings</h5>
|
||||||
<div class="editor-option">
|
<div class="editor-option">
|
||||||
<label class="small">Time</label>
|
<label class="small">Time</label>
|
||||||
<input type="text" class="input-small" ng-model='currentAnnotation.timeField' placeholder="@timestamp"></input>
|
<input type="text" class="input-small" ng-model='annotation.timeField' placeholder="@timestamp"></input>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="editor-option">
|
<div class="editor-option">
|
||||||
<label class="small">Title</label>
|
<label class="small">Title</label>
|
||||||
<input type="text" class="input-small" ng-model='currentAnnotation.titleField' placeholder="desc"></input>
|
<input type="text" class="input-small" ng-model='annotation.titleField' placeholder="desc"></input>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="editor-option">
|
<div class="editor-option">
|
||||||
<label class="small">Tags</label>
|
<label class="small">Tags</label>
|
||||||
<input type="text" class="input-small" ng-model='currentAnnotation.tagsField' placeholder="tags"></input>
|
<input type="text" class="input-small" ng-model='annotation.tagsField' placeholder="tags"></input>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="editor-option">
|
<div class="editor-option">
|
||||||
<label class="small">Text</label>
|
<label class="small">Text</label>
|
||||||
<input type="text" class="input-small" ng-model='currentAnnotation.textField' placeholder=""></input>
|
<input type="text" class="input-small" ng-model='annotation.textField' placeholder=""></input>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user