diff --git a/public/app/features/panel/metrics_panel_ctrl.ts b/public/app/features/panel/metrics_panel_ctrl.ts
index 35f4043595c..b95535441f2 100644
--- a/public/app/features/panel/metrics_panel_ctrl.ts
+++ b/public/app/features/panel/metrics_panel_ctrl.ts
@@ -1,28 +1,58 @@
///
import config from 'app/core/config';
+import $ from 'jquery';
+import _ from 'lodash';
+import kbn from 'app/core/utils/kbn';
import {PanelCtrl} from './panel_ctrl';
+import * as rangeUtil from '../../core/utils/rangeutil';
+import * as dateMath from '../../core/utils/datemath';
+
class MetricsPanelCtrl extends PanelCtrl {
error: boolean;
loading: boolean;
datasource: any;
$q: any;
+ $timeout: any;
datasourceSrv: any;
+ timeSrv: any;
+ timing: any;
+ range: any;
+ rangeRaw: any;
+ interval: any;
+ resolution: any;
+ timeInfo: any;
+ skipDataOnInit: boolean;
+ datasources: any[];
constructor($scope, $injector) {
super($scope, $injector);
+
+ // make metrics tab the default
this.editorTabIndex = 1;
+ this.$q = $injector.get('$q');
+ this.$timeout = $injector.get('$timeout');
+ this.datasourceSrv = $injector.get('datasourceSrv');
+ this.timeSrv = $injector.get('timeSrv');
if (!this.panel.targets) {
this.panel.targets = [{}];
}
+
+ // hookup initial data fetch
+ this.$timeout(() => {
+ if (!this.skipDataOnInit) {
+ this.getData();
+ }
+ }, 30);;
}
initEditorTabs() {
this.addEditorTab('Metrics', () => {
return { templateUrl: 'public/app/partials/metrics.html' };
});
+ this.datasources = this.datasourceSrv.getMetricSources();
}
refresh() {
@@ -31,7 +61,7 @@ class MetricsPanelCtrl extends PanelCtrl {
refreshData(data) {
// null op
- return data;
+ return this.$q.when(data);
}
loadSnapshot(data) {
@@ -40,8 +70,10 @@ class MetricsPanelCtrl extends PanelCtrl {
}
getData() {
+ // ignore fetching data if another panel is in fullscreen
if (this.otherPanelInFullscreenMode()) { return; }
+ // if we have snapshot data use that
if (this.panel.snapshotData) {
if (this.loadSnapshot) {
this.loadSnapshot(this.panel.snapshotData);
@@ -49,21 +81,128 @@ class MetricsPanelCtrl extends PanelCtrl {
return;
}
+ // clear loading/error state
delete this.error;
this.loading = true;
+ // load datasource service
this.datasourceSrv.get(this.panel.datasource).then(datasource => {
this.datasource = datasource;
- return this.refreshData(this.datasource) || this.$q.when({});
+ return this.refreshData(this.datasource);
}).then(() => {
this.loading = false;
- }, err => {
+ }).catch(err => {
console.log('Panel data error:', err);
this.loading = false;
this.error = err.message || "Timeseries data request error";
this.inspector = {error: err};
});
}
+
+ setTimeQueryStart() {
+ this.timing = {};
+ this.timing.queryStart = new Date().getTime();
+ }
+
+ setTimeQueryEnd() {
+ this.timing.queryEnd = new Date().getTime();
+ }
+
+ setTimeRenderStart() {
+ this.timing = this.timing || {};
+ this.timing.renderStart = new Date().getTime();
+ }
+
+ setTimeRenderEnd() {
+ this.timing.renderEnd = new Date().getTime();
+ }
+
+ updateTimeRange() {
+ this.range = this.timeSrv.timeRange();
+ this.rangeRaw = this.timeSrv.timeRange(false);
+
+ this.applyPanelTimeOverrides();
+
+ if (this.panel.maxDataPoints) {
+ this.resolution = this.panel.maxDataPoints;
+ } else {
+ this.resolution = Math.ceil($(window).width() * (this.panel.span / 12));
+ }
+
+ var panelInterval = this.panel.interval;
+ var datasourceInterval = (this.datasource || {}).interval;
+ this.interval = kbn.calculateInterval(this.range, this.resolution, panelInterval || datasourceInterval);
+ };
+
+ applyPanelTimeOverrides() {
+ this.timeInfo = '';
+
+ // check panel time overrrides
+ if (this.panel.timeFrom) {
+ var timeFromInfo = rangeUtil.describeTextRange(this.panel.timeFrom);
+ if (timeFromInfo.invalid) {
+ this.timeInfo = 'invalid time override';
+ return;
+ }
+
+ if (_.isString(this.rangeRaw.from)) {
+ var timeFromDate = dateMath.parse(timeFromInfo.from);
+ this.timeInfo = timeFromInfo.display;
+ this.rangeRaw.from = timeFromInfo.from;
+ this.rangeRaw.to = timeFromInfo.to;
+ this.range.from = timeFromDate;
+ }
+ }
+
+ if (this.panel.timeShift) {
+ var timeShiftInfo = rangeUtil.describeTextRange(this.panel.timeShift);
+ if (timeShiftInfo.invalid) {
+ this.timeInfo = 'invalid timeshift';
+ return;
+ }
+
+ var timeShift = '-' + this.panel.timeShift;
+ this.timeInfo += ' timeshift ' + timeShift;
+ this.range.from = dateMath.parseDateMath(timeShift, this.range.from, false);
+ this.range.to = dateMath.parseDateMath(timeShift, this.range.to, true);
+
+ this.rangeRaw = this.range;
+ }
+
+ if (this.panel.hideTimeOverride) {
+ this.timeInfo = '';
+ }
+ };
+
+ issueQueries() {
+ if (!this.panel.targets || this.panel.targets.length === 0) {
+ return this.$q.when([]);
+ }
+
+ this.updateTimeRange();
+
+ var metricsQuery = {
+ range: this.range,
+ rangeRaw: this.rangeRaw,
+ interval: this.interval,
+ targets: this.panel.targets,
+ format: this.panel.renderer === 'png' ? 'png' : 'json',
+ maxDataPoints: this.resolution,
+ scopedVars: this.panel.scopedVars,
+ cacheTimeout: this.panel.cacheTimeout
+ };
+
+ this.setTimeQueryStart();
+ return this.datasource.query(metricsQuery).then(results => {
+ this.setTimeQueryEnd();
+
+ if (this.dashboard.snapshot) {
+ this.panel.snapshotData = results;
+ }
+
+ return results;
+ });
+ }
}
export {MetricsPanelCtrl};
diff --git a/public/app/features/panel/panel.ts b/public/app/features/panel/panel.ts
index 4d80bb9dade..39d3a76005a 100644
--- a/public/app/features/panel/panel.ts
+++ b/public/app/features/panel/panel.ts
@@ -25,11 +25,14 @@ class PanelDirective {
controllerAs: 'ctrl',
bindToController: true,
scope: {dashboard: "=", panel: "=", row: "="},
- link: this.link
+ link: (scope, elem, attrs, ctrl) => {
+ ctrl.init();
+ this.link(scope, elem, attrs, ctrl);
+ }
};
}
- link(scope, elem) {
+ link(scope, elem, attrs, ctrl) {
return null;
}
}
diff --git a/public/app/features/panel/panel_ctrl.ts b/public/app/features/panel/panel_ctrl.ts
index f762a964103..fb44a3d260d 100644
--- a/public/app/features/panel/panel_ctrl.ts
+++ b/public/app/features/panel/panel_ctrl.ts
@@ -27,11 +27,14 @@ export class PanelCtrl {
this.name = plugin.name;
this.icon = plugin.info.icon;
this.editorTabIndex = 0;
- this.publishAppEvent('panel-instantiated', {scope: $scope});
$scope.$on("refresh", () => this.refresh());
}
+ init() {
+ this.publishAppEvent('panel-instantiated', {scope: this.$scope});
+ }
+
refresh() {
return;
}
diff --git a/public/app/headers/common.d.ts b/public/app/headers/common.d.ts
index f88ed4fcee0..b66ba845827 100644
--- a/public/app/headers/common.d.ts
+++ b/public/app/headers/common.d.ts
@@ -5,7 +5,7 @@ declare var System: any;
// dummy modules
declare module 'app/core/config' {
- var config : any;
+ var config: any;
export default config;
}
@@ -35,7 +35,7 @@ declare module 'app/core/utils/kbn' {
}
declare module 'app/core/store' {
- var store : any;
+ var store: any;
export default store;
}
diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html
index a6f8d022407..390f5627486 100644
--- a/public/app/partials/metrics.html
+++ b/public/app/partials/metrics.html
@@ -18,7 +18,7 @@
@@ -38,7 +38,7 @@
diff --git a/public/app/plugins/panel/test/module.html b/public/app/plugins/panel/test/module.html
index 47b59289210..10b5eeae608 100644
--- a/public/app/plugins/panel/test/module.html
+++ b/public/app/plugins/panel/test/module.html
@@ -1,4 +1,5 @@
Test panel!
panel.id: {{ctrl.panel.id}}
+ data: {{ctrl.data}}
diff --git a/public/app/plugins/panel/test/module.ts b/public/app/plugins/panel/test/module.ts
index 6fe2a3325b0..21b6479c19a 100644
--- a/public/app/plugins/panel/test/module.ts
+++ b/public/app/plugins/panel/test/module.ts
@@ -13,12 +13,13 @@ export class TestPanelCtrl extends MetricsPanelCtrl {
super($scope, $injector);
}
- initEditorTabs() {
- super.initEditorTabs();
- }
-
refreshData(data) {
- console.log('refreshData: ', data);
+ return this.issueQueries().then(res => {
+ this.data = res.data[0].target;
+ console.log('issueQueries', res);
+ }).catch(err => {
+ console.log('Errrrr! in test panel', err);
+ });
}
}