Merge branch 'fix-query_editor_in_2.5' into develop

zabbix/datasource.js

@@ -1,12 +1,13 @@
 define([
   'angular',
   'lodash',
-  'kbn',
+  'app/core/utils/datemath',
+  './directives',
   './zabbixAPIWrapper',
   './helperFunctions',
   './queryCtrl'
 ],
-function (angular, _, kbn) {
+function (angular, _, dateMath) {
   'use strict';
 
   var module = angular.module('grafana.services');
@@ -93,9 +94,9 @@ function (angular, _, kbn) {
     ZabbixAPIDatasource.prototype.query = function(options) {
 
       // get from & to in seconds
-      var from = Math.ceil(kbn.parseDate(options.range.from).getTime() / 1000);
+      var from = Math.ceil(dateMath.parse(options.range.from) / 1000);
-      var to = Math.ceil(kbn.parseDate(options.range.to).getTime() / 1000);
+      var to = Math.ceil(dateMath.parse(options.range.to) / 1000);
-      var useTrendsFrom = Math.ceil(kbn.parseDate('now-' + this.trendsFrom).getTime() / 1000);
+      var useTrendsFrom = Math.ceil(dateMath.parse('now-' + this.trendsFrom) / 1000);
 
       // Create request for each target
       var promises = _.map(options.targets, function(target) {
@@ -336,8 +337,8 @@ function (angular, _, kbn) {
     /////////////////
 
     ZabbixAPIDatasource.prototype.annotationQuery = function(annotation, rangeUnparsed) {
-      var from = Math.ceil(kbn.parseDate(rangeUnparsed.from).getTime() / 1000);
+      var from = Math.ceil(dateMath.parse(rangeUnparsed.from) / 1000);
-      var to = Math.ceil(kbn.parseDate(rangeUnparsed.to).getTime() / 1000);
+      var to = Math.ceil(dateMath.parse(rangeUnparsed.to) / 1000);
       var self = this;
 
       var params = {

zabbix/directives.js

@@ -0,0 +1,17 @@
+define([
+    'angular'
+  ],
+  function (angular) {
+    'use strict';
+
+    var module = angular.module('grafana.directives');
+
+    module.directive('metricQueryEditorZabbix', function() {
+      return {controller: 'ZabbixAPIQueryCtrl', templateUrl: 'app/plugins/datasource/zabbix/partials/query.editor.html'};
+    });
+
+    module.directive('metricQueryOptionsZabbix', function() {
+      return {templateUrl: 'app/plugins/datasource/zabbix/partials/query.options.html'};
+    });
+
+  });

zabbix/partials/query.editor.html

@@ -1,13 +1,8 @@
-<div class="editor-row">
-
-  <div ng-repeat="target in panel.targets"
-       class="tight-form-container"
-       ng-class="{'tight-form-disabled': target.hide}"
-       ng-controller="ZabbixAPIQueryCtrl"
-       ng-init="init()">
-
 <div class="tight-form">
   <ul class="tight-form-list pull-right">
+    <li class="tight-form-item small" ng-show="target.datasource">
+      <em>{{target.datasource}}</em>
+    </li>
     <li class="tight-form-item">
       <div class="dropdown">
         <a class="pointer dropdown-toggle"
@@ -45,7 +40,7 @@
 
   <ul class="tight-form-list">
     <li class="tight-form-item" style="min-width: 15px; text-align: center">
-          {{targetLetters[$index]}}
+      {{target.refId}}
     </li>
     <li>
       <a class="tight-form-item"
@@ -230,89 +225,3 @@
   <div class="clearfix"></div>
 </div>
 
-  </div>
-</div>
-
-<section class="grafana-metric-options">
-  <div class="tight-form">
-    <ul class="tight-form-list">
-      <li class="tight-form-item tight-form-item-icon">
-        <i class="fa fa-wrench"></i>
-      </li>
-      <li class="tight-form-item">
-        Max data points
-      </li>
-      <li>
-        <input type="text"
-               class="input-mini tight-form-input"
-               ng-model="panel.maxDataPoints"
-               bs-tooltip="'Override max data points, automatically set to graph width in pixels.'"
-               data-placement="right"
-               ng-model-onblur ng-change="get_data()"
-               spellcheck='false'
-               placeholder="auto">
-      </li>
-    </ul>
-    <div class="clearfix"></div>
-  </div>
-  <div class="tight-form">
-    <ul class="tight-form-list">
-      <li class="tight-form-item tight-form-item-icon">
-        <i class="fa fa-info-circle"></i>
-      </li>
-      <li class="tight-form-item">
-        <a ng-click="toggleEditorHelp(1)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
-          Max data points
-        </a>
-      </li>
-      <li class="tight-form-item">
-        <a ng-click="toggleEditorHelp(2)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
-          IT services
-        </a>
-      </li>
-      <li class="tight-form-item">
-        <a ng-click="toggleEditorHelp(3)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
-          IT service property
-        </a>
-      </li>
-    </ul>
-    <div class="clearfix"></div>
-  </div>
-</section>
-
-<div class="editor-row">
-  <div class="pull-left" style="margin-top: 30px;">
-
-    <div class="grafana-info-box span6" ng-if="editorHelpIndex === 1">
-      <h5>Max data points</h5>
-      <ul>
-        <li>Grafana-Zabbix plugin uses maxDataPoints parameter to consolidate the real number of values down to this
-          number
-        </li>
-        <li>If there are more real values, then by default they will be consolidated using averages</li>
-        <li>This could hide real peaks and max values in your series</li>
-        <li>Point consolidation will effect series legend values (min,max,total,current)</li>
-        <li>If you override maxDataPoint and set a high value performance can be severely effected</li>
-      </ul>
-    </div>
-
-    <div class="grafana-info-box span6" ng-if="editorHelpIndex === 2">
-      <h5>IT services</h5>
-      <p>
-        Select "IT services" in targets menu to activate IT services mode.
-      </p>
-    </div>
-
-    <div class="grafana-info-box span6" ng-if="editorHelpIndex === 3">
-      <h5>IT service property</h5>
-      <ul>
-        <li>Zabbix returns the following availability information about IT service</li>
-        <li>Status - current status of the IT service</li>
-        <li>SLA - SLA for the given time interval</li>
-        <li>OK time - time the service was in OK state, in seconds</li>
-        <li>Problem time - time the service was in problem state, in seconds</li>
-        <li>Down time - time the service was in scheduled downtime, in seconds</li>
-      </ul>
-    </div>
-  </div>
-</div>

zabbix/partials/query.options.html

@@ -0,0 +1,83 @@
+<section class="grafana-metric-options">
+  <div class="tight-form">
+    <ul class="tight-form-list">
+      <li class="tight-form-item tight-form-item-icon">
+        <i class="fa fa-wrench"></i>
+      </li>
+      <li class="tight-form-item">
+        Max data points
+      </li>
+      <li>
+        <input type="text"
+               class="input-mini tight-form-input"
+               ng-model="panel.maxDataPoints"
+               bs-tooltip="'Override max data points, automatically set to graph width in pixels.'"
+               data-placement="right"
+               ng-model-onblur ng-change="get_data()"
+               spellcheck='false'
+               placeholder="auto">
+      </li>
+    </ul>
+    <div class="clearfix"></div>
+  </div>
+  <div class="tight-form">
+    <ul class="tight-form-list">
+      <li class="tight-form-item tight-form-item-icon">
+        <i class="fa fa-info-circle"></i>
+      </li>
+      <li class="tight-form-item">
+        <a ng-click="toggleEditorHelp(1)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
+          Max data points
+        </a>
+      </li>
+      <li class="tight-form-item">
+        <a ng-click="toggleEditorHelp(2)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
+          IT services
+        </a>
+      </li>
+      <li class="tight-form-item">
+        <a ng-click="toggleEditorHelp(3)" bs-tooltip="'click to show helpful info'" data-placement="bottom">
+          IT service property
+        </a>
+      </li>
+    </ul>
+    <div class="clearfix"></div>
+  </div>
+</section>
+
+<div class="editor-row">
+  <div class="pull-left" style="margin-top: 30px;">
+
+    <div class="grafana-info-box span6" ng-if="editorHelpIndex === 1">
+      <h5>Max data points</h5>
+      <ul>
+        <li>Grafana-Zabbix plugin uses maxDataPoints parameter to consolidate the real number of values down to this
+          number
+        </li>
+        <li>If there are more real values, then by default they will be consolidated using averages</li>
+        <li>This could hide real peaks and max values in your series</li>
+        <li>Point consolidation will effect series legend values (min,max,total,current)</li>
+        <li>If you override maxDataPoint and set a high value performance can be severely effected</li>
+      </ul>
+    </div>
+
+    <div class="grafana-info-box span6" ng-if="editorHelpIndex === 2">
+      <h5>IT services</h5>
+      <p>
+        Select "IT services" in targets menu to activate IT services mode.
+      </p>
+    </div>
+
+    <div class="grafana-info-box span6" ng-if="editorHelpIndex === 3">
+      <h5>IT service property</h5>
+      <ul>
+        <li>Zabbix returns the following availability information about IT service</li>
+        <li>Status - current status of the IT service</li>
+        <li>SLA - SLA for the given time interval</li>
+        <li>OK time - time the service was in OK state, in seconds</li>
+        <li>Problem time - time the service was in problem state, in seconds</li>
+        <li>Down time - time the service was in scheduled downtime, in seconds</li>
+      </ul>
+    </div>
+  </div>
+</div>

zabbix/plugin.json

@@ -5,12 +5,10 @@
   "type": "zabbix",
   "serviceName": "ZabbixAPIDatasource",
 
-  "module": "plugins/datasource/zabbix/datasource",
+  "module": "app/plugins/datasource/zabbix/datasource",
 
   "partials": {
-    "config": "app/plugins/datasource/zabbix/partials/config.html",
+    "config": "app/plugins/datasource/zabbix/partials/config.html"
-    "query": "app/plugins/datasource/zabbix/partials/query.editor.html",
-    "annotations": "app/plugins/datasource/zabbix/partials/annotations.editor.html"
   },
 
   "username": "guest",

zabbix/queryCtrl.js

@@ -266,6 +266,8 @@ define([
         return errs;
       }
 
+      $scope.init();
+
     });
 
   });