more work on annotations

public/app/core/services/popover_srv.ts

@@ -19,6 +19,7 @@ function popoverSrv($compile, $rootScope, $timeout) {
   this.show = function(options) {
     if (openDrop) {
       openDrop.close();
+      openDrop = null;
     }
 
     var scope = _.extend($rootScope.$new(true), options.model);
@@ -27,12 +28,17 @@ function popoverSrv($compile, $rootScope, $timeout) {
     var cleanUp = () => {
       setTimeout(() => {
         scope.$destroy();
-        drop.destroy();
+
+        if (drop.tether) {
+          drop.destroy();
+        }
 
         if (options.onClose) {
           options.onClose();
         }
       });
+
+      openDrop = null;
     };
 
     scope.dismiss = () => {
@@ -44,24 +50,26 @@ function popoverSrv($compile, $rootScope, $timeout) {
 
     $compile(contentElement)(scope);
 
-    drop = new Drop({
-      target: options.element,
-      content: contentElement,
-      position: options.position,
-      classes: options.classNames || 'drop-popover',
-      openOn: options.openOn,
-      hoverCloseDelay: 200,
-      tetherOptions: {
-        constraints: [{to: 'scrollParent', attachment: "none both"}]
-      }
-    });
+    $timeout(() => {
+      drop = new Drop({
+        target: options.element,
+        content: contentElement,
+        position: options.position,
+        classes: options.classNames || 'drop-popover',
+        openOn: options.openOn,
+        hoverCloseDelay: 200,
+        tetherOptions: {
+          constraints: [{to: 'scrollParent', attachment: "none both"}]
+        }
+      });
 
-    drop.on('close', () => {
-      cleanUp();
-    });
+      drop.on('close', () => {
+        cleanUp();
+      });
 
-    openDrop = drop;
-    $timeout(() => { drop.open(); }, 10);
+      openDrop = drop;
+      openDrop.open();
+    }, 10);
   };
 }
 

public/app/features/annotations/annotations_srv.ts

@@ -135,6 +135,7 @@ export class AnnotationsSrv {
   }
 
   saveAnnotationEvent(annotation) {
+    this.globalAnnotationsPromise = null;
     return this.backendSrv.post('/api/annotations', annotation);
   }
 

public/app/features/annotations/event_editor.ts

@@ -2,7 +2,7 @@
 
 import _ from 'lodash';
 import moment from 'moment';
-import coreModule from 'app/core/core_module';
+import {coreModule} from 'app/core/core';
 import {MetricsPanelCtrl} from 'app/plugins/sdk';
 
 export class AnnotationEvent {
@@ -20,13 +20,13 @@ export class EventEditorCtrl {
   annotation: AnnotationEvent;
   timeRange: {from: number, to: number};
   form: any;
+  close: any;
 
   /** @ngInject **/
   constructor(private annotationsSrv) {
     this.annotation = new AnnotationEvent();
     this.annotation.panelId = this.panelCtrl.panel.id;
     this.annotation.dashboardId = this.panelCtrl.dashboard.id;
-    this.annotation.text = "hello";
 
     this.annotation.time = moment(this.timeRange.from);
     if (this.timeRange.to) {
@@ -51,7 +51,10 @@ export class EventEditorCtrl {
       return;
     }
 
-    this.annotationsSrv.saveAnnotationEvent(saveModel);
+    this.annotationsSrv.saveAnnotationEvent(saveModel).then(() => {
+      this.panelCtrl.refresh();
+      this.close();
+    });
   }
 }
 
@@ -65,7 +68,7 @@ export function eventEditor() {
     scope: {
       "panelCtrl": "=",
       "timeRange": "=",
-      "cancel": "&",
+      "close": "&",
     }
   };
 }

public/app/features/annotations/partials/event_editor.html

@@ -32,7 +32,7 @@
 
     <div class="gf-form-button-row">
       <button type="submit" class="btn gf-form-btn btn-success" ng-click="ctrl.save()">Save</button>
-			<a class="btn-text" ng-click="ctrl.cancel();">Cancel</a>
+			<a class="btn-text" ng-click="ctrl.close();">Cancel</a>
     </div>
   </div>
 </form>

public/app/features/dashboard/all.js

@@ -7,7 +7,6 @@ define([
   './saveDashboardAsCtrl',
   './shareModalCtrl',
   './shareSnapshotCtrl',
-  './addAnnotationModalCtrl',
   './dashboard_srv',
   './viewStateSrv',
   './time_srv',

public/app/plugins/panel/graph/graph.ts

@@ -84,8 +84,8 @@ coreModule.directive('grafanaGraph', function($rootScope, timeSrv, popoverSrv) {
           element: elem[0],
           classNames: 'drop-popover drop-popover--form',
           position: 'bottom center',
-          openOn: null,
-          template: '<event-editor panel-ctrl="panelCtrl" time-range="timeRange" cancel="dismiss()"></event-editor>',
+          openOn: 'click',
+          template: '<event-editor panel-ctrl="panelCtrl" time-range="timeRange" close="dismiss()"></event-editor>',
           model: {
             timeRange: timeRange,
             panelCtrl: ctrl,