From 3f05b4bb1ee359c83bf808e4f61ebbc690b6c16a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel.odegaard@gmail.com>
Date: Mon, 22 Feb 2016 14:54:19 +0100
Subject: [PATCH] fix(annotations): updated annotations query editor

---
 .../features/annotations/partials/editor.html | 20 ++++++++++---------
 .../graphite/partials/annotations.editor.html | 10 +++++-----
 .../plugins/datasource/influxdb/datasource.ts |  4 ++++
 public/sass/components/_dashboard.scss        |  5 -----
 public/sass/components/_drop.scss             |  4 ++--
 public/sass/components/_sidemenu.scss         |  1 +
 6 files changed, 23 insertions(+), 21 deletions(-)

diff --git a/public/app/features/annotations/partials/editor.html b/public/app/features/annotations/partials/editor.html
index 01171084bf5..0e026e51294 100644
--- a/public/app/features/annotations/partials/editor.html
+++ b/public/app/features/annotations/partials/editor.html
@@ -76,22 +76,24 @@
 						<select class="gf-form-input gf-size-auto" ng-model="currentAnnotation.datasource" ng-options="f.name as f.name for f in datasources" ng-change="datasourceChanged()"></select>
 					</div>
 				</div>
-				<div class="gf-form-inline last-row">
+				<div class="gf-form-inline">
 					<div class="gf-form gf-size-max-xl">
 						<span class="gf-form-label width-10">Icon size</span>
 						<select class="gf-form-input gf-size-md" ng-model="currentAnnotation.iconSize" ng-options="f for f in [7,8,9,10,13,15,17,20,25,30]"></select>
 					</div>
-					<div class="gf-form max-width-10">
-						<spectrum-picker ng-model="currentAnnotation.iconColor"></spectrum-picker>
-						<span class="checkbox-label">Icon color</span>
+					<div class="gf-form">
+						<label class="gf-form-label">
+							<span>Icon color</span>
+							<spectrum-picker ng-model="currentAnnotation.iconColor"></spectrum-picker>
+						</label>
 					</div>
-					<div class="gf-form max-width-10">
+					<div class="gf-form">
+						<label class="gf-form-label">
+							<span>Line color</span>
+							<spectrum-picker ng-model="currentAnnotation.lineColor"></spectrum-picker>
+						</label>
 						<editor-checkbox text="Grid line" model="currentAnnotation.showLine"></editor-checkbox>
 					</div>
-					<div class="gf-form max-width-10">
-						<spectrum-picker ng-model="currentAnnotation.lineColor"></spectrum-picker>
-						<span class="checkbox-label">Line color</span>
-					</div>
 				</div>
 			</div>
 
diff --git a/public/app/plugins/datasource/graphite/partials/annotations.editor.html b/public/app/plugins/datasource/graphite/partials/annotations.editor.html
index b7264b5e499..421f7c3f3e5 100644
--- a/public/app/plugins/datasource/graphite/partials/annotations.editor.html
+++ b/public/app/plugins/datasource/graphite/partials/annotations.editor.html
@@ -1,10 +1,10 @@
 <div class="gf-form-group">
   <div class="gf-form">
-    <span class="gf-form-label width-14">Graphite target expression</span>
-    <input type="text" class="gf-form-input max-width-20" ng-model='ctrl.annotation.target' placeholder=""></input>
+    <span class="gf-form-label width-13">Graphite metrics query</span>
+    <input type="text" class="gf-form-input" ng-model='ctrl.annotation.target' placeholder=""></input>
   </div>
   <div class="gf-form">
-    <span class="gf-form-label width-14">Graphite event tags</span>
-    <input type="text" class="gf-form-input max-width-20" ng-model='ctrl.annotation.tags' placeholder=""></input>
+    <span class="gf-form-label width-13">Or Graphite events query</span>
+    <input type="text" class="gf-form-input" ng-model='ctrl.annotation.tags' placeholder=""></input>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/public/app/plugins/datasource/influxdb/datasource.ts b/public/app/plugins/datasource/influxdb/datasource.ts
index 7ab8e3a254d..fec1dd71d6c 100644
--- a/public/app/plugins/datasource/influxdb/datasource.ts
+++ b/public/app/plugins/datasource/influxdb/datasource.ts
@@ -85,6 +85,10 @@ export function InfluxDatasource(instanceSettings, $q, backendSrv, templateSrv)
   };
 
   this.annotationQuery = function(options) {
+    if (!options.annotation.query) {
+      return $q.reject({message: 'Query missing in annotation definition'});
+    }
+
     var timeFilter = getTimeFilter({rangeRaw: options.rangeRaw});
     var query = options.annotation.query.replace('$timeFilter', timeFilter);
     query = templateSrv.replace(query);
diff --git a/public/sass/components/_dashboard.scss b/public/sass/components/_dashboard.scss
index 8b4b272d523..293ac202318 100644
--- a/public/sass/components/_dashboard.scss
+++ b/public/sass/components/_dashboard.scss
@@ -286,8 +286,3 @@ div.flot-text {
   }
 }
 
-.annotations-basic-settings {
-  .last-row {
-    margin-bottom: 20px;
-  }
-}
diff --git a/public/sass/components/_drop.scss b/public/sass/components/_drop.scss
index 5edaf2ee421..e6e507a72dc 100644
--- a/public/sass/components/_drop.scss
+++ b/public/sass/components/_drop.scss
@@ -15,8 +15,8 @@ $easing: cubic-bezier(0, 0, 0.265, 1.00);
     display: block;
   }
 
-  &.drop-open.drop-popover.drop-out-of-bounds,
-  &.drop-open-transitionend.drop-popover.drop-out-of-bounds {
+  &.drop-open.drop-help.drop-out-of-bounds,
+  &.drop-open-transitionend.drop-help.drop-out-of-bounds {
     display: none;
   }
 }
diff --git a/public/sass/components/_sidemenu.scss b/public/sass/components/_sidemenu.scss
index e84ae61caf9..9a0d12cf8c7 100644
--- a/public/sass/components/_sidemenu.scss
+++ b/public/sass/components/_sidemenu.scss
@@ -60,6 +60,7 @@
     position: relative;
     @include left-brand-border();
 
+    &.active,
     &:hover {
       background-color: $side-menu-item-hover-bg;
       @include left-brand-border-gradient();