graph(create annotation): push one annotation with time from and time to

public/app/features/annotations/annotations_srv.ts

@@ -133,10 +133,8 @@ export class AnnotationsSrv {
     return this.globalAnnotationsPromise;
   }
 
-  postAnnotation(annotations) {
-    return Promise.all(_.map(annotations, annotation => {
-      return this.backendSrv.post('/api/annotations', annotation);
-    }));
+  postAnnotation(annotation) {
+    return this.backendSrv.post('/api/annotations', annotation);
   }
 
   translateQueryResult(annotation, results) {

public/app/features/dashboard/addAnnotationModalCtrl.ts

@@ -10,6 +10,7 @@ export class AddAnnotationModalCtrl {
   annotationTitle: string;
   annotationTextFrom: string;
   annotationTextTo: string;
+  annotation: any;
   graphCtrl: any;
 
   /** @ngInject */
@@ -17,39 +18,30 @@ export class AddAnnotationModalCtrl {
     this.graphCtrl = $scope.ctrl;
     $scope.ctrl = this;
 
-    this.annotationTimeFrom = moment($scope.annotationTimeRange.from).format(this.annotationTimeFormat);
-    if ($scope.annotationTimeRange.to) {
-      this.annotationTimeTo = moment($scope.annotationTimeRange.to).format(this.annotationTimeFormat);
-    }
-  }
-
-  addAnnotation() {
     let dashboardId = this.graphCtrl.dashboard.id;
     let panelId = this.graphCtrl.panel.id;
-    let timeFrom = moment(this.annotationTimeFrom, this.annotationTimeFormat).valueOf();
-
-    let annotationFrom = {
+    this.annotation = {
       dashboardId: dashboardId,
       panelId: panelId,
-      time: timeFrom,
-      title: this.annotationTitle,
-      text: this.annotationTextFrom
+      time: null,
+      timeTo: null,
+      title: "",
+      text: ""
     };
-    let annotations = [annotationFrom];
 
-    if (this.annotationTimeTo) {
-      let timeTo = moment(this.annotationTimeTo, this.annotationTimeFormat).valueOf();
-      let annotationTo = {
-        dashboardId: dashboardId,
-        panelId: panelId,
-        time: timeTo,
-        title: this.annotationTitle,
-        text: this.annotationTextTo
-      };
-      annotations.push(annotationTo);
+    this.annotation.time = moment($scope.annotationTimeRange.from).format(this.annotationTimeFormat);
+    if ($scope.annotationTimeRange.to) {
+      this.annotation.timeTo = moment($scope.annotationTimeRange.to).format(this.annotationTimeFormat);
+    }
+  }
+
+  addAnnotation() {
+    this.annotation.time = moment(this.annotation.time, this.annotationTimeFormat).valueOf();
+    if (this.annotation.timeTo) {
+      this.annotation.timeTo = moment(this.annotation.timeTo, this.annotationTimeFormat).valueOf();
     }
 
-    this.graphCtrl.pushAnnotations(annotations)
+    this.graphCtrl.pushAnnotation(this.annotation)
     .then(response => {
       console.log(response);
       this.close();

public/app/features/dashboard/partials/addAnnotationModal.html

@@ -28,16 +28,16 @@
 
             <div class="gf-form">
               <span class="gf-form-label width-8">Title</span>
-              <input type="text" ng-model="ctrl.annotationTitle" class="gf-form-input max-width-20">
+              <input type="text" ng-model="ctrl.annotation.title" class="gf-form-input max-width-20">
             </div>
             <div class="gf-form">
-              <span class="gf-form-label width-8" ng-if="!ctrl.annotationTimeTo">Time</span>
-              <span class="gf-form-label width-8" ng-if="ctrl.annotationTimeTo">Time Start</span>
-              <input type="text" ng-model="ctrl.annotationTimeFrom" class="gf-form-input max-width-20">
+              <span class="gf-form-label width-8" ng-if="!ctrl.annotation.timeTo">Time</span>
+              <span class="gf-form-label width-8" ng-if="ctrl.annotation.timeTo">Time Start</span>
+              <input type="text" ng-model="ctrl.annotation.time" class="gf-form-input max-width-20">
             </div>
-            <div class="gf-form" ng-if="ctrl.annotationTimeTo">
+            <div class="gf-form" ng-if="ctrl.annotation.timeTo">
               <span class="gf-form-label width-8">Time Stop</span>
-              <input type="text" ng-model="ctrl.annotationTimeTo" class="gf-form-input max-width-20">
+              <input type="text" ng-model="ctrl.annotation.timeTo" class="gf-form-input max-width-20">
             </div>
           </div>
 
@@ -46,7 +46,7 @@
           </div>
           <div class="gf-form-group share-modal-options">
             <div class="gf-form">
-              <textarea rows="3" class="gf-form-input width-27" ng-model="ctrl.annotationTextFrom"></textarea>
+              <textarea rows="3" class="gf-form-input width-27" ng-model="ctrl.annotation.text"></textarea>
             </div>
           </div>
 

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

@@ -307,8 +307,8 @@ class GraphCtrl extends MetricsPanelCtrl {
   }
 
   // Get annotation info from dialog and push it to backend
-  pushAnnotations(annotations) {
-    return this.annotationsSrv.postAnnotation(annotations);
+  pushAnnotation(annotation) {
+    return this.annotationsSrv.postAnnotation(annotation);
   }
 
   showAddAnnotationModal(timeRange) {