From 55189200a45b707f380398f9bf49872a19a92f1b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 20 Mar 2016 16:18:31 +0100 Subject: [PATCH 01/98] ux(): updated query editor test --- .../app/core/directives/dropdown_typeahead.js | 4 +- public/app/core/directives/metric_segment.js | 4 +- .../panel/partials/query_editor_row.html | 41 ++++++++- public/app/partials/metrics.html | 2 +- .../influxdb/partials/query.editor.html | 85 +++++++++++-------- public/sass/components/_gf-form.scss | 11 ++- public/sass/components/_query_editor.scss | 8 +- 7 files changed, 107 insertions(+), 48 deletions(-) diff --git a/public/app/core/directives/dropdown_typeahead.js b/public/app/core/directives/dropdown_typeahead.js index ae825c31fca..3401ca4c38e 100644 --- a/public/app/core/directives/dropdown_typeahead.js +++ b/public/app/core/directives/dropdown_typeahead.js @@ -9,10 +9,10 @@ function (_, $, coreModule) { coreModule.default.directive('dropdownTypeahead', function($compile) { var inputTemplate = ''; - var buttonTemplate = ''; diff --git a/public/app/core/directives/metric_segment.js b/public/app/core/directives/metric_segment.js index 56dc1fd935a..7680f6049e0 100644 --- a/public/app/core/directives/metric_segment.js +++ b/public/app/core/directives/metric_segment.js @@ -8,10 +8,10 @@ function (_, $, coreModule) { coreModule.default.directive('metricSegment', function($compile, $sce) { var inputTemplate = ''; - var buttonTemplate = ''; return { diff --git a/public/app/features/panel/partials/query_editor_row.html b/public/app/features/panel/partials/query_editor_row.html index 81f7e4f6c98..7fa5bbd113e 100644 --- a/public/app/features/panel/partials/query_editor_row.html +++ b/public/app/features/panel/partials/query_editor_row.html @@ -1,4 +1,43 @@ -
+
+
+ + +
+
+
+ +
+ + +
+
+ +
-

Pro tip: To update all plugins at once, type grafana-cli plugins update-all on the command line.

+

Pro tip: To update all plugins at once, type grafana-cli plugins update-all on the command line. From 0f1606691539cbac4b27cdb89bfe3ad826199878 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Fri, 15 Apr 2016 18:32:03 -0400 Subject: [PATCH 09/98] fix(): zoom out tooltip fix, fixes #4729 --- public/app/features/dashboard/timepicker/timepicker.html | 2 +- public/app/features/dashboard/timepicker/timepicker.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/public/app/features/dashboard/timepicker/timepicker.html b/public/app/features/dashboard/timepicker/timepicker.html index a1b4321cc80..12570b3f2b0 100644 --- a/public/app/features/dashboard/timepicker/timepicker.html +++ b/public/app/features/dashboard/timepicker/timepicker.html @@ -3,7 +3,7 @@

  • -
  • +
  • Zoom Out
  • diff --git a/public/app/features/dashboard/timepicker/timepicker.ts b/public/app/features/dashboard/timepicker/timepicker.ts index fbdff8e116a..b22ec162dd6 100644 --- a/public/app/features/dashboard/timepicker/timepicker.ts +++ b/public/app/features/dashboard/timepicker/timepicker.ts @@ -92,7 +92,7 @@ export class TimePickerCtrl { move(direction) { var range = this.timeSrv.timeRange(); - var timespan = (range.to.valueOf() - range.from.valueOf()); + var timespan = (range.to.valueOf() - range.from.valueOf()) / 2; var to, from; if (direction === -1) { to = range.to.valueOf() - timespan; From 4f2628c22150c7ef73e7585aaf6f39c3d49ab155 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Fri, 15 Apr 2016 18:50:48 -0400 Subject: [PATCH 10/98] fix(): fixed issue with templating preview, fixes #4714 --- public/app/features/templating/partials/editor.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/public/app/features/templating/partials/editor.html b/public/app/features/templating/partials/editor.html index d8c74d1eea9..c7dfe61f2b4 100644 --- a/public/app/features/templating/partials/editor.html +++ b/public/app/features/templating/partials/editor.html @@ -217,10 +217,10 @@
    Preview of values (shows max 20)
    -
    - - {{option.text}} - +
    +
    + {{option.text}} +
    From e307ada3744beddfac253f163110bb6a4c71db9b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Fri, 15 Apr 2016 19:56:39 -0400 Subject: [PATCH 11/98] ux(): tooltip improvement --- .../app/core/components/dashboard_selector.ts | 3 + public/app/core/components/info_popover.ts | 23 +++++--- public/app/core/components/switch.ts | 23 ++------ .../features/dashboard/partials/settings.html | 11 ++-- public/app/features/org/prefs_control.ts | 7 +-- .../features/plugins/partials/ds_edit.html | 12 ++-- .../plugins/partials/ds_http_settings.html | 55 ++++++++++--------- .../cloudwatch/partials/config.html | 29 ++++++---- public/sass/components/_gf-form.scss | 28 ++++++++++ 9 files changed, 116 insertions(+), 75 deletions(-) diff --git a/public/app/core/components/dashboard_selector.ts b/public/app/core/components/dashboard_selector.ts index 913a43911fa..4209ff3f8dc 100644 --- a/public/app/core/components/dashboard_selector.ts +++ b/public/app/core/components/dashboard_selector.ts @@ -7,6 +7,9 @@ import coreModule from 'app/core/core_module'; var template = ` + + Not finding dashboard you want? Star it first, then it should appear in this select box. + `; export class DashboardSelectorCtrl { diff --git a/public/app/core/components/info_popover.ts b/public/app/core/components/info_popover.ts index cc49ecbc4ab..8bc28b8a57d 100644 --- a/public/app/core/components/info_popover.ts +++ b/public/app/core/components/info_popover.ts @@ -8,21 +8,30 @@ import Drop from 'tether-drop'; export function infoPopover() { return { restrict: 'E', + template: '', transclude: true, link: function(scope, elem, attrs, ctrl, transclude) { - var inputElem = elem.prev(); - if (inputElem.length === 0) { - console.log('Failed to find input element for popover'); - return; - } + // var inputElem = elem.prev(); + // if (inputElem.length === 0) { + // console.log('Failed to find input element for popover'); + // return; + // } var offset = attrs.offset || '0 -10px'; var position = attrs.position || 'right middle'; var classes = 'drop-help drop-hide-out-of-bounds'; + var openOn = 'hover'; + + elem.addClass('gf-form-help-icon'); + if (attrs.wide) { classes += ' drop-wide'; } + if (attrs.mode) { + elem.addClass('gf-form-help-icon--' + attrs.mode); + } + transclude(function(clone, newScope) { var content = document.createElement("div"); _.each(clone, (node) => { @@ -30,11 +39,11 @@ export function infoPopover() { }); var drop = new Drop({ - target: inputElem[0], + target: elem[0], content: content, position: position, classes: classes, - openOn: 'click', + openOn: openOn, tetherOptions: { offset: offset } diff --git a/public/app/core/components/switch.ts b/public/app/core/components/switch.ts index e2ba60d92e8..2a64ec487f7 100644 --- a/public/app/core/components/switch.ts +++ b/public/app/core/components/switch.ts @@ -7,7 +7,12 @@ import coreModule from 'app/core/core_module'; import Drop from 'tether-drop'; var template = ` - +
    @@ -49,22 +54,6 @@ export function switchDirective() { onChange: "&", }, template: template, - link: (scope, elem) => { - if (scope.ctrl.tooltip) { - var drop = new Drop({ - target: elem[0], - content: scope.ctrl.tooltip, - position: "right middle", - classes: 'drop-help', - openOn: 'hover', - hoverOpenDelay: 400, - }); - - scope.$on('$destroy', function() { - drop.destroy(); - }); - } - } }; } diff --git a/public/app/features/dashboard/partials/settings.html b/public/app/features/dashboard/partials/settings.html index 2a2287613ae..8d071d90495 100644 --- a/public/app/features/dashboard/partials/settings.html +++ b/public/app/features/dashboard/partials/settings.html @@ -26,7 +26,10 @@
    - +
    @@ -46,19 +49,19 @@ label="Editable" tooltip="Uncheck, then save and reload to disable all dashboard editing" checked="dashboard.editable" - label-class="width-10"> + label-class="width-11"> + label-class="width-11"> + label-class="width-11"> diff --git a/public/app/features/org/prefs_control.ts b/public/app/features/org/prefs_control.ts index 53704d5e390..fab51ad02b8 100644 --- a/public/app/features/org/prefs_control.ts +++ b/public/app/features/org/prefs_control.ts @@ -49,7 +49,7 @@ export class PrefsControlCtrl { } var template = ` -
    +

    Preferences

    @@ -61,9 +61,8 @@ var template = `
    Home Dashboard - +
    diff --git a/public/app/features/plugins/partials/ds_edit.html b/public/app/features/plugins/partials/ds_edit.html index a43a9db4345..6ad0c40fa68 100644 --- a/public/app/features/plugins/partials/ds_edit.html +++ b/public/app/features/plugins/partials/ds_edit.html @@ -31,18 +31,18 @@
    Name + + The name is used when you select the data source in panels. + The Default data source is preselected in new + panels. +
    - - The name is used when you select the data source in panels. - The Default data source is preselected in new - panels. -
    Type -
    +
    diff --git a/public/app/features/plugins/partials/ds_http_settings.html b/public/app/features/plugins/partials/ds_http_settings.html index 404918f90d4..08d2af5744a 100644 --- a/public/app/features/plugins/partials/ds_http_settings.html +++ b/public/app/features/plugins/partials/ds_http_settings.html @@ -3,29 +3,34 @@

    Http settings

    -
    - Url - - - -

    Specify a complete HTTP url (for example http://your_server:8080)

    - - Your access method is Direct, this means the url - needs to be accessable from the browser. - - - Your access method is currently Proxy, this means the url - needs to be accessable from the grafana backend. - -
    +
    +
    + Url + + +

    Specify a complete HTTP url (for example http://your_server:8080)

    + + Your access method is Direct, this means the url + needs to be accessable from the browser. + + + Your access method is currently Proxy, this means the url + needs to be accessable from the grafana backend. + +
    +
    -
    - - Access Direct = url is used directly from browser, Proxy = Grafana backend will proxy the request - -
    - +
    +
    + Access +
    + + + Direct = url is used directly from browser
    + Proxy = Grafana backend will proxy the request +
    +
    @@ -34,12 +39,12 @@
    + label="Basic Auth" + checked="current.basicAuth" switch-class="max-width-6"> + label="With Credentials" + checked="current.withCredentials" switch-class="max-width-6">
    diff --git a/public/app/plugins/datasource/cloudwatch/partials/config.html b/public/app/plugins/datasource/cloudwatch/partials/config.html index 5f999c58a42..ede6baaa525 100644 --- a/public/app/plugins/datasource/cloudwatch/partials/config.html +++ b/public/app/plugins/datasource/cloudwatch/partials/config.html @@ -1,22 +1,27 @@

    CloudWatch details

    -
    +
    - - + + + + Credentials profile name, as specified in ~/.aws/credentials, leave blank for default +
    - -
    - + +
    + + + Specify the region, such as for US West (Oregon) use ` us-west-2 ` as the region. +
    - - + + + + Namespaces of Custom Metrics +
    diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 12e1fd2f32f..66dab450ee1 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -6,6 +6,7 @@ $gf-form-margin: 0.25rem; flex-direction: row; align-items: center; text-align: left; + position: relative; .cr1 { margin-left: 8px; @@ -138,6 +139,12 @@ $gf-form-margin: 0.25rem; content: '\f0d7'; pointer-events: none; } + + &--has-help-icon { + &:after { + right: $input-padding-x*3; + } + } } .gf-form--v-stretch { @@ -182,3 +189,24 @@ $gf-form-margin: 0.25rem; pointer-events: none; } } + +.gf-form-help-icon { + flex-grow: 0; + padding-left: $spacer; + color: $text-color-weak; + + &--right-absolute { + position: absolute; + right: $spacer; + top: 8px; + } + + &--right-normal { + float: right; + } +} + +select.gf-form-input ~ .gf-form-help-icon { + right: 10px; +} + From 1cce5fdfe11176e3969586ef0af819dad25fa453 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sat, 16 Apr 2016 12:03:29 -0400 Subject: [PATCH 12/98] feat(templating): polished variable template edit forms, added new template variable type: datasource --- public/app/core/components/info_popover.ts | 7 +- public/app/features/templating/editorCtrl.js | 20 +++ .../features/templating/partials/editor.html | 147 +++++++++++------- .../features/templating/templateValuesSrv.js | 35 +++++ public/sass/base/_code.scss | 6 +- public/test/core/utils/emitter_specs.ts | 2 +- public/test/specs/templateValuesSrv-specs.js | 23 ++- 7 files changed, 171 insertions(+), 69 deletions(-) diff --git a/public/app/core/components/info_popover.ts b/public/app/core/components/info_popover.ts index 8bc28b8a57d..d370aab9d6d 100644 --- a/public/app/core/components/info_popover.ts +++ b/public/app/core/components/info_popover.ts @@ -11,12 +11,6 @@ export function infoPopover() { template: '', transclude: true, link: function(scope, elem, attrs, ctrl, transclude) { - // var inputElem = elem.prev(); - // if (inputElem.length === 0) { - // console.log('Failed to find input element for popover'); - // return; - // } - var offset = attrs.offset || '0 -10px'; var position = attrs.position || 'right middle'; var classes = 'drop-help drop-hide-out-of-bounds'; @@ -44,6 +38,7 @@ export function infoPopover() { position: position, classes: classes, openOn: openOn, + hoverOpenDelay: 400, tetherOptions: { offset: offset } diff --git a/public/app/features/templating/editorCtrl.js b/public/app/features/templating/editorCtrl.js index 291915ee99f..9ec4f57eb20 100644 --- a/public/app/features/templating/editorCtrl.js +++ b/public/app/features/templating/editorCtrl.js @@ -20,6 +20,13 @@ function (angular, _) { multi: false, }; + $scope.variableTypes = [ + {value: "query", text: "Query"}, + {value: "interval", text: "Interval"}, + {value: "datasource", text: "Datasource"}, + {value: "custom", text: "Custom"}, + ]; + $scope.refreshOptions = [ {value: 0, text: "Never"}, {value: 1, text: "On Dashboard Load"}, @@ -35,10 +42,16 @@ function (angular, _) { $scope.init = function() { $scope.mode = 'list'; + $scope.datasourceTypes = {}; $scope.datasources = _.filter(datasourceSrv.getMetricSources(), function(ds) { + $scope.datasourceTypes[ds.meta.id] = {text: ds.meta.name, value: ds.meta.id}; return !ds.meta.builtIn; }); + $scope.datasourceTypes = _.map($scope.datasourceTypes, function(value) { + return value; + }); + $scope.variables = templateSrv.variables; $scope.reset(); @@ -132,9 +145,16 @@ function (angular, _) { if ($scope.current.type === 'interval') { $scope.current.query = '1m,10m,30m,1h,6h,12h,1d,7d,14d,30d'; } + if ($scope.current.type === 'query') { $scope.current.query = ''; } + + if ($scope.current.type === 'datasource') { + $scope.current.query = $scope.datasourceTypes[0].value; + $scope.current.regex = ''; + $scope.current.refresh = 1; + } }; $scope.removeVariable = function(variable) { diff --git a/public/app/features/templating/partials/editor.html b/public/app/features/templating/partials/editor.html index c7dfe61f2b4..3e8ecb4f3c5 100644 --- a/public/app/features/templating/partials/editor.html +++ b/public/app/features/templating/partials/editor.html @@ -75,39 +75,49 @@
    - Name - -
    -
    - Type -
    - -
    + Name +
    - Data source -
    - + + Type + +
    +
    Query
    +
    Variable values are fetched from a metric names query to a data source
    +
    Interval
    +
    Timespan variable type
    +
    Datasource
    +
    Dynamically switch data sources using this type of variable
    +
    Custom
    +
    Define variable values manually
    +
    + Templating docs +
    +
    +
    +
    -
    +
    - Label - + Label +
    -
    - Hide -
    - +
    + Hide +
    +
    -
    Value Options
    +
    Interval Options
    +
    Values @@ -135,6 +145,7 @@
    +
    Custom Options
    Values seperated by comma @@ -142,43 +153,69 @@
    -
    - Query - - - - - - - - - - - - - - - - - - -
    -
    - - Regex - Optional, if you want to extract part of a series name or metric node segment - - -
    -
    - Refresh - - When to update the values of this variable, will slow down dashboard load / time change -
    -
    +
    Query Options
    -
    -
    Selection Options
    +
    +
    + Data source +
    + +
    +
    +
    + + Refresh + + When to update the values of this variable. + + +
    + +
    +
    +
    +
    + Query + +
    +
    + + Regex + + Optional, if you want to extract part of a series name or metric node segment. + + + +
    +
    + +
    +
    Datasource Options
    + +
    + +
    + +
    +
    + +
    + + +
    +
    + +
    +
    Selection Options
    { expect(sub2Called).to.be(true); }); - it.only('should handle errors', () => { + it('should handle errors', () => { var events = new Emitter(); var sub1Called = 0; var sub2Called = 0; diff --git a/public/test/specs/templateValuesSrv-specs.js b/public/test/specs/templateValuesSrv-specs.js index d81ce4fd059..af7da0b19cb 100644 --- a/public/test/specs/templateValuesSrv-specs.js +++ b/public/test/specs/templateValuesSrv-specs.js @@ -92,6 +92,7 @@ define([ var ds = {}; ds.metricFindQuery = sinon.stub().returns(ctx.$q.when(scenario.queryResult)); ctx.datasourceSrv.get = sinon.stub().returns(ctx.$q.when(ds)); + ctx.datasourceSrv.getMetricSources = sinon.stub().returns(scenario.metricSources); ctx.service.updateOptions(scenario.variable); ctx.$rootScope.$digest(); @@ -137,7 +138,6 @@ define([ }); }); - describeUpdateVariable('interval variable with auto', function(scenario) { scenario.setup(function() { scenario.variable = { type: 'interval', query: '1s,2h,5h,1d', name: 'test', auto: true, auto_count: 10 }; @@ -237,7 +237,7 @@ define([ }); }); - describeUpdateVariable('regex pattern without slashes', function(scenario) { + describeUpdateVariable('regex pattern without slashes', function(scenario) { scenario.setup(function() { scenario.variable = { type: 'query', query: 'apps.*', name: 'test' }; scenario.variable.regex = 'backend_01'; @@ -284,6 +284,23 @@ define([ }); }); - }); + describeUpdateVariable('datasource variable with regex filter', function(scenario) { + scenario.setup(function() { + scenario.variable = {type: 'datasource', query: 'graphite', name: 'test', current: {}, regex: '/pee$/' }; + scenario.metricSources = [ + {name: 'backend1', meta: {id: 'influx'}}, + {name: 'backend2_pee', meta: {id: 'graphite'}}, + {name: 'backend3', meta: {id: 'graphite'}}, + {name: 'backend4_pee', meta: {id: 'graphite'}}, + ]; + }); + it('should set only contain graphite ds and filtered using regex', function() { + expect(scenario.variable.options.length).to.be(2); + expect(scenario.variable.options[0].value).to.be('backend2_pee'); + expect(scenario.variable.options[1].value).to.be('backend4_pee'); + }); + }); + + }); }); From 13471ae2c4887e881238609e84fddd91b3e2c56b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sat, 16 Apr 2016 13:43:16 -0400 Subject: [PATCH 13/98] feat(templating): templated ds progress --- public/app/core/services/datasource_srv.js | 85 ++++++++++++------- .../app/features/panel/metrics_panel_ctrl.ts | 8 ++ .../features/templating/templateValuesSrv.js | 2 +- public/app/partials/metrics.html | 2 +- 4 files changed, 66 insertions(+), 31 deletions(-) diff --git a/public/app/core/services/datasource_srv.js b/public/app/core/services/datasource_srv.js index 07e3f004d45..e5fe9627bcc 100644 --- a/public/app/core/services/datasource_srv.js +++ b/public/app/core/services/datasource_srv.js @@ -7,36 +7,11 @@ define([ function (angular, _, coreModule, config) { 'use strict'; - coreModule.default.service('datasourceSrv', function($q, $injector, $rootScope) { + coreModule.default.service('datasourceSrv', function($q, $injector, $rootScope, templateSrv) { var self = this; this.init = function() { this.datasources = {}; - this.metricSources = []; - this.annotationSources = []; - - _.each(config.datasources, function(value, key) { - if (value.meta && value.meta.metrics) { - self.metricSources.push({ - value: key === config.defaultDatasource ? null : key, - name: key, - meta: value.meta, - }); - } - if (value.meta && value.meta.annotations) { - self.annotationSources.push(value); - } - }); - - this.metricSources.sort(function(a, b) { - if (a.meta.builtIn || a.name > b.name) { - return 1; - } - if (a.name < b.name) { - return -1; - } - return 0; - }); }; this.get = function(name) { @@ -44,6 +19,8 @@ function (angular, _, coreModule, config) { return this.get(config.defaultDatasource); } + name = templateSrv.replace(name); + if (this.datasources[name]) { return $q.when(this.datasources[name]); } @@ -89,11 +66,61 @@ function (angular, _, coreModule, config) { }; this.getAnnotationSources = function() { - return this.annotationSources; + return _.reduce(config.datasources, function(memo, key, value) { + + if (value.meta && value.meta.annotations) { + memo.push(value); + } + + return memo; + }, []); }; - this.getMetricSources = function() { - return this.metricSources; + this.getMetricSources = function(options) { + var metricSources = []; + + _.each(config.datasources, function(value, key) { + if (value.meta && value.meta.metrics) { + metricSources.push({ + value: key === config.defaultDatasource ? null : key, + name: key, + meta: value.meta, + }); + } + }); + + if (!options || !options.skipVariables) { + // look for data source variables + for (var i = 0; i < templateSrv.variables.length; i++) { + var variable = templateSrv.variables[i]; + if (variable.type !== 'datasource') { + continue; + } + + var first = variable.current.value; + var ds = config.datasources[first]; + + if (ds) { + metricSources.push({ + name: '[[' + variable.name + ']]', + value: '[[' + variable.name + ']]', + meta: ds.meta, + }); + } + } + } + + metricSources.sort(function(a, b) { + if (a.meta.builtIn || a.name > b.name) { + return 1; + } + if (a.name < b.name) { + return -1; + } + return 0; + }); + + return metricSources; }; this.init(); diff --git a/public/app/features/panel/metrics_panel_ctrl.ts b/public/app/features/panel/metrics_panel_ctrl.ts index e8c16fd9ab7..ea6a49a753c 100644 --- a/public/app/features/panel/metrics_panel_ctrl.ts +++ b/public/app/features/panel/metrics_panel_ctrl.ts @@ -15,6 +15,7 @@ class MetricsPanelCtrl extends PanelCtrl { error: boolean; loading: boolean; datasource: any; + datasourceName: any; $q: any; $timeout: any; datasourceSrv: any; @@ -53,6 +54,12 @@ class MetricsPanelCtrl extends PanelCtrl { this.addEditorTab('Metrics', 'public/app/partials/metrics.html'); this.addEditorTab('Time range', 'public/app/features/panel/partials/panelTime.html'); this.datasources = this.datasourceSrv.getMetricSources(); + + // find current + var current = _.findWhere(this.datasources, {value: this.panel.datasource}); + if (current) { + this.datasourceName = current.name; + } } private onMetricsPanelRefresh() { @@ -246,6 +253,7 @@ class MetricsPanelCtrl extends PanelCtrl { } this.panel.datasource = datasource.value; + this.datasourceName = datasource.name; this.datasource = null; this.refresh(); } diff --git a/public/app/features/templating/templateValuesSrv.js b/public/app/features/templating/templateValuesSrv.js index 8cbaf306a11..97c3e9a4738 100644 --- a/public/app/features/templating/templateValuesSrv.js +++ b/public/app/features/templating/templateValuesSrv.js @@ -179,7 +179,7 @@ function (angular, _, kbn) { this.updateDataSourceVariable = function(variable) { var options = []; - var sources = datasourceSrv.getMetricSources(); + var sources = datasourceSrv.getMetricSources({skipVariables: true}); var regex; if (variable.regex) { diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html index 7297d415c25..795183230cc 100644 --- a/public/app/partials/metrics.html +++ b/public/app/partials/metrics.html @@ -42,7 +42,7 @@ diff --git a/public/app/features/panel/query_ctrl.ts b/public/app/features/panel/query_ctrl.ts index 66370595252..199b070aaa7 100644 --- a/public/app/features/panel/query_ctrl.ts +++ b/public/app/features/panel/query_ctrl.ts @@ -10,9 +10,11 @@ export class QueryCtrl { panel: any; hasRawMode: boolean; error: string; + collapsed: boolean; constructor(public $scope, private $injector) { this.panel = this.panelCtrl.panel; + this.collapsed = true; if (!this.target.refId) { this.target.refId = this.getNextQueryLetter(); diff --git a/public/app/partials/metrics.html b/public/app/partials/metrics.html index 54955a8e274..0f2f808f891 100644 --- a/public/app/partials/metrics.html +++ b/public/app/partials/metrics.html @@ -1,56 +1,19 @@ -
    - -
    -
    - - - - -
    -
    - -
    - - - - -
    - - - - - +
    +
    + + + + +
    -
    + - - -
    +
    + + + +
    + diff --git a/public/app/plugins/datasource/elasticsearch/partials/query.editor.html b/public/app/plugins/datasource/elasticsearch/partials/query.editor.html index 017f5cf1a42..87616acd6fc 100644 --- a/public/app/plugins/datasource/elasticsearch/partials/query.editor.html +++ b/public/app/plugins/datasource/elasticsearch/partials/query.editor.html @@ -1,17 +1,21 @@ - -
  • - Query -
  • -
  • - -
  • -
  • - Alias -
  • -
  • - -
  • -
    + + +
    +
      +
    • + Query +
    • +
    • + +
    • +
    • + Alias +
    • +
    • + +
    • +
    +
    -
    - -
    +
    + +
    -
    -
    -
    - +
    - - -
    +
    + +
    -
    - +
    -
    - -
    -
    +
    +
    + -
    -
    + + +
    -
    -
    - -
    +
    + -
    - - -
    +
    + +
    +
    -
    - -
    +
    +
    -
    -
    +
    +
    + +
    -
    -
    - +
    + + +
    - - +
    + +
    - -
    +
    +
    -
    -
    +
    +
    + -
    + + -
    -
    - - -
    -
    - -
    - -
    -
    -
    -
    + +
    + +
    +
    +
    + +
    +
    + + +
    +
    + +
    + +
    +
    +
    +
    +
    diff --git a/public/app/plugins/datasource/influxdb/partials/query.options.html b/public/app/plugins/datasource/influxdb/partials/query.options.html index 1e3a08eb556..e2b5e522541 100644 --- a/public/app/plugins/datasource/influxdb/partials/query.options.html +++ b/public/app/plugins/datasource/influxdb/partials/query.options.html @@ -38,7 +38,7 @@
    -
    +
    Alias patterns
    diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index a732661106b..94cc795d9eb 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -8,8 +8,8 @@ $gf-form-margin: 0.25rem; text-align: left; position: relative; - .cr1 { - margin-left: 8px; + &--offset-1 { + margin-left: $spacer; } } @@ -162,9 +162,11 @@ $gf-form-margin: 0.25rem; } .gf-form-btn { - margin-right: $gf-form-margin; padding: $input-padding-y $input-padding-x; + margin-right: $gf-form-margin; line-height: $input-line-height; + font-size: $font-size-sm; + flex-shrink: 0; flex-grow: 0; } diff --git a/public/sass/components/_query_part.scss b/public/sass/components/_query_part.scss index a2543e1a75c..1e2fb9622c2 100644 --- a/public/sass/components/_query_part.scss +++ b/public/sass/components/_query_part.scss @@ -9,8 +9,3 @@ } } -.query-part-name { -} - -.query-part-parameters { -} From 805fd18b7b55bbea7996fa8cf3640c127c47a0eb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 17 Apr 2016 16:43:13 -0400 Subject: [PATCH 15/98] feat(query editors): more work on query editors make over --- .../app/features/panel/metrics_ds_selector.ts | 2 +- .../panel/partials/query_editor_row.html | 16 +- public/app/features/panel/query_ctrl.ts | 36 ----- public/app/features/panel/query_editor_row.ts | 88 +++++++++- .../graphite/partials/query.editor.html | 2 +- .../influxdb/partials/query.editor.html | 151 ++++++++---------- .../plugins/datasource/influxdb/query_ctrl.ts | 5 + 7 files changed, 176 insertions(+), 124 deletions(-) diff --git a/public/app/features/panel/metrics_ds_selector.ts b/public/app/features/panel/metrics_ds_selector.ts index f93ee5ad15a..b5457c21164 100644 --- a/public/app/features/panel/metrics_ds_selector.ts +++ b/public/app/features/panel/metrics_ds_selector.ts @@ -79,7 +79,7 @@ export class MetricsDsSelectorCtrl { } addDataQuery(datasource) { - var target: any = {}; + var target: any = {isNew: true}; if (datasource) { target.datasource = datasource.name; diff --git a/public/app/features/panel/partials/query_editor_row.html b/public/app/features/panel/partials/query_editor_row.html index 722c7c27b6f..f4c1854824c 100644 --- a/public/app/features/panel/partials/query_editor_row.html +++ b/public/app/features/panel/partials/query_editor_row.html @@ -10,14 +10,22 @@
    -
    +
    +
    + +
    +
    + +
  • - - - -
    - - -
    -
    -
    -
      -
    • - Unit -
    • -
    • - -
    • -
    -
    -
    - -
    -
      -
    • - Window -
    • -
    • - -
    • -
    -
    -
    -
    -
      -
    • - Model -
    • -
    • - -
    • -
    -
    -
    -
    -
      -
    • - Percentiles -
    • -
    • - -
    • -
    -
    -
    -
    -
    -
      -
    • - {{stat.text}} -
    • -
    • - -
    • -
    -
    -
    -
    -
    -
      -
    • - Sigma -
    • -
    • - -
    • -
    -
    -
    - -
    -
      -
    • - Script -
    • -
    • - -
    • -
    -
    -
    - -
    -
      -
    • - Missing - The missing parameter defines how documents that are missing a value should be treated. By default they will be ignored but it is also possible to treat them as if they had a value -
    • -
    • - -
    • -
    -
    -
    - +
    + +
    + +
    + + +
    + +
    + +
    +
    + + +
    + +
    + + +
    + +
    + + +
    + +
    + + +
    + +
    +
    +
      +
    • + {{stat.text}} +
    • +
    • + +
    • +
    +
    +
    +
    +
    +
      +
    • + Sigma +
    • +
    • + +
    • +
    +
    +
    + +
    +
      +
    • + Script +
    • +
    • + +
    • +
    +
    +
    + +
    +
      +
    • + Missing + The missing parameter defines how documents that are missing a value should be treated. By default they will be ignored but it is also possible to treat them as if they had a value +
    • +
    • + +
    • +
    +
    +
    +
    diff --git a/public/app/plugins/datasource/elasticsearch/partials/query.editor.html b/public/app/plugins/datasource/elasticsearch/partials/query.editor.html index 87616acd6fc..22427cbc1e7 100644 --- a/public/app/plugins/datasource/elasticsearch/partials/query.editor.html +++ b/public/app/plugins/datasource/elasticsearch/partials/query.editor.html @@ -1,36 +1,31 @@ - + -
    -
      -
    • - Query -
    • -
    • - -
    • -
    • - Alias -
    • -
    • - -
    • -
    -
    +
    +
    + + +
    +
    + + +
    +
    -
    - - -
    +
    + + +
    -
    - - -
    +
    + + +
    +
    From 4c4835e8697a666cae1e0d0d8ea5dcb5dfdd98ec Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 17 Apr 2016 22:04:43 -0400 Subject: [PATCH 17/98] ux(query-editors): more progress on elastic query editor --- .../panel/partials/query_editor_row.html | 2 +- .../elasticsearch/partials/bucket_agg.html | 4 ++- .../elasticsearch/partials/metric_agg.html | 4 ++- .../elasticsearch/partials/query.editor.html | 4 +-- .../datasource/elasticsearch/query_ctrl.ts | 5 ++++ .../graphite/partials/query.editor.html | 4 ++- .../influxdb/partials/query.editor.html | 26 +++++++++++++------ public/sass/components/_drop.scss | 2 +- public/sass/components/_gf-form.scss | 20 ++++++-------- public/sass/mixins/_drop_element.scss | 2 +- 10 files changed, 45 insertions(+), 28 deletions(-) diff --git a/public/app/features/panel/partials/query_editor_row.html b/public/app/features/panel/partials/query_editor_row.html index f4c1854824c..6c0b0d69a80 100644 --- a/public/app/features/panel/partials/query_editor_row.html +++ b/public/app/features/panel/partials/query_editor_row.html @@ -12,7 +12,7 @@
    -
    diff --git a/public/app/plugins/datasource/elasticsearch/partials/bucket_agg.html b/public/app/plugins/datasource/elasticsearch/partials/bucket_agg.html index 65138716246..3ba28d36def 100644 --- a/public/app/plugins/datasource/elasticsearch/partials/bucket_agg.html +++ b/public/app/plugins/datasource/elasticsearch/partials/bucket_agg.html @@ -17,7 +17,9 @@
    -
    +
    + +
    -
    +
    + +
    diff --git a/public/app/plugins/datasource/influxdb/partials/query.editor.html b/public/app/plugins/datasource/influxdb/partials/query.editor.html index a1f8868ffb6..4c737d9fab0 100644 --- a/public/app/plugins/datasource/influxdb/partials/query.editor.html +++ b/public/app/plugins/datasource/influxdb/partials/query.editor.html @@ -16,13 +16,16 @@
    - -
    - -
    -
    +
    + +
    + +
    +
    +
    +
    @@ -49,7 +52,9 @@
    -
    +
    +
    +
    @@ -66,9 +71,12 @@ +
    -
    +
    +
    +
    @@ -83,7 +91,9 @@ -
    +
    +
    +
    diff --git a/public/sass/components/_drop.scss b/public/sass/components/_drop.scss index 4045c1daa4b..570c1862ef0 100644 --- a/public/sass/components/_drop.scss +++ b/public/sass/components/_drop.scss @@ -1,4 +1,4 @@ -$popover-arrow-size: 1rem; +$popover-arrow-size: 0.7rem; $color: inherit; $backgroundColor: $btn-secondary-bg; $color: $text-color; diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 94cc795d9eb..75042f958e7 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -11,6 +11,10 @@ $gf-form-margin: 0.25rem; &--offset-1 { margin-left: $spacer; } + + &--grow { + flex-grow: 1; + } } .gf-form-group { @@ -22,10 +26,6 @@ $gf-form-margin: 0.25rem; flex-direction: row; flex-wrap: wrap; align-content: flex-start; - - .gf-form-flex { - flex-grow: 1; - } } .gf-form-button-row { @@ -48,16 +48,12 @@ $gf-form-margin: 0.25rem; border: $input-btn-border-width solid transparent; @include border-radius($label-border-radius-sm); -} -.gf-form-filler { - margin-right: $gf-form-margin; - margin-bottom: $gf-form-margin; - flex-grow: 1; - background-color: $input-label-bg; - border: $input-btn-border-width solid transparent; - @include border-radius($label-border-radius-sm); + &--grow { + flex-grow: 1; + min-height: 2.7rem; + } } .gf-form-checkbox { diff --git a/public/sass/mixins/_drop_element.scss b/public/sass/mixins/_drop_element.scss index d08e50e63b8..290e49f4cad 100644 --- a/public/sass/mixins/_drop_element.scss +++ b/public/sass/mixins/_drop_element.scss @@ -10,7 +10,7 @@ font-family: inherit; background: $theme-bg; color: $theme-color; - padding: $spacer; + padding: 0.65rem; font-size: $font-size-sm; max-width: 20rem; From 1069f485daf3335822897772d6a1588fd3cdb193 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 17 Apr 2016 22:24:40 -0400 Subject: [PATCH 18/98] ux(query_editors): handle text overflow in collapsed mode --- .../features/panel/partials/query_editor_row.html | 2 +- public/sass/components/_gf-form.scss | 12 ++++++++++++ 2 files changed, 13 insertions(+), 1 deletion(-) diff --git a/public/app/features/panel/partials/query_editor_row.html b/public/app/features/panel/partials/query_editor_row.html index 6c0b0d69a80..0529a178d28 100644 --- a/public/app/features/panel/partials/query_editor_row.html +++ b/public/app/features/panel/partials/query_editor_row.html @@ -10,7 +10,7 @@ -
    +
    - - - + + +
    @@ -38,78 +38,49 @@
    -
    -
    - - + +
    + +
    -
    - - +
    + +
    -
    - - +
    + +
    -
    - - +
    + +
    -
    -
      -
    • - {{stat.text}} -
    • -
    • - -
    • -
    -
    + + +
    + +
    -
    -
      -
    • - Sigma -
    • -
    • - -
    • -
    -
    + +
    + +
    -
    -
      -
    • - Script -
    • -
    • - -
    • -
    -
    +
    + +
    - -
    -
      -
    • - Missing - The missing parameter defines how documents that are missing a value should be treated. By default they will be ignored but it is also possible to treat them as if they had a value -
    • -
    • - -
    • -
    -
    -
    -
    diff --git a/public/sass/components/_gf-form.scss b/public/sass/components/_gf-form.scss index 5aaea7bda7b..d3d5a9a07c9 100644 --- a/public/sass/components/_gf-form.scss +++ b/public/sass/components/_gf-form.scss @@ -210,6 +210,8 @@ $gf-form-margin: 0.25rem; margin-bottom: 2px; } + .gf-form-switch input, + .gf-form-switch label, .gf-form-input, .gf-form-select-wrapper, .gf-form-filler, @@ -220,7 +222,6 @@ $gf-form-margin: 0.25rem; .gf-form-query-content { flex-grow: 1; - overflow: hidden; &--collapsed { overflow: hidden; diff --git a/public/sass/utils/_widths.scss b/public/sass/utils/_widths.scss index b4bdbdb6ccc..cf324b35c72 100644 --- a/public/sass/utils/_widths.scss +++ b/public/sass/utils/_widths.scss @@ -17,3 +17,9 @@ } } +@for $i from 1 through 30 { + .offset-width-#{$i} { + margin-left: ($spacer * $i) !important; + } +} + From 7e66d0bcc1b2a5049e1f5229f23770dff758851e Mon Sep 17 00:00:00 2001 From: bergquist Date: Mon, 18 Apr 2016 15:25:06 +0200 Subject: [PATCH 20/98] fix(): remove only usage in tests --- public/test/core/utils/emitter_specs.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/public/test/core/utils/emitter_specs.ts b/public/test/core/utils/emitter_specs.ts index f7076c46719..fec4d02a649 100644 --- a/public/test/core/utils/emitter_specs.ts +++ b/public/test/core/utils/emitter_specs.ts @@ -24,7 +24,7 @@ describe("Emitter", () => { expect(sub2Called).to.be(true); }); - it.only('should handle errors', () => { + it('should handle errors', () => { var events = new Emitter(); var sub1Called = 0; var sub2Called = 0; From fde6eee4f4ac9326ccad44059ef9ffff2927204c Mon Sep 17 00:00:00 2001 From: bergquist Date: Mon, 18 Apr 2016 16:17:03 +0200 Subject: [PATCH 21/98] fix(influxdb): adds support for multi table values When quering for tag values without measurement all tags and values should be shown closes #4726 --- .../datasource/influxdb/response_parser.ts | 28 +++++++++++++------ .../influxdb/specs/response_parser_specs.ts | 26 +++++++++++------ 2 files changed, 36 insertions(+), 18 deletions(-) diff --git a/public/app/plugins/datasource/influxdb/response_parser.ts b/public/app/plugins/datasource/influxdb/response_parser.ts index 2e33b398a88..ec0b1a4c249 100644 --- a/public/app/plugins/datasource/influxdb/response_parser.ts +++ b/public/app/plugins/datasource/influxdb/response_parser.ts @@ -12,17 +12,27 @@ export default class ResponseParser { return []; } - var series = influxResults.series[0]; - return _.map(series.values, (value) => { - if (_.isArray(value)) { - if (query.toLowerCase().indexOf('show tag values') >= 0) { - return { text: (value[1] || value[0]) }; + var res = []; + _.each(influxResults.series, (serie) => { + _.each(serie.values, (value) => { + if (_.isArray(value)) { + if (query.toLowerCase().indexOf('show tag values') >= 0) { + addUnique(res, { text: (value[1] || value[0])}); + } else { + addUnique(res, { text: value[0]}); + } } else { - return { text: value[0] }; + addUnique(res, {text: value}); } - } else { - return { text: value }; - } + }); }); + + return res; + } +} + +function addUnique(arr, value) { + if (!_.any(arr, value)) { + arr.push(value); } } diff --git a/public/app/plugins/datasource/influxdb/specs/response_parser_specs.ts b/public/app/plugins/datasource/influxdb/specs/response_parser_specs.ts index e58fe32dd1b..f545753d10e 100644 --- a/public/app/plugins/datasource/influxdb/specs/response_parser_specs.ts +++ b/public/app/plugins/datasource/influxdb/specs/response_parser_specs.ts @@ -38,7 +38,7 @@ describe("influxdb response parser", () => { { "name": "hostnameTagValues", "columns": ["hostname"], - "values": [ ["server1"], ["server2"] ] + "values": [ ["server1"], ["server2"], ["server2"] ] } ] } @@ -54,7 +54,7 @@ describe("influxdb response parser", () => { }); }); - describe("response from 0.11.0", () => { + describe("response from 0.12.0", () => { var response = { "results": [ { @@ -62,8 +62,19 @@ describe("influxdb response parser", () => { { "name": "cpu", "columns": [ "key", "value"], - "values": [ [ "source", "site" ], [ "source", "api" ] ] - } + "values": [ + [ "source", "site" ], + [ "source", "api" ] + ] + }, + { + "name": "logins", + "columns": [ "key", "value"], + "values": [ + [ "source", "site" ], + [ "source", "webapi"] + ] + }, ] } ] @@ -72,15 +83,12 @@ describe("influxdb response parser", () => { var result = this.parser.parse(query, response); it("should get two responses", () => { - expect(_.size(result)).to.be(2); + expect(_.size(result)).to.be(3); expect(result[0].text).to.be('site'); expect(result[1].text).to.be('api'); + expect(result[2].text).to.be('webapi'); }); }); - - - - }); describe("SHOW FIELD response", () => { From 80818f80a99ab89fd4fbf85182200e5aa4109573 Mon Sep 17 00:00:00 2001 From: bergquist Date: Mon, 18 Apr 2016 17:12:53 +0200 Subject: [PATCH 22/98] tech(grunt): add check for not including "only" in tests --- public/test/core/utils/emitter_specs.ts | 2 +- tasks/default_task.js | 15 ++++++++++++++- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/public/test/core/utils/emitter_specs.ts b/public/test/core/utils/emitter_specs.ts index f7076c46719..fec4d02a649 100644 --- a/public/test/core/utils/emitter_specs.ts +++ b/public/test/core/utils/emitter_specs.ts @@ -24,7 +24,7 @@ describe("Emitter", () => { expect(sub2Called).to.be(true); }); - it.only('should handle errors', () => { + it('should handle errors', () => { var events = new Emitter(); var sub1Called = 0; var sub2Called = 0; diff --git a/tasks/default_task.js b/tasks/default_task.js index d2bebb89789..2aa0a7d8826 100644 --- a/tasks/default_task.js +++ b/tasks/default_task.js @@ -25,6 +25,19 @@ module.exports = function(grunt) { 'typescript:build' ]); - grunt.registerTask('test', ['default', 'karma:test']); + grunt.registerTask('test', ['default', 'karma:test', 'no-only-tests']); + grunt.registerTask('no-only-tests', function() { + var files = grunt.file.expand('public/**/*_specs\.ts', 'public/**/*_specs\.js'); + + files.forEach(function(spec) { + var rows = grunt.file.read(spec).split('\n'); + rows.forEach(function(row) { + if (row.indexOf('.only(') > 0) { + grunt.log.errorlns(row); + grunt.fail.warn('found only statement in test: ' + spec) + } + }); + }); + }); }; From 39cdaf517503a515f5f9ca02ffbb92c9772c6c41 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Mon, 18 Apr 2016 11:35:24 -0400 Subject: [PATCH 23/98] ux(query-editors): more progress and fixes --- .../panel/partials/query_editor_row.html | 2 +- .../datasource/elasticsearch/bucket_agg.js | 1 + .../elasticsearch/partials/bucket_agg.html | 156 +++++++----------- .../elasticsearch/partials/metric_agg.html | 10 +- .../influxdb/partials/query.editor.html | 108 +----------- public/sass/components/_gf-form.scss | 14 +- 6 files changed, 76 insertions(+), 215 deletions(-) diff --git a/public/app/features/panel/partials/query_editor_row.html b/public/app/features/panel/partials/query_editor_row.html index 0529a178d28..cdac281f7b5 100644 --- a/public/app/features/panel/partials/query_editor_row.html +++ b/public/app/features/panel/partials/query_editor_row.html @@ -23,7 +23,7 @@
    - - + + +
    -
    -
    -
    -
    -
      -
    • - Interval -
    • -
    • - -
    • -
    -
    -
    -
    -
      -
    • - Min Doc Count -
    • -
    • - -
    • -
    -
    -
    -
    -
      -
    • - Trim edges points -
    • -
    • - -
    • -
    • - -
    • -
    -
    -
    -
    -
    -
    -
      -
    • - Order -
    • -
    • - -
    • -
    -
    -
    -
    -
      -
    • - Size -
    • -
    • - -
    • -
    -
    -
    -
    -
      -
    • - Order By -
    • -
    • - -
    • -
    -
    -
    -
    -
    -
    -
      -
    • - Query {{$index + 1}} -
    • -
    • - -
    • -
    • - -
    • -
    • - -
    • -
    -
    +
    +
    +
    + +
    +
    + + +
    + +
    + + +
    +
    + +
    +
    + + +
    + +
    + + +
    + +
    + + +
    +
    + +
    +
    +
    + + +
    +
    + + +
    +
    diff --git a/public/app/plugins/datasource/elasticsearch/partials/metric_agg.html b/public/app/plugins/datasource/elasticsearch/partials/metric_agg.html index e98d9d4af7e..bb78fd4aac5 100644 --- a/public/app/plugins/datasource/elasticsearch/partials/metric_agg.html +++ b/public/app/plugins/datasource/elasticsearch/partials/metric_agg.html @@ -16,9 +16,9 @@
    -
    -
    -<<<<<<< HEAD -
    -
    -
    - - - - - - -
    -
    -
    -
    - - - - -
    -
    -
    -||||||| merged common ancestors -
    -
    -
    - - - - - - -
    -
    - -
    -
    -
      -
    • - SELECT -
    • -
    • - -
    • - -
    -
    -
    - -
    -
      -
    • - GROUP BY -
    • -
    • - -
    • -
    • - -
    • -
    -
    -
    -
    -=======