135 template var for server url (#2)

* check server url

* HASTIC_SERVER_URL variable usage

README.md

@@ -18,14 +18,17 @@ and restart your `$GRAFANA_PATH/bin/grafana-server` server.
 
 You should have [hastic-server](https://github.com/hastic/hastic-server) running to use anomaly detection.
 
-- set [template variable](http://docs.grafana.org/reference/templating/) `$backendUrl` with URL of your hastic-server instance (e.g. `http://localhost:8000`) in your dashboard
-- set metrics in `Metrics` tab
+- open new dasboard where you want to see Hastic panel
+- open Dashboard `Settings` (top right corner) and then `Varables` 
+- Add new `Constant` [variable](http://docs.grafana.org/reference/templating/#variable-types) with `name` equals to `$HASTIC_SERVER_URL` and `value` with URL of your hastic-server instance (e.g. `http://localhost:8000`) in your dashboard
+- Save settings and close Settings window
+- set one metrics in `Metrics` tab. Only one metric suported
 - go to `Analytics tab` and create new anomaly
 - label your data:
   - click button with chart icon
-  - highlight anomalies on graph holding Ctrl button
-  - when you finished labeling - click button with chart icon once more
-- you should see `Learning` status while hastic-server is learning (first learning can take a while)
+  - highlight anomalies on graph holding `Ctrl` button on Windows or `Cmd` on Mac
+  - when you finished labeling - click button with chart icon once more. `saving...` status should appear.
+- you should see `Learning` status while hastic-server is learning (first learning can take a while).
 - when `Learning` status dissapear - you should see anomalies labeled in your graph
 
 

src/module.ts

@@ -21,6 +21,8 @@ import config from 'grafana/app/core/config';
 
 import _ from 'lodash';
 
+const BACKEND_VARIABLE_NAME = "HASTIC_SERVER_URL";
+
 
 class GraphCtrl extends MetricsPanelCtrl {
   static template = template;
@@ -40,7 +42,6 @@ class GraphCtrl extends MetricsPanelCtrl {
   processor: DataProcessor;
 
   datasourceRequest: DatasourceRequest;
-  backendURL: string;
   analyticsTypes: Array<String> = ['Anomaly detection', 'Pattern Detection (not implemented yet)'];
   anomalyTypes = []; // TODO: remove it later. Only for alert tab
   anomalyController: AnomalyController;
@@ -132,14 +133,14 @@ class GraphCtrl extends MetricsPanelCtrl {
     thresholds: [],
     anomalyType: '',
     analyticsType: 'Anomaly detection',
-    backendURL: 'http://localhost:8000'
   };
 
   /** @ngInject */
   constructor(
     $scope, $injector, private annotationsSrv,
     private keybindingSrv, private backendSrv,
-    private popoverSrv, private contextSrv
+    private popoverSrv, private contextSrv,
+    private alertSrv
 ) {
     super($scope, $injector);
 
@@ -150,7 +151,11 @@ class GraphCtrl extends MetricsPanelCtrl {
 
     this.processor = new DataProcessor(this.panel);
 
-    var anomalyService = new AnomalyService(this.panel.backendURL, backendSrv as BackendSrv);
+    
+    var anomalyService = new AnomalyService(this.backendURL, backendSrv as BackendSrv);
+    
+    this.runBackendConnectivityCheck();
+
     this.anomalyController = new AnomalyController(this.panel, anomalyService, this.events);
     this.anomalyTypes = this.panel.anomalyTypes;
     keybindingSrv.bind('d', this.onDKey.bind(this));
@@ -189,6 +194,32 @@ class GraphCtrl extends MetricsPanelCtrl {
 
   }
 
+  get backendURL(): string {
+    if(this.templateSrv.index['HASTIC_SERVER_URL'] === undefined) {
+      return undefined;
+    }
+    return this.templateSrv.index['HASTIC_SERVER_URL'].current.value;
+  }
+
+  async runBackendConnectivityCheck() {
+    if(this.backendURL === '' || this.backendURL === undefined) {
+      this.alertSrv.set(
+        `Dashboard variable $${BACKEND_VARIABLE_NAME} is missing`, 
+        'Please set $${BACKEND_VARIABLE_NAME} ', 
+        'warning', 4000
+      );
+      return;
+    }
+
+    var as = new AnomalyService(this.backendURL, this.backendSrv);
+    var isOK = await as.isBackendOk();
+    if(!isOK) {
+      this.alertSrv.set(
+        'Can`t connect to Hastic server', `Hastic server: "${this.backendURL}"`, 'warning', 4000
+      );
+    } 
+  }
+
   link(scope, elem, attrs, ctrl) {
     var $graphElem = $(elem[0]).find('#graphPanel');
     var $legendElem = $(elem[0]).find('#graphLegend');

src/services/anomaly_service.ts

@@ -23,7 +23,16 @@ export class AnomalyService {
       }
     )
   };
-  
+
+  async isBackendOk(): Promise<boolean> {
+    try {
+      var data = await this._backendSrv.get(this._backendURL);
+      return true;
+    } catch(e) {
+      return false;
+    }
+  }
+   
   async updateSegments(
     key: AnomalyKey, addedSegments: SegmentsSet<Segment>, removedSegments: SegmentsSet<Segment>
   ): Promise<SegmentKey[]> {