");
+
+ scope.height = '200px';
+ scope.panel = {
+ legend: {},
+ grid: { },
+ y_formats: [],
+ seriesOverrides: [],
+ tooltip: {
+ shared: true
+ }
+ };
+
+ scope.panelRenderingComplete = sinon.spy();
+ scope.appEvent = sinon.spy();
+ scope.onAppEvent = sinon.spy();
+ scope.hiddenSeries = {};
+ scope.dashboard = { timezone: 'browser' };
+ scope.range = {
+ from: new Date('2014-08-09 10:00:00'),
+ to: new Date('2014-09-09 13:00:00')
+ };
+ ctx.data = [];
+ ctx.data.push(new TimeSeries({
+ datapoints: [[1,1],[2,2]],
+ alias: 'series1'
+ }));
+ ctx.data.push(new TimeSeries({
+ datapoints: [[1,1],[2,2]],
+ alias: 'series2'
+ }));
+
+ setupFunc(scope, ctx.data);
+
+ $compile(element)(scope);
+ scope.$digest();
+ $.plot = ctx.plotSpy = sinon.spy();
+
+ scope.$emit('render', ctx.data);
+ ctx.plotData = ctx.plotSpy.getCall(0).args[1];
+ ctx.plotOptions = ctx.plotSpy.getCall(0).args[2];
+ }));
+ };
+
+ func(ctx);
+ });
+ }
+
+ graphScenario('simple lines options', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.lines = true;
+ scope.panel.fill = 5;
+ scope.panel.linewidth = 3;
+ scope.panel.steppedLine = true;
+ });
+
+ it('should configure plot with correct options', function() {
+ expect(ctx.plotOptions.series.lines.show).to.be(true);
+ expect(ctx.plotOptions.series.lines.fill).to.be(0.5);
+ expect(ctx.plotOptions.series.lines.lineWidth).to.be(3);
+ expect(ctx.plotOptions.series.lines.steps).to.be(true);
+ });
+ });
+
+ graphScenario('grid thresholds 100, 200', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.grid = {
+ threshold1: 100,
+ threshold1Color: "#111",
+ threshold2: 200,
+ threshold2Color: "#222",
+ };
+ });
+
+ it('should add grid markings', function() {
+ var markings = ctx.plotOptions.grid.markings;
+ expect(markings[0].yaxis.from).to.be(100);
+ expect(markings[0].yaxis.to).to.be(200);
+ expect(markings[0].color).to.be('#111');
+ expect(markings[1].yaxis.from).to.be(200);
+ expect(markings[1].yaxis.to).to.be(Infinity);
+ });
+ });
+
+ graphScenario('inverted grid thresholds 200, 100', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.grid = {
+ threshold1: 200,
+ threshold1Color: "#111",
+ threshold2: 100,
+ threshold2Color: "#222",
+ };
+ });
+
+ it('should add grid markings', function() {
+ var markings = ctx.plotOptions.grid.markings;
+ expect(markings[0].yaxis.from).to.be(200);
+ expect(markings[0].yaxis.to).to.be(100);
+ expect(markings[0].color).to.be('#111');
+ expect(markings[1].yaxis.from).to.be(100);
+ expect(markings[1].yaxis.to).to.be(-Infinity);
+ });
+ });
+
+ graphScenario('grid thresholds from zero', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.grid = {
+ threshold1: 0,
+ threshold1Color: "#111",
+ };
+ });
+
+ it('should add grid markings', function() {
+ var markings = ctx.plotOptions.grid.markings;
+ expect(markings[0].yaxis.from).to.be(0);
+ });
+ });
+
+ graphScenario('when logBase is log 10', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.grid = {
+ leftMax: null,
+ rightMax: null,
+ leftMin: null,
+ rightMin: null,
+ leftLogBase: 10,
+ };
+ });
+
+ it('should apply axis transform and ticks', function() {
+ var axis = ctx.plotOptions.yaxes[0];
+ expect(axis.transform(100)).to.be(Math.log(100+0.1));
+ expect(axis.ticks[0]).to.be(0);
+ expect(axis.ticks[1]).to.be(1);
+ });
+ });
+
+ graphScenario('should use timeStep for barWidth', function(ctx) {
+ ctx.setup(function(scope, data) {
+ scope.panel.bars = true;
+ data[0] = new TimeSeries({
+ datapoints: [[1,10],[2,20]],
+ alias: 'series1',
+ });
+ });
+
+ it('should set barWidth', function() {
+ expect(ctx.plotOptions.series.bars.barWidth).to.be(10/1.5);
+ });
+ });
+
+ graphScenario('series option overrides, fill & points', function(ctx) {
+ ctx.setup(function(scope, data) {
+ scope.panel.lines = true;
+ scope.panel.fill = 5;
+ scope.panel.seriesOverrides = [
+ { alias: 'test', fill: 0, points: true }
+ ];
+
+ data[1].alias = 'test';
+ });
+
+ it('should match second series and fill zero, and enable points', function() {
+ expect(ctx.plotOptions.series.lines.fill).to.be(0.5);
+ expect(ctx.plotData[1].lines.fill).to.be(0.001);
+ expect(ctx.plotData[1].points.show).to.be(true);
+ });
+ });
+
+ graphScenario('should order series order according to zindex', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.seriesOverrides = [{ alias: 'series1', zindex: 2 }];
+ });
+
+ it('should move zindex 2 last', function() {
+ expect(ctx.plotData[0].alias).to.be('series2');
+ expect(ctx.plotData[1].alias).to.be('series1');
+ });
+ });
+
+ graphScenario('when series is hidden', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.hiddenSeries = {'series2': true};
+ });
+
+ it('should remove datapoints and disable stack', function() {
+ expect(ctx.plotData[0].alias).to.be('series1');
+ expect(ctx.plotData[1].data.length).to.be(0);
+ expect(ctx.plotData[1].stack).to.be(false);
+ });
+ });
+
+ graphScenario('when stack and percent', function(ctx) {
+ ctx.setup(function(scope) {
+ scope.panel.percentage = true;
+ scope.panel.stack = true;
+ });
+
+ it('should show percentage', function() {
+ var axis = ctx.plotOptions.yaxes[0];
+ expect(axis.tickFormatter(100, axis)).to.be("100%");
+ });
+ });
+});
diff --git a/public/app/plugins/panel/graph/specs/tooltip_specs.ts b/public/app/plugins/panel/graph/specs/tooltip_specs.ts
new file mode 100644
index 00000000000..de173350b2b
--- /dev/null
+++ b/public/app/plugins/panel/graph/specs/tooltip_specs.ts
@@ -0,0 +1,171 @@
+///
+
+import {describe, beforeEach, it, sinon, expect, angularMocks} from '../../../../../test/lib/common';
+
+import $ from 'jquery';
+import GraphTooltip from '../graph_tooltip';
+
+var scope = {
+ appEvent: sinon.spy(),
+ onAppEvent: sinon.spy(),
+};
+
+var elem = $('
');
+var dashboard = { };
+
+function describeSharedTooltip(desc, fn) {
+ var ctx: any = {};
+ ctx.scope = scope;
+ ctx.scope.panel = {
+ tooltip: {
+ shared: true
+ },
+ legend: { },
+ stack: false
+ };
+
+ ctx.setup = function(setupFn) {
+ ctx.setupFn = setupFn;
+ };
+
+ describe(desc, function() {
+ beforeEach(function() {
+ ctx.setupFn();
+ var tooltip = new GraphTooltip(elem, dashboard, scope);
+ ctx.results = tooltip.getMultiSeriesPlotHoverInfo(ctx.data, ctx.pos);
+ });
+
+ fn(ctx);
+ });
+}
+
+describeSharedTooltip("steppedLine false, stack false", function(ctx) {
+ ctx.setup(function() {
+ ctx.data = [
+ { data: [[10, 15], [12, 20]], lines: {} },
+ { data: [[10, 2], [12, 3]], lines: {} }
+ ];
+ ctx.pos = { x: 11 };
+ });
+
+ it('should return 2 series', function() {
+ expect(ctx.results.length).to.be(2);
+ });
+ it('should add time to results array', function() {
+ expect(ctx.results.time).to.be(10);
+ });
+ it('should set value and hoverIndex', function() {
+ expect(ctx.results[0].value).to.be(15);
+ expect(ctx.results[1].value).to.be(2);
+ expect(ctx.results[0].hoverIndex).to.be(0);
+ });
+});
+
+describeSharedTooltip("one series is hidden", function(ctx) {
+ ctx.setup(function() {
+ ctx.data = [
+ { data: [[10, 15], [12, 20]], },
+ { data: [] }
+ ];
+ ctx.pos = { x: 11 };
+ });
+});
+
+describeSharedTooltip("steppedLine false, stack true, individual false", function(ctx) {
+ ctx.setup(function() {
+ ctx.data = [
+ {
+ data: [[10, 15], [12, 20]],
+ lines: {},
+ datapoints: {
+ pointsize: 2,
+ points: [[10,15], [12,20]],
+ },
+ stack: true,
+ },
+ {
+ data: [[10, 2], [12, 3]],
+ lines: {},
+ datapoints: {
+ pointsize: 2,
+ points: [[10, 2], [12, 3]],
+ },
+ stack: true
+ }
+ ];
+ ctx.scope.panel.stack = true;
+ ctx.pos = { x: 11 };
+ });
+
+ it('should show stacked value', function() {
+ expect(ctx.results[1].value).to.be(17);
+ });
+});
+
+describeSharedTooltip("steppedLine false, stack true, individual false, series stack false", function(ctx) {
+ ctx.setup(function() {
+ ctx.data = [
+ {
+ data: [[10, 15], [12, 20]],
+ lines: {},
+ datapoints: {
+ pointsize: 2,
+ points: [[10, 15], [12, 20]],
+ },
+ stack: true
+ },
+ {
+ data: [[10, 2], [12, 3]],
+ lines: {},
+ datapoints: {
+ pointsize: 2,
+ points: [[10, 2], [12, 3]],
+ },
+ stack: false
+ }
+ ];
+ ctx.scope.panel.stack = true;
+ ctx.pos = { x: 11 };
+ });
+
+ it('should not show stacked value', function() {
+ expect(ctx.results[1].value).to.be(2);
+ });
+
+});
+
+describeSharedTooltip("steppedLine false, stack true, individual true", function(ctx) {
+ ctx.setup(function() {
+ ctx.data = [
+ {
+ data: [[10, 15], [12, 20]],
+ lines: {},
+ datapoints: {
+ pointsize: 2,
+ points: [[10, 15], [12, 20]],
+ },
+ stack: true
+ },
+ {
+ data: [[10, 2], [12, 3]],
+ lines: {},
+ datapoints: {
+ pointsize: 2,
+ points: [[10, 2], [12, 3]],
+ },
+ stack: false
+ }
+ ];
+ ctx.scope.panel.stack = true;
+ ctx.scope.panel.tooltip.value_type = 'individual';
+ ctx.pos = { x: 11 };
+ });
+
+ it('should not show stacked value', function() {
+ expect(ctx.results[1].value).to.be(2);
+ });
+
+});
+
+
+
diff --git a/public/app/plugins/panel/singlestat/controller.js b/public/app/plugins/panel/singlestat/controller.js
new file mode 100644
index 00000000000..62ae13d0f5f
--- /dev/null
+++ b/public/app/plugins/panel/singlestat/controller.js
@@ -0,0 +1,245 @@
+define([
+ 'angular',
+ 'app/app',
+ 'lodash',
+ 'app/core/utils/kbn',
+ 'app/core/time_series',
+ 'app/features/panel/panel_meta',
+],
+function (angular, app, _, kbn, TimeSeries, PanelMeta) {
+ 'use strict';
+
+ /** @ngInject */
+ function SingleStatCtrl($scope, panelSrv, panelHelper) {
+
+ $scope.panelMeta = new PanelMeta({
+ panelName: 'Singlestat',
+ editIcon: "fa fa-dashboard",
+ fullscreen: true,
+ metricsEditor: true
+ });
+
+ $scope.fontSizes = ['20%', '30%','50%','70%','80%','100%', '110%', '120%', '150%', '170%', '200%'];
+
+ $scope.panelMeta.addEditorTab('Options', 'app/plugins/panel/singlestat/editor.html');
+ $scope.panelMeta.addEditorTab('Time range', 'app/features/panel/partials/panelTime.html');
+
+ // Set and populate defaults
+ var _d = {
+ links: [],
+ datasource: null,
+ maxDataPoints: 100,
+ interval: null,
+ targets: [{}],
+ cacheTimeout: null,
+ format: 'none',
+ prefix: '',
+ postfix: '',
+ nullText: null,
+ valueMaps: [
+ { value: 'null', op: '=', text: 'N/A' }
+ ],
+ nullPointMode: 'connected',
+ valueName: 'avg',
+ prefixFontSize: '50%',
+ valueFontSize: '80%',
+ postfixFontSize: '50%',
+ thresholds: '',
+ colorBackground: false,
+ colorValue: false,
+ colors: ["rgba(245, 54, 54, 0.9)", "rgba(237, 129, 40, 0.89)", "rgba(50, 172, 45, 0.97)"],
+ sparkline: {
+ show: false,
+ full: false,
+ lineColor: 'rgb(31, 120, 193)',
+ fillColor: 'rgba(31, 118, 189, 0.18)',
+ }
+ };
+
+ _.defaults($scope.panel, _d);
+ $scope.unitFormats = kbn.getUnitFormats();
+
+ $scope.setUnitFormat = function(subItem) {
+ $scope.panel.format = subItem.value;
+ $scope.render();
+ };
+
+ $scope.init = function() {
+ panelSrv.init($scope);
+ };
+
+ $scope.refreshData = function(datasource) {
+ panelHelper.updateTimeRange($scope);
+
+ return panelHelper.issueMetricQuery($scope, datasource)
+ .then($scope.dataHandler, function(err) {
+ $scope.series = [];
+ $scope.render();
+ throw err;
+ });
+ };
+
+ $scope.loadSnapshot = function(snapshotData) {
+ panelHelper.updateTimeRange($scope);
+ $scope.dataHandler(snapshotData);
+ };
+
+ $scope.dataHandler = function(results) {
+ $scope.series = _.map(results.data, $scope.seriesHandler);
+ $scope.render();
+ };
+
+ $scope.seriesHandler = function(seriesData) {
+ var series = new TimeSeries({
+ datapoints: seriesData.datapoints,
+ alias: seriesData.target,
+ });
+
+ series.flotpairs = series.getFlotPairs($scope.panel.nullPointMode);
+
+ return series;
+ };
+
+ $scope.setColoring = function(options) {
+ if (options.background) {
+ $scope.panel.colorValue = false;
+ $scope.panel.colors = ['rgba(71, 212, 59, 0.4)', 'rgba(245, 150, 40, 0.73)', 'rgba(225, 40, 40, 0.59)'];
+ }
+ else {
+ $scope.panel.colorBackground = false;
+ $scope.panel.colors = ['rgba(50, 172, 45, 0.97)', 'rgba(237, 129, 40, 0.89)', 'rgba(245, 54, 54, 0.9)'];
+ }
+ $scope.render();
+ };
+
+ $scope.invertColorOrder = function() {
+ var tmp = $scope.panel.colors[0];
+ $scope.panel.colors[0] = $scope.panel.colors[2];
+ $scope.panel.colors[2] = tmp;
+ $scope.render();
+ };
+
+ $scope.getDecimalsForValue = function(value) {
+ if (_.isNumber($scope.panel.decimals)) {
+ return { decimals: $scope.panel.decimals, scaledDecimals: null };
+ }
+
+ var delta = value / 2;
+ var dec = -Math.floor(Math.log(delta) / Math.LN10);
+
+ var magn = Math.pow(10, -dec),
+ norm = delta / magn, // norm is between 1.0 and 10.0
+ size;
+
+ if (norm < 1.5) {
+ size = 1;
+ } else if (norm < 3) {
+ size = 2;
+ // special case for 2.5, requires an extra decimal
+ if (norm > 2.25) {
+ size = 2.5;
+ ++dec;
+ }
+ } else if (norm < 7.5) {
+ size = 5;
+ } else {
+ size = 10;
+ }
+
+ size *= magn;
+
+ // reduce starting decimals if not needed
+ if (Math.floor(value) === value) { dec = 0; }
+
+ var result = {};
+ result.decimals = Math.max(0, dec);
+ result.scaledDecimals = result.decimals - Math.floor(Math.log(size) / Math.LN10) + 2;
+
+ return result;
+ };
+
+ $scope.render = function() {
+ var data = {};
+
+ $scope.setValues(data);
+
+ data.thresholds = $scope.panel.thresholds.split(',').map(function(strVale) {
+ return Number(strVale.trim());
+ });
+
+ data.colorMap = $scope.panel.colors;
+
+ $scope.data = data;
+ $scope.$broadcast('render');
+ };
+
+ $scope.setValues = function(data) {
+ data.flotpairs = [];
+
+ if($scope.series.length > 1) {
+ $scope.inspector.error = new Error();
+ $scope.inspector.error.message = 'Multiple Series Error';
+ $scope.inspector.error.data = 'Metric query returns ' + $scope.series.length +
+ ' series. Single Stat Panel expects a single series.\n\nResponse:\n'+JSON.stringify($scope.series);
+ throw $scope.inspector.error;
+ }
+
+ if ($scope.series && $scope.series.length > 0) {
+ var lastPoint = _.last($scope.series[0].datapoints);
+ var lastValue = _.isArray(lastPoint) ? lastPoint[0] : null;
+
+ if (_.isString(lastValue)) {
+ data.value = 0;
+ data.valueFormated = lastValue;
+ data.valueRounded = 0;
+ } else {
+ data.value = $scope.series[0].stats[$scope.panel.valueName];
+ data.flotpairs = $scope.series[0].flotpairs;
+
+ var decimalInfo = $scope.getDecimalsForValue(data.value);
+ var formatFunc = kbn.valueFormats[$scope.panel.format];
+ data.valueFormated = formatFunc(data.value, decimalInfo.decimals, decimalInfo.scaledDecimals);
+ data.valueRounded = kbn.roundValue(data.value, decimalInfo.decimals);
+ }
+ }
+
+ // check value to text mappings
+ for(var i = 0; i < $scope.panel.valueMaps.length; i++) {
+ var map = $scope.panel.valueMaps[i];
+ // special null case
+ if (map.value === 'null') {
+ if (data.value === null || data.value === void 0) {
+ data.valueFormated = map.text;
+ return;
+ }
+ continue;
+ }
+
+ // value/number to text mapping
+ var value = parseFloat(map.value);
+ if (value === data.value) {
+ data.valueFormated = map.text;
+ return;
+ }
+ }
+
+ if (data.value === null || data.value === void 0) {
+ data.valueFormated = "no value";
+ }
+ };
+
+ $scope.removeValueMap = function(map) {
+ var index = _.indexOf($scope.panel.valueMaps, map);
+ $scope.panel.valueMaps.splice(index, 1);
+ $scope.render();
+ };
+
+ $scope.addValueMap = function() {
+ $scope.panel.valueMaps.push({value: '', op: '=', text: '' });
+ };
+
+ $scope.init();
+ }
+
+ return SingleStatCtrl;
+});
diff --git a/public/app/plugins/panel/singlestat/module.html b/public/app/plugins/panel/singlestat/module.html
index 5aeb468db27..748915e6329 100644
--- a/public/app/plugins/panel/singlestat/module.html
+++ b/public/app/plugins/panel/singlestat/module.html
@@ -1,4 +1,4 @@
-
+
diff --git a/public/app/plugins/panel/singlestat/module.js b/public/app/plugins/panel/singlestat/module.js
index 5c99cf7d3b1..2ed8221150a 100644
--- a/public/app/plugins/panel/singlestat/module.js
+++ b/public/app/plugins/panel/singlestat/module.js
@@ -1,253 +1,231 @@
define([
- 'angular',
- 'app/app',
+ './controller',
'lodash',
- 'app/core/utils/kbn',
- 'app/core/time_series',
- 'app/features/panel/panel_meta',
- './singleStatPanel',
+ 'jquery',
+ 'jquery.flot',
],
-function (angular, app, _, kbn, TimeSeries, PanelMeta) {
+function (SingleStatCtrl, _, $) {
'use strict';
- var module = angular.module('grafana.panels.singlestat');
- app.useModule(module);
-
- module.directive('grafanaPanelSinglestat', function() {
+ /** @ngInject */
+ function singleStatPanel($location, linkSrv, $timeout, templateSrv) {
return {
- controller: 'SingleStatCtrl',
+ controller: SingleStatCtrl,
templateUrl: 'app/plugins/panel/singlestat/module.html',
- };
- });
+ link: function(scope, elem) {
+ var data, panel, linkInfo, $panelContainer;
+ var firstRender = true;
- module.controller('SingleStatCtrl', function($scope, panelSrv, panelHelper) {
+ scope.$on('render', function() {
+ if (firstRender) {
+ var inner = elem.find('.singlestat-panel');
+ if (inner.length) {
+ elem = inner;
+ $panelContainer = elem.parents('.panel-container');
+ firstRender = false;
+ }
+ }
- $scope.panelMeta = new PanelMeta({
- panelName: 'Singlestat',
- editIcon: "fa fa-dashboard",
- fullscreen: true,
- metricsEditor: true
- });
-
- $scope.fontSizes = ['20%', '30%','50%','70%','80%','100%', '110%', '120%', '150%', '170%', '200%'];
-
- $scope.panelMeta.addEditorTab('Options', 'app/plugins/panel/singlestat/editor.html');
- $scope.panelMeta.addEditorTab('Time range', 'app/features/panel/partials/panelTime.html');
-
- // Set and populate defaults
- var _d = {
- links: [],
- datasource: null,
- maxDataPoints: 100,
- interval: null,
- targets: [{}],
- cacheTimeout: null,
- format: 'none',
- prefix: '',
- postfix: '',
- nullText: null,
- valueMaps: [
- { value: 'null', op: '=', text: 'N/A' }
- ],
- nullPointMode: 'connected',
- valueName: 'avg',
- prefixFontSize: '50%',
- valueFontSize: '80%',
- postfixFontSize: '50%',
- thresholds: '',
- colorBackground: false,
- colorValue: false,
- colors: ["rgba(245, 54, 54, 0.9)", "rgba(237, 129, 40, 0.89)", "rgba(50, 172, 45, 0.97)"],
- sparkline: {
- show: false,
- full: false,
- lineColor: 'rgb(31, 120, 193)',
- fillColor: 'rgba(31, 118, 189, 0.18)',
- }
- };
-
- _.defaults($scope.panel, _d);
- $scope.unitFormats = kbn.getUnitFormats();
-
- $scope.setUnitFormat = function(subItem) {
- $scope.panel.format = subItem.value;
- $scope.render();
- };
-
- $scope.init = function() {
- panelSrv.init($scope);
- };
-
- $scope.refreshData = function(datasource) {
- panelHelper.updateTimeRange($scope);
-
- return panelHelper.issueMetricQuery($scope, datasource)
- .then($scope.dataHandler, function(err) {
- $scope.series = [];
- $scope.render();
- throw err;
+ render();
+ scope.panelRenderingComplete();
});
- };
- $scope.loadSnapshot = function(snapshotData) {
- panelHelper.updateTimeRange($scope);
- $scope.dataHandler(snapshotData);
- };
+ function setElementHeight() {
+ try {
+ var height = scope.height || panel.height || scope.row.height;
+ if (_.isString(height)) {
+ height = parseInt(height.replace('px', ''), 10);
+ }
- $scope.dataHandler = function(results) {
- $scope.series = _.map(results.data, $scope.seriesHandler);
- $scope.render();
- };
+ height -= 5; // padding
+ height -= panel.title ? 24 : 9; // subtract panel title bar
- $scope.seriesHandler = function(seriesData) {
- var series = new TimeSeries({
- datapoints: seriesData.datapoints,
- alias: seriesData.target,
- });
+ elem.css('height', height + 'px');
- series.flotpairs = series.getFlotPairs($scope.panel.nullPointMode);
-
- return series;
- };
-
- $scope.setColoring = function(options) {
- if (options.background) {
- $scope.panel.colorValue = false;
- $scope.panel.colors = ['rgba(71, 212, 59, 0.4)', 'rgba(245, 150, 40, 0.73)', 'rgba(225, 40, 40, 0.59)'];
- }
- else {
- $scope.panel.colorBackground = false;
- $scope.panel.colors = ['rgba(50, 172, 45, 0.97)', 'rgba(237, 129, 40, 0.89)', 'rgba(245, 54, 54, 0.9)'];
- }
- $scope.render();
- };
-
- $scope.invertColorOrder = function() {
- var tmp = $scope.panel.colors[0];
- $scope.panel.colors[0] = $scope.panel.colors[2];
- $scope.panel.colors[2] = tmp;
- $scope.render();
- };
-
- $scope.getDecimalsForValue = function(value) {
- if (_.isNumber($scope.panel.decimals)) {
- return { decimals: $scope.panel.decimals, scaledDecimals: null };
- }
-
- var delta = value / 2;
- var dec = -Math.floor(Math.log(delta) / Math.LN10);
-
- var magn = Math.pow(10, -dec),
- norm = delta / magn, // norm is between 1.0 and 10.0
- size;
-
- if (norm < 1.5) {
- size = 1;
- } else if (norm < 3) {
- size = 2;
- // special case for 2.5, requires an extra decimal
- if (norm > 2.25) {
- size = 2.5;
- ++dec;
+ return true;
+ } catch(e) { // IE throws errors sometimes
+ return false;
+ }
}
- } else if (norm < 7.5) {
- size = 5;
- } else {
- size = 10;
- }
- size *= magn;
+ function applyColoringThresholds(value, valueString) {
+ if (!panel.colorValue) {
+ return valueString;
+ }
- // reduce starting decimals if not needed
- if (Math.floor(value) === value) { dec = 0; }
+ var color = getColorForValue(value);
+ if (color) {
+ return '
'+ valueString + '';
+ }
- var result = {};
- result.decimals = Math.max(0, dec);
- result.scaledDecimals = result.decimals - Math.floor(Math.log(size) / Math.LN10) + 2;
-
- return result;
- };
-
- $scope.render = function() {
- var data = {};
-
- $scope.setValues(data);
-
- data.thresholds = $scope.panel.thresholds.split(',').map(function(strVale) {
- return Number(strVale.trim());
- });
-
- data.colorMap = $scope.panel.colors;
-
- $scope.data = data;
- $scope.$broadcast('render');
- };
-
- $scope.setValues = function(data) {
- data.flotpairs = [];
-
- if($scope.series.length > 1) {
- $scope.inspector.error = new Error();
- $scope.inspector.error.message = 'Multiple Series Error';
- $scope.inspector.error.data = 'Metric query returns ' + $scope.series.length +
- ' series. Single Stat Panel expects a single series.\n\nResponse:\n'+JSON.stringify($scope.series);
- throw $scope.inspector.error;
- }
-
- if ($scope.series && $scope.series.length > 0) {
- var lastPoint = _.last($scope.series[0].datapoints);
- var lastValue = _.isArray(lastPoint) ? lastPoint[0] : null;
-
- if (_.isString(lastValue)) {
- data.value = 0;
- data.valueFormated = lastValue;
- data.valueRounded = 0;
- } else {
- data.value = $scope.series[0].stats[$scope.panel.valueName];
- data.flotpairs = $scope.series[0].flotpairs;
-
- var decimalInfo = $scope.getDecimalsForValue(data.value);
- var formatFunc = kbn.valueFormats[$scope.panel.format];
- data.valueFormated = formatFunc(data.value, decimalInfo.decimals, decimalInfo.scaledDecimals);
- data.valueRounded = kbn.roundValue(data.value, decimalInfo.decimals);
+ return valueString;
}
- }
- // check value to text mappings
- for(var i = 0; i < $scope.panel.valueMaps.length; i++) {
- var map = $scope.panel.valueMaps[i];
- // special null case
- if (map.value === 'null') {
- if (data.value === null || data.value === void 0) {
- data.valueFormated = map.text;
+ function getColorForValue(value) {
+ for (var i = data.thresholds.length - 1; i >= 0 ; i--) {
+ if (value >= data.thresholds[i]) {
+ return data.colorMap[i];
+ }
+ }
+ return null;
+ }
+
+ function getSpan(className, fontSize, value) {
+ value = templateSrv.replace(value);
+ return '
' +
+ value + '';
+ }
+
+ function getBigValueHtml() {
+ var body = '
';
+
+ if (panel.prefix) { body += getSpan('singlestat-panel-prefix', panel.prefixFontSize, scope.panel.prefix); }
+
+ var value = applyColoringThresholds(data.valueRounded, data.valueFormated);
+ body += getSpan('singlestat-panel-value', panel.valueFontSize, value);
+
+ if (panel.postfix) { body += getSpan('singlestat-panel-postfix', panel.postfixFontSize, panel.postfix); }
+
+ body += '
';
+
+ return body;
+ }
+
+ function addSparkline() {
+ var panel = scope.panel;
+ var width = elem.width() + 20;
+ var height = elem.height() || 100;
+
+ var plotCanvas = $('
');
+ var plotCss = {};
+ plotCss.position = 'absolute';
+
+ if (panel.sparkline.full) {
+ plotCss.bottom = '5px';
+ plotCss.left = '-5px';
+ plotCss.width = (width - 10) + 'px';
+ var dynamicHeightMargin = height <= 100 ? 5 : (Math.round((height/100)) * 15) + 5;
+ plotCss.height = (height - dynamicHeightMargin) + 'px';
+ }
+ else {
+ plotCss.bottom = "0px";
+ plotCss.left = "-5px";
+ plotCss.width = (width - 10) + 'px';
+ plotCss.height = Math.floor(height * 0.25) + "px";
+ }
+
+ plotCanvas.css(plotCss);
+
+ var options = {
+ legend: { show: false },
+ series: {
+ lines: {
+ show: true,
+ fill: 1,
+ lineWidth: 1,
+ fillColor: panel.sparkline.fillColor,
+ },
+ },
+ yaxes: { show: false },
+ xaxis: {
+ show: false,
+ mode: "time",
+ min: scope.range.from.valueOf(),
+ max: scope.range.to.valueOf(),
+ },
+ grid: { hoverable: false, show: false },
+ };
+
+ elem.append(plotCanvas);
+
+ var plotSeries = {
+ data: data.flotpairs,
+ color: panel.sparkline.lineColor
+ };
+
+ $.plot(plotCanvas, [plotSeries], options);
+ }
+
+ function render() {
+ if (!scope.data) { return; }
+
+ data = scope.data;
+ panel = scope.panel;
+
+ setElementHeight();
+
+ var body = getBigValueHtml();
+
+ if (panel.colorBackground && !isNaN(data.valueRounded)) {
+ var color = getColorForValue(data.valueRounded);
+ if (color) {
+ $panelContainer.css('background-color', color);
+ if (scope.fullscreen) {
+ elem.css('background-color', color);
+ } else {
+ elem.css('background-color', '');
+ }
+ }
+ } else {
+ $panelContainer.css('background-color', '');
+ elem.css('background-color', '');
+ }
+
+ elem.html(body);
+
+ if (panel.sparkline.show) {
+ addSparkline();
+ }
+
+ elem.toggleClass('pointer', panel.links.length > 0);
+
+ if (panel.links.length > 0) {
+ linkInfo = linkSrv.getPanelLinkAnchorInfo(panel.links[0], scope.panel.scopedVars);
+ } else {
+ linkInfo = null;
+ }
+ }
+
+ // drilldown link tooltip
+ var drilldownTooltip = $('
hello
"');
+
+ elem.mouseleave(function() {
+ if (panel.links.length === 0) { return;}
+ drilldownTooltip.detach();
+ });
+
+ elem.click(function() {
+ if (!linkInfo) { return; }
+
+ if (linkInfo.target === '_blank') {
+ var redirectWindow = window.open(linkInfo.href, '_blank');
+ redirectWindow.location;
return;
}
- continue;
- }
- // value/number to text mapping
- var value = parseFloat(map.value);
- if (value === data.value) {
- data.valueFormated = map.text;
- return;
- }
- }
+ if (linkInfo.href.indexOf('http') === 0) {
+ window.location.href = linkInfo.href;
+ } else {
+ $timeout(function() {
+ $location.url(linkInfo.href);
+ });
+ }
- if (data.value === null || data.value === void 0) {
- data.valueFormated = "no value";
+ drilldownTooltip.detach();
+ });
+
+ elem.mousemove(function(e) {
+ if (!linkInfo) { return;}
+
+ drilldownTooltip.text('click to go to: ' + linkInfo.title);
+
+ drilldownTooltip.place_tt(e.pageX+20, e.pageY-15);
+ });
}
};
+ }
- $scope.removeValueMap = function(map) {
- var index = _.indexOf($scope.panel.valueMaps, map);
- $scope.panel.valueMaps.splice(index, 1);
- $scope.render();
- };
-
- $scope.addValueMap = function() {
- $scope.panel.valueMaps.push({value: '', op: '=', text: '' });
- };
-
- $scope.init();
- });
+ return {
+ panel: singleStatPanel
+ };
});
diff --git a/public/app/plugins/panel/table/controller.ts b/public/app/plugins/panel/table/controller.ts
index 64e5123b0f6..f05a36c4cdf 100644
--- a/public/app/plugins/panel/table/controller.ts
+++ b/public/app/plugins/panel/table/controller.ts
@@ -20,7 +20,7 @@ export class TablePanelCtrl {
metricsEditor: true,
});
- $scope.panelMeta.addEditorTab('Options', 'app/plugins/panels/table/options.html');
+ $scope.panelMeta.addEditorTab('Options', 'app/plugins/panel/table/options.html');
$scope.panelMeta.addEditorTab('Time range', 'app/features/panel/partials/panelTime.html');
var panelDefaults = {
diff --git a/public/app/plugins/panel/table/editor.ts b/public/app/plugins/panel/table/editor.ts
index d16805ecb07..42536642d4a 100644
--- a/public/app/plugins/panel/table/editor.ts
+++ b/public/app/plugins/panel/table/editor.ts
@@ -118,7 +118,7 @@ export function tablePanelEditor($q, uiSegmentSrv) {
return {
restrict: 'E',
scope: true,
- templateUrl: 'app/plugins/panels/table/editor.html',
+ templateUrl: 'app/plugins/panel/table/editor.html',
controller: TablePanelEditorCtrl,
};
}
diff --git a/public/app/plugins/panel/table/module.ts b/public/app/plugins/panel/table/module.ts
index 4344eb41229..834bea42ba5 100644
--- a/public/app/plugins/panel/table/module.ts
+++ b/public/app/plugins/panel/table/module.ts
@@ -10,7 +10,9 @@ import {TablePanelCtrl} from './controller';
import {TableRenderer} from './renderer';
import {tablePanelEditor} from './editor';
-export function tablePanel() {
+angular.module('grafana.directives').directive('grafanaPanelTableEditor', tablePanelEditor);
+
+function tablePanel() {
'use strict';
return {
restrict: 'E',
@@ -102,5 +104,4 @@ export function tablePanel() {
};
}
-angular.module('grafana.directives').directive('grafanaPanelTable', tablePanel);
-angular.module('grafana.directives').directive('grafanaPanelTableEditor', tablePanelEditor);
+export {tablePanel as panel};
diff --git a/public/app/plugins/panel/table/renderer.ts b/public/app/plugins/panel/table/renderer.ts
index 9223d35dc5d..be73af06e64 100644
--- a/public/app/plugins/panel/table/renderer.ts
+++ b/public/app/plugins/panel/table/renderer.ts
@@ -96,13 +96,12 @@ export class TableRenderer {
}
renderCell(columnIndex, value, addWidthHack = false) {
- var value = this.formatColumnValue(columnIndex, value);
+ value = this.formatColumnValue(columnIndex, value);
var style = '';
if (this.colorState.cell) {
style = ' style="background-color:' + this.colorState.cell + ';color: white"';
this.colorState.cell = null;
- }
- else if (this.colorState.value) {
+ } else if (this.colorState.value) {
style = ' style="color:' + this.colorState.value + '"';
this.colorState.value = null;
}
diff --git a/public/app/plugins/panel/table/transformers.ts b/public/app/plugins/panel/table/transformers.ts
index 493fd354ba6..b1cc644790e 100644
--- a/public/app/plugins/panel/table/transformers.ts
+++ b/public/app/plugins/panel/table/transformers.ts
@@ -52,8 +52,7 @@ transformers['timeseries_to_columns'] = {
if (!points[timeKey]) {
points[timeKey] = {time: dp[1]};
points[timeKey][i] = dp[0];
- }
- else {
+ } else {
points[timeKey][i] = dp[0];
}
}
diff --git a/public/app/plugins/panel/text/module.js b/public/app/plugins/panel/text/module.js
index d3add3a15b8..e940f3b7d21 100644
--- a/public/app/plugins/panel/text/module.js
+++ b/public/app/plugins/panel/text/module.js
@@ -10,17 +10,7 @@ function (angular, app, _, require, PanelMeta) {
var converter;
- var module = angular.module('grafana.panels.text', []);
- app.useModule(module);
-
- module.directive('grafanaPanelText', function() {
- return {
- controller: 'TextPanelCtrl',
- templateUrl: 'app/plugins/panel/text/module.html',
- };
- });
-
- module.controller('TextPanelCtrl', function($scope, templateSrv, $sce, panelSrv) {
+ function TextPanelCtrl($scope, templateSrv, $sce, panelSrv) {
$scope.panelMeta = new PanelMeta({
panelName: 'Text',
@@ -107,5 +97,16 @@ function (angular, app, _, require, PanelMeta) {
};
$scope.init();
- });
+ }
+
+ function textPanel() {
+ return {
+ controller: TextPanelCtrl,
+ templateUrl: 'app/plugins/panel/text/module.html',
+ };
+ }
+
+ return {
+ panel: textPanel,
+ };
});
diff --git a/public/app/plugins/plugin_api.md b/public/app/plugins/plugin_api.md
index 138dab09931..707838ba8fd 100644
--- a/public/app/plugins/plugin_api.md
+++ b/public/app/plugins/plugin_api.md
@@ -1,8 +1,52 @@
# Plugin API
-## Changelog
+### 3.0 changes to plugin api changes
-2.5.1
+There has been big changes to both data source and plugin schema (plugin.json) and how
+you write the plugin main module.
+
+#### Datasource plugin
+
+Now data source plugins AMD/SystemJS module should return:
+
+```javascript
+return {
+ Datasource: ElasticDatasource,
+ configView: editView.default,
+ annotationsQueryEditor: annotationsQueryEditor,
+ metricsQueryEditor: metricsQueryEditor,
+ metricsQueryOptions: metricsQueryOptions,
+};
+```
+
+Where ElasticDatasource is a constructor function to a javascript. The constructor
+function can take angular services and `instanceSettings` as parameters.
+
+Example:
+
+```javascript
+function ElasticDatasource(instanceSettings, templateSrv) {
+ this.instanceSettings = this.instanceSettings;
+ ///...
+};
+```
+
+A datasource module can optionally return a configView directive function, metricsQueryEditor directive function, etc.
+
+Example:
+
+```javascript
+function metricsQueryEditor() {
+ return {controller: 'ElasticQueryCtrl', templateUrl: 'app/plugins/datasource/elasticsearch/partials/query.editor.html'};
+}
+```
+
+#### Panel plugin
+
+The panel plugin AMD/SystemJS module should return an object with a property named `panel`. This needs to be
+a directive function.
+
+### 2.5.1 changes
datasource annotationQuery changed. now single options parameter with:
- range
- rangeRaw
diff --git a/public/test/specs/graph-ctrl-specs.js b/public/test/specs/graph-ctrl-specs.js
deleted file mode 100644
index 607c13cf528..00000000000
--- a/public/test/specs/graph-ctrl-specs.js
+++ /dev/null
@@ -1,51 +0,0 @@
-define([
- './helpers',
- 'app/features/panel/panel_srv',
- 'app/features/panel/panel_helper',
- 'app/plugins/panel/graph/module'
-], function(helpers) {
- 'use strict';
-
- describe('GraphCtrl', function() {
- var ctx = new helpers.ControllerTestContext();
-
- beforeEach(module('grafana.services'));
- beforeEach(module('grafana.panels.graph'));
-
- beforeEach(ctx.providePhase());
- beforeEach(ctx.createControllerPhase('GraphCtrl'));
-
- describe('get_data with 2 series', function() {
- beforeEach(function() {
- ctx.annotationsSrv.getAnnotations = sinon.stub().returns(ctx.$q.when([]));
- ctx.datasource.query = sinon.stub().returns(ctx.$q.when({
- data: [
- { target: 'test.cpu1', datapoints: [[1, 10]]},
- { target: 'test.cpu2', datapoints: [[1, 10]]}
- ]
- }));
- ctx.scope.render = sinon.spy();
- ctx.scope.refreshData(ctx.datasource);
- ctx.scope.$digest();
- });
-
- it('should send time series to render', function() {
- var data = ctx.scope.render.getCall(0).args[0];
- expect(data.length).to.be(2);
- });
-
- describe('get_data failure following success', function() {
- beforeEach(function() {
- ctx.datasource.query = sinon.stub().returns(ctx.$q.reject('Datasource Error'));
- ctx.scope.refreshData(ctx.datasource);
- ctx.scope.$digest();
- });
-
- });
-
- });
-
- });
-
-});
-
diff --git a/public/test/specs/graph-specs.js b/public/test/specs/graph-specs.js
deleted file mode 100644
index db3a4acf61f..00000000000
--- a/public/test/specs/graph-specs.js
+++ /dev/null
@@ -1,231 +0,0 @@
-define([
- './helpers',
- 'angular',
- 'jquery',
- 'app/core/time_series',
- 'app/plugins/panel/graph/graph'
-], function(helpers, angular, $, TimeSeries) {
- 'use strict';
-
- describe('grafanaGraph', function() {
-
- beforeEach(module('grafana.directives'));
-
- function graphScenario(desc, func) {
- describe(desc, function() {
- var ctx = {};
-
- ctx.setup = function (setupFunc) {
-
- beforeEach(module(function($provide) {
- $provide.value("timeSrv", new helpers.TimeSrvStub());
- }));
-
- beforeEach(inject(function($rootScope, $compile) {
- var scope = $rootScope.$new();
- var element = angular.element("
");
-
- scope.height = '200px';
- scope.panel = {
- legend: {},
- grid: { },
- y_formats: [],
- seriesOverrides: [],
- tooltip: {
- shared: true
- }
- };
-
- scope.panelRenderingComplete = sinon.spy();
- scope.appEvent = sinon.spy();
- scope.onAppEvent = sinon.spy();
- scope.hiddenSeries = {};
- scope.dashboard = { timezone: 'browser' };
- scope.range = {
- from: new Date('2014-08-09 10:00:00'),
- to: new Date('2014-09-09 13:00:00')
- };
- ctx.data = [];
- ctx.data.push(new TimeSeries({
- datapoints: [[1,1],[2,2]],
- alias: 'series1'
- }));
- ctx.data.push(new TimeSeries({
- datapoints: [[1,1],[2,2]],
- alias: 'series2'
- }));
-
- setupFunc(scope, ctx.data);
-
- $compile(element)(scope);
- scope.$digest();
- $.plot = ctx.plotSpy = sinon.spy();
-
- scope.$emit('render', ctx.data);
- ctx.plotData = ctx.plotSpy.getCall(0).args[1];
- ctx.plotOptions = ctx.plotSpy.getCall(0).args[2];
- }));
- };
-
- func(ctx);
- });
- }
-
- graphScenario('simple lines options', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.lines = true;
- scope.panel.fill = 5;
- scope.panel.linewidth = 3;
- scope.panel.steppedLine = true;
- });
-
- it('should configure plot with correct options', function() {
- expect(ctx.plotOptions.series.lines.show).to.be(true);
- expect(ctx.plotOptions.series.lines.fill).to.be(0.5);
- expect(ctx.plotOptions.series.lines.lineWidth).to.be(3);
- expect(ctx.plotOptions.series.lines.steps).to.be(true);
- });
- });
-
- graphScenario('grid thresholds 100, 200', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.grid = {
- threshold1: 100,
- threshold1Color: "#111",
- threshold2: 200,
- threshold2Color: "#222",
- };
- });
-
- it('should add grid markings', function() {
- var markings = ctx.plotOptions.grid.markings;
- expect(markings[0].yaxis.from).to.be(100);
- expect(markings[0].yaxis.to).to.be(200);
- expect(markings[0].color).to.be('#111');
- expect(markings[1].yaxis.from).to.be(200);
- expect(markings[1].yaxis.to).to.be(Infinity);
- });
- });
-
- graphScenario('inverted grid thresholds 200, 100', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.grid = {
- threshold1: 200,
- threshold1Color: "#111",
- threshold2: 100,
- threshold2Color: "#222",
- };
- });
-
- it('should add grid markings', function() {
- var markings = ctx.plotOptions.grid.markings;
- expect(markings[0].yaxis.from).to.be(200);
- expect(markings[0].yaxis.to).to.be(100);
- expect(markings[0].color).to.be('#111');
- expect(markings[1].yaxis.from).to.be(100);
- expect(markings[1].yaxis.to).to.be(-Infinity);
- });
- });
-
- graphScenario('grid thresholds from zero', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.grid = {
- threshold1: 0,
- threshold1Color: "#111",
- };
- });
-
- it('should add grid markings', function() {
- var markings = ctx.plotOptions.grid.markings;
- expect(markings[0].yaxis.from).to.be(0);
- });
- });
-
- graphScenario('when logBase is log 10', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.grid = {
- leftMax: null,
- rightMax: null,
- leftMin: null,
- rightMin: null,
- leftLogBase: 10,
- };
- });
-
- it('should apply axis transform and ticks', function() {
- var axis = ctx.plotOptions.yaxes[0];
- expect(axis.transform(100)).to.be(Math.log(100+0.1));
- expect(axis.ticks[0]).to.be(0);
- expect(axis.ticks[1]).to.be(1);
- });
- });
-
- graphScenario('should use timeStep for barWidth', function(ctx) {
- ctx.setup(function(scope, data) {
- scope.panel.bars = true;
- data[0] = new TimeSeries({
- datapoints: [[1,10],[2,20]],
- alias: 'series1',
- });
- });
-
- it('should set barWidth', function() {
- expect(ctx.plotOptions.series.bars.barWidth).to.be(10/1.5);
- });
- });
-
- graphScenario('series option overrides, fill & points', function(ctx) {
- ctx.setup(function(scope, data) {
- scope.panel.lines = true;
- scope.panel.fill = 5;
- scope.panel.seriesOverrides = [
- { alias: 'test', fill: 0, points: true }
- ];
-
- data[1].alias = 'test';
- });
-
- it('should match second series and fill zero, and enable points', function() {
- expect(ctx.plotOptions.series.lines.fill).to.be(0.5);
- expect(ctx.plotData[1].lines.fill).to.be(0.001);
- expect(ctx.plotData[1].points.show).to.be(true);
- });
- });
-
- graphScenario('should order series order according to zindex', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.seriesOverrides = [{ alias: 'series1', zindex: 2 }];
- });
-
- it('should move zindex 2 last', function() {
- expect(ctx.plotData[0].alias).to.be('series2');
- expect(ctx.plotData[1].alias).to.be('series1');
- });
- });
-
- graphScenario('when series is hidden', function(ctx) {
- ctx.setup(function(scope) {
- scope.hiddenSeries = {'series2': true};
- });
-
- it('should remove datapoints and disable stack', function() {
- expect(ctx.plotData[0].alias).to.be('series1');
- expect(ctx.plotData[1].data.length).to.be(0);
- expect(ctx.plotData[1].stack).to.be(false);
- });
- });
-
- graphScenario('when stack and percent', function(ctx) {
- ctx.setup(function(scope) {
- scope.panel.percentage = true;
- scope.panel.stack = true;
- });
-
- it('should show percentage', function() {
- var axis = ctx.plotOptions.yaxes[0];
- expect(axis.tickFormatter(100, axis)).to.be("100%");
- });
- });
- });
-});
-
diff --git a/public/test/specs/graph-tooltip-specs.js b/public/test/specs/graph-tooltip-specs.js
deleted file mode 100644
index de39d855a70..00000000000
--- a/public/test/specs/graph-tooltip-specs.js
+++ /dev/null
@@ -1,171 +0,0 @@
-define([
- 'jquery',
- 'app/plugins/panel/graph/graph.tooltip'
-], function($, GraphTooltip) {
- 'use strict';
-
- var scope = {
- appEvent: sinon.spy(),
- onAppEvent: sinon.spy(),
- };
-
- var elem = $('
');
- var dashboard = { };
-
- function describeSharedTooltip(desc, fn) {
- var ctx = {};
- ctx.scope = scope;
- ctx.scope.panel = {
- tooltip: {
- shared: true
- },
- legend: { },
- stack: false
- };
-
- ctx.setup = function(setupFn) {
- ctx.setupFn = setupFn;
- };
-
- describe(desc, function() {
- beforeEach(function() {
- ctx.setupFn();
- var tooltip = new GraphTooltip(elem, dashboard, scope);
- ctx.results = tooltip.getMultiSeriesPlotHoverInfo(ctx.data, ctx.pos);
- });
-
- fn(ctx);
- });
- }
-
- describeSharedTooltip("steppedLine false, stack false", function(ctx) {
- ctx.setup(function() {
- ctx.data = [
- { data: [[10, 15], [12, 20]], lines: {} },
- { data: [[10, 2], [12, 3]], lines: {} }
- ];
- ctx.pos = { x: 11 };
- });
-
- it('should return 2 series', function() {
- expect(ctx.results.length).to.be(2);
- });
- it('should add time to results array', function() {
- expect(ctx.results.time).to.be(10);
- });
- it('should set value and hoverIndex', function() {
- expect(ctx.results[0].value).to.be(15);
- expect(ctx.results[1].value).to.be(2);
- expect(ctx.results[0].hoverIndex).to.be(0);
- });
- });
-
- describeSharedTooltip("one series is hidden", function(ctx) {
- ctx.setup(function() {
- ctx.data = [
- { data: [[10, 15], [12, 20]], },
- { data: [] }
- ];
- ctx.pos = { x: 11 };
- });
- });
-
- describeSharedTooltip("steppedLine false, stack true, individual false", function(ctx) {
- ctx.setup(function() {
- ctx.data = [
- {
- data: [[10, 15], [12, 20]],
- lines: {},
- datapoints: {
- pointsize: 2,
- points: [[10,15], [12,20]],
- },
- stack: true,
- },
- {
- data: [[10, 2], [12, 3]],
- lines: {},
- datapoints: {
- pointsize: 2,
- points: [[10, 2], [12, 3]],
- },
- stack: true
- }
- ];
- ctx.scope.panel.stack = true;
- ctx.pos = { x: 11 };
- });
-
- it('should show stacked value', function() {
- expect(ctx.results[1].value).to.be(17);
- });
- });
-
- describeSharedTooltip("steppedLine false, stack true, individual false, series stack false", function(ctx) {
- ctx.setup(function() {
- ctx.data = [
- {
- data: [[10, 15], [12, 20]],
- lines: {},
- datapoints: {
- pointsize: 2,
- points: [[10, 15], [12, 20]],
- },
- stack: true
- },
- {
- data: [[10, 2], [12, 3]],
- lines: {},
- datapoints: {
- pointsize: 2,
- points: [[10, 2], [12, 3]],
- },
- stack: false
- }
- ];
- ctx.scope.panel.stack = true;
- ctx.pos = { x: 11 };
- });
-
- it('should not show stacked value', function() {
- expect(ctx.results[1].value).to.be(2);
- });
-
- });
-
- describeSharedTooltip("steppedLine false, stack true, individual true", function(ctx) {
- ctx.setup(function() {
- ctx.data = [
- {
- data: [[10, 15], [12, 20]],
- lines: {},
- datapoints: {
- pointsize: 2,
- points: [[10, 15], [12, 20]],
- },
- stack: true
- },
- {
- data: [[10, 2], [12, 3]],
- lines: {},
- datapoints: {
- pointsize: 2,
- points: [[10, 2], [12, 3]],
- },
- stack: false
- }
- ];
- ctx.scope.panel.stack = true;
- ctx.scope.panel.tooltip.value_type = 'individual';
- ctx.pos = { x: 11 };
- });
-
- it('should not show stacked value', function() {
- expect(ctx.results[1].value).to.be(2);
- });
-
- });
-
-});
-
-
diff --git a/public/test/specs/helpers.d.ts b/public/test/specs/helpers.d.ts
index 2447bc7868d..4b64bd79031 100644
--- a/public/test/specs/helpers.d.ts
+++ b/public/test/specs/helpers.d.ts
@@ -1,6 +1,4 @@
-declare module "test/specs/helpers" {
- let helpers: any;
- export default helpers;
-}
+declare let helpers: any;
+export default helpers;
diff --git a/public/test/specs/singlestat-specs.js b/public/test/specs/singlestat-specs.js
index 733f7f37e98..60953345f2d 100644
--- a/public/test/specs/singlestat-specs.js
+++ b/public/test/specs/singlestat-specs.js
@@ -1,11 +1,14 @@
define([
+ 'angular',
'./helpers',
+ 'app/plugins/panel/singlestat/controller',
'app/features/panel/panel_srv',
'app/features/panel/panel_helper',
- 'app/plugins/panel/singlestat/module'
-], function(helpers) {
+], function(angular, helpers, SingleStatCtrl) {
'use strict';
+ angular.module('grafana.controllers').controller('SingleStatCtrl', SingleStatCtrl);
+
describe('SingleStatCtrl', function() {
var ctx = new helpers.ControllerTestContext();
@@ -16,7 +19,7 @@ define([
ctx.setup = function (setupFunc) {
beforeEach(module('grafana.services'));
- beforeEach(module('grafana.panels.singlestat'));
+ beforeEach(module('grafana.controllers'));
beforeEach(ctx.providePhase());
beforeEach(ctx.createControllerPhase('SingleStatCtrl'));
@@ -24,7 +27,7 @@ define([
beforeEach(function() {
setupFunc();
ctx.datasource.query = sinon.stub().returns(ctx.$q.when({
- data: [ { target: 'test.cpu1', datapoints: ctx.datapoints } ]
+ data: [{target: 'test.cpu1', datapoints: ctx.datapoints}]
}));
ctx.scope.refreshData(ctx.datasource);
diff --git a/tasks/options/tslint.js b/tasks/options/tslint.js
index 0b76e623e95..c9658b32f8f 100644
--- a/tasks/options/tslint.js
+++ b/tasks/options/tslint.js
@@ -6,18 +6,19 @@ module.exports = function(config) {
}
},
options: {
- configuration: {
- rules: {
- curly: true,
- align: [true, "parameters", "statements"],
- indent: [true, "spaces"],
- "class-name": true,
- "interface-name": true,
- "semicolon": true,
- "use-strict": [false, "check-module", "check-function"],
- "whitespace": [true, "check-branch", "check-decl", "check-type"],
- }
- }
+ configuration: 'tslint.json'
+ // {
+ // rules: {
+ // curly: true,
+ // align: [true, "parameters", "statements"],
+ // indent: [true, "spaces"],
+ // "class-name": true,
+ // "interface-name": true,
+ // "semicolon": true,
+ // "use-strict": [false, "check-module", "check-function"],
+ // "whitespace": [true, "check-branch", "check-decl", "check-type"],
+ // }
+ // }
}
};
};
diff --git a/tasks/options/watch.js b/tasks/options/watch.js
index 515877b102e..187b07696c7 100644
--- a/tasks/options/watch.js
+++ b/tasks/options/watch.js
@@ -27,15 +27,17 @@ module.exports = function(config, grunt) {
}
if (/(\.ts)$/.test(filepath)) {
+ newPath = filepath.replace(/^public/, 'public_gen');
+ grunt.log.writeln('Copying to ' + newPath);
+ grunt.file.copy(filepath, newPath);
+
+ // copy ts file also used by source maps
//changes changed file source to that of the changed file
var option = 'typescript.build.src';
var result = filepath;
grunt.config(option, result);
grunt.task.run('typescript:build');
grunt.task.run('tslint');
- // copy ts file also used by source maps
- newPath = filepath.replace(/^public/, 'public_gen');
- grunt.file.copy(filepath, newPath);
}
});
diff --git a/tslint.json b/tslint.json
new file mode 100644
index 00000000000..a6d1cf26d22
--- /dev/null
+++ b/tslint.json
@@ -0,0 +1,62 @@
+{
+ "rules": {
+ "class-name": true,
+ "comment-format": [true, "check-space"],
+ "curly": true,
+ "eofline": true,
+ "forin": false,
+ "indent": [true, "spaces"],
+ "label-position": true,
+ "label-undefined": true,
+ "max-line-length": [true, 140],
+ "member-access": false,
+ "no-arg": true,
+ "no-bitwise": true,
+ "no-console": [true,
+ "debug",
+ "info",
+ "time",
+ "timeEnd",
+ "trace"
+ ],
+ "no-construct": true,
+ "no-debugger": true,
+ "no-duplicate-key": true,
+ "no-duplicate-variable": true,
+ "no-empty": true,
+ "no-eval": true,
+ "no-inferrable-types": true,
+ "no-shadowed-variable": false,
+ "no-string-literal": false,
+ "no-switch-case-fall-through": true,
+ "no-trailing-comma": true,
+ "no-trailing-whitespace": true,
+ "no-unused-expression": false,
+ "no-unused-variable": false,
+ "no-unreachable": true,
+ "no-use-before-declare": true,
+ "no-var-keyword": false,
+ "object-literal-sort-keys": false,
+ "one-line": [true,
+ "check-open-brace",
+ "check-catch",
+ "check-else"
+ ],
+ "radix": false,
+ "semicolon": true,
+ "triple-equals": [true, "allow-null-check"],
+ "typedef-whitespace": [true, {
+ "call-signature": "nospace",
+ "index-signature": "nospace",
+ "parameter": "nospace",
+ "property-declaration": "nospace",
+ "variable-declaration": "nospace"
+ }],
+ "variable-name": [true, "ban-keywords"],
+ "whitespace": [true,
+ "check-branch",
+ "check-decl",
+ "check-type"
+ ]
+ }
+}