From 752b42798ae38ab974b224ebc3cd5d3d0e2c25b3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Wed, 12 Apr 2017 15:01:17 +0200 Subject: [PATCH] annotations: added new options hide toggle, and show option --- public/app/core/services/keybindingSrv.ts | 4 - .../app/features/annotations/editor_ctrl.ts | 12 ++- .../features/annotations/partials/editor.html | 70 +++++++++------- public/app/features/dashboard/model.ts | 28 +++---- .../dashboard/specs/dashboard_model_specs.ts | 81 +++++++++++++++++++ .../features/dashboard/submenu/submenu.html | 2 +- .../partials/annotations.editor.html | 10 ++- .../grafana/partials/annotations.editor.html | 1 - .../graphite/partials/annotations.editor.html | 11 ++- .../influxdb/partials/annotations.editor.html | 3 +- 10 files changed, 158 insertions(+), 64 deletions(-) diff --git a/public/app/core/services/keybindingSrv.ts b/public/app/core/services/keybindingSrv.ts index 7abc3993e9d..acf0123962b 100644 --- a/public/app/core/services/keybindingSrv.ts +++ b/public/app/core/services/keybindingSrv.ts @@ -83,10 +83,6 @@ export class KeybindingSrv { } setupDashboardBindings(scope, dashboard) { - // this.bind('b', () => { - // dashboard.toggleEditMode(); - // }); - this.bind('mod+o', () => { dashboard.graphTooltip = (dashboard.graphTooltip + 1) % 3; appEvents.emit('graph-hover-clear'); diff --git a/public/app/features/annotations/editor_ctrl.ts b/public/app/features/annotations/editor_ctrl.ts index cb76045dbec..a0a8fda01d1 100644 --- a/public/app/features/annotations/editor_ctrl.ts +++ b/public/app/features/annotations/editor_ctrl.ts @@ -17,9 +17,16 @@ export class AnnotationsEditorCtrl { name: '', datasource: null, iconColor: 'rgba(255, 96, 96, 1)', - enable: true + enable: true, + show: 0, + hide: false, }; + showOptions: any = [ + {text: 'All Panels', value: 0}, + {text: 'Specifc Panels', value: 1}, + ]; + /** @ngInject */ constructor(private $scope, private datasourceSrv) { $scope.ctrl = this; @@ -44,6 +51,7 @@ export class AnnotationsEditorCtrl { edit(annotation) { this.currentAnnotation = annotation; + this.currentAnnotation.show = this.currentAnnotation.show || 0; this.currentIsNew = false; this.datasourceChanged(); this.mode = 'edit'; @@ -74,7 +82,7 @@ export class AnnotationsEditorCtrl { removeAnnotation(annotation) { var index = _.indexOf(this.annotations, annotation); this.annotations.splice(index, 1); - this.$scope.updateSubmenuVisibility(); + this.$scope.dashboard.updateSubmenuVisibility(); this.$scope.broadcastRefresh(); } } diff --git a/public/app/features/annotations/partials/editor.html b/public/app/features/annotations/partials/editor.html index 0bfc8bb2028..b5c631ec6a8 100644 --- a/public/app/features/annotations/partials/editor.html +++ b/public/app/features/annotations/partials/editor.html @@ -7,16 +7,16 @@ @@ -62,37 +62,53 @@
-
-
- Name - -
-
- Datasource -
- +
Options
+
+
+ Name + +
+
+ Data source +
+ +
-
- - +
+
+
+ Show in +
+ +
+
+ + +
+
+ + +
-
- - - - +
Query
+ + + + -
-
- - +
+
+ + +
-
diff --git a/public/app/features/dashboard/model.ts b/public/app/features/dashboard/model.ts index e31a6c1afd0..e62c98b8598 100644 --- a/public/app/features/dashboard/model.ts +++ b/public/app/features/dashboard/model.ts @@ -193,32 +193,22 @@ export class DashboardModel { }); } - toggleEditMode() { - if (!this.meta.canEdit) { - console.log('Not allowed to edit dashboard'); - return; - } - - this.editMode = !this.editMode; - this.updateSubmenuVisibility(); - this.events.emit('edit-mode-changed', this.editMode); - } - setPanelFocus(id) { this.meta.focusPanelId = id; } updateSubmenuVisibility() { - if (this.editMode) { - this.meta.submenuEnabled = true; - return; - } + this.meta.submenuEnabled = (() => { + if (this.links.length > 0) { return true; } - var visibleVars = _.filter(this.templating.list, function(template) { - return template.hide !== 2; - }); + var visibleVars = _.filter(this.templating.list, variable => variable.hide !== 2); + if (visibleVars.length > 0) { return true; } - this.meta.submenuEnabled = visibleVars.length > 0 || this.annotations.list.length > 0 || this.links.length > 0; + var visibleAnnotations = _.filter(this.annotations.list, annotation => annotation.hide !== true); + if (visibleAnnotations.length > 0) { return true; } + + return false; + })(); } getPanelInfoById(panelId) { diff --git a/public/app/features/dashboard/specs/dashboard_model_specs.ts b/public/app/features/dashboard/specs/dashboard_model_specs.ts index c7d85b8a190..1c7415d342e 100644 --- a/public/app/features/dashboard/specs/dashboard_model_specs.ts +++ b/public/app/features/dashboard/specs/dashboard_model_specs.ts @@ -364,4 +364,85 @@ describe('DashboardModel', function() { }); }); + describe('updateSubmenuVisibility with empty lists', function() { + var model; + + beforeEach(function() { + model = new DashboardModel({}); + model.updateSubmenuVisibility(); + }); + + it('should not enable submmenu', function() { + expect(model.meta.submenuEnabled).to.be(false); + }); + }); + + describe('updateSubmenuVisibility with annotation', function() { + var model; + + beforeEach(function() { + model = new DashboardModel({ + annotations: { + list: [{}] + } + }); + model.updateSubmenuVisibility(); + }); + + it('should enable submmenu', function() { + expect(model.meta.submenuEnabled).to.be(true); + }); + }); + + describe('updateSubmenuVisibility with template var', function() { + var model; + + beforeEach(function() { + model = new DashboardModel({ + templating: { + list: [{}] + } + }); + model.updateSubmenuVisibility(); + }); + + it('should enable submmenu', function() { + expect(model.meta.submenuEnabled).to.be(true); + }); + }); + + describe('updateSubmenuVisibility with hidden template var', function() { + var model; + + beforeEach(function() { + model = new DashboardModel({ + templating: { + list: [{hide: 2}] + } + }); + model.updateSubmenuVisibility(); + }); + + it('should not enable submmenu', function() { + expect(model.meta.submenuEnabled).to.be(false); + }); + }); + + describe('updateSubmenuVisibility with hidden annotation toggle', function() { + var model; + + beforeEach(function() { + model = new DashboardModel({ + annotations: { + list: [{hide: true}] + } + }); + model.updateSubmenuVisibility(); + }); + + it('should not enable submmenu', function() { + expect(model.meta.submenuEnabled).to.be(false); + }); + }); + }); diff --git a/public/app/features/dashboard/submenu/submenu.html b/public/app/features/dashboard/submenu/submenu.html index 3e09fe4425e..367106f8a16 100644 --- a/public/app/features/dashboard/submenu/submenu.html +++ b/public/app/features/dashboard/submenu/submenu.html @@ -11,7 +11,7 @@
- diff --git a/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html b/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html index 1db00904c04..ad68312b727 100644 --- a/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html +++ b/public/app/plugins/datasource/elasticsearch/partials/annotations.editor.html @@ -3,9 +3,11 @@ Index name
-
- Search query (lucene) Use [[filterName]] in query to replace part of the query with a filter value - +
+
+ +
@@ -33,4 +35,4 @@
- \ No newline at end of file + diff --git a/public/app/plugins/datasource/grafana/partials/annotations.editor.html b/public/app/plugins/datasource/grafana/partials/annotations.editor.html index 54e21ac902e..a1528a6d708 100644 --- a/public/app/plugins/datasource/grafana/partials/annotations.editor.html +++ b/public/app/plugins/datasource/grafana/partials/annotations.editor.html @@ -1,6 +1,5 @@
-
Filters
Type diff --git a/public/app/plugins/datasource/graphite/partials/annotations.editor.html b/public/app/plugins/datasource/graphite/partials/annotations.editor.html index 421f7c3f3e5..9d228b8e4f9 100644 --- a/public/app/plugins/datasource/graphite/partials/annotations.editor.html +++ b/public/app/plugins/datasource/graphite/partials/annotations.editor.html @@ -1,10 +1,13 @@
- Graphite metrics query - + Graphite query +
+ +
Or
+
- Or Graphite events query - + Graphite events tags +
diff --git a/public/app/plugins/datasource/influxdb/partials/annotations.editor.html b/public/app/plugins/datasource/influxdb/partials/annotations.editor.html index a32044ca4ee..da8f4edf881 100644 --- a/public/app/plugins/datasource/influxdb/partials/annotations.editor.html +++ b/public/app/plugins/datasource/influxdb/partials/annotations.editor.html @@ -1,12 +1,11 @@ -
Query
-
Column mappings If your influxdb query returns more than one column you need to specify the column names below. An annotation event is composed of a title, tags, and an additional text field.
+
Field mappings If your influxdb query returns more than one field you need to specify the column names below. An annotation event is composed of a title, tags, and an additional text field.