Merge branch 'master' into mavimo-feature/influxdb-filters

14090650 · Torkel Ödegaard · 5bed5b98 · 623019ee · 14090650 · 14090650
Commit 14090650 authored Jun 06, 2014 by Torkel Ödegaard
15 changed files
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,10 +3,12 @@ vNext
 - Allow special characters in serie names (influxdb datasource), PR #390 - thx  @majst01
 - Refactoring of filterSrv (Issue #428), thx @Tetha
 - New config for playlist feature. Set playlist_timespan to set default playlist interval (Issue #445) - thx @rmca
+- New graphite function definition added isNonNull (PR #461), - thx @tmonk42
 - New InfluxDB function difference add to function dropdown (PR #455)
 - Added parameter to keepLastValue graphite function definition (default 100), Closes #459
 - improved asset (css/js) build pipeline, added revision to css and js. Will remove issues related
  to the browser cache when upgrading grafana and improve load performance (Fixes #418)
+- Partial support for url encoded metrics when using Graphite datasource (PR #327) - thx @axe-felix
 # Fixes
 - Filter option loading when having muliple nested filters now works better.
@@ -14,6 +16,8 @@ vNext
  After an option is changed and a nested template param is also reloaded, if the current value
  exists after the options are reloaded the current selected value is kept (Closes #447, Closes #412)
 - Legend Current value did not display when value was zero, Fixes #460
+- Fix to series toggling bug that caused annotations to be hidden when toggling (hiding) series. Fixes #328
+- Fix for graphite function selection menu that some times draws outside screen. It now displays upward (Fixes #293)
 # 1.5.4 (2014-05-13)
 ### New features and improvements

--- a/src/app/directives/addGraphiteFunc.js
+++ b/src/app/directives/addGraphiteFunc.js
@@ -18,7 +18,7 @@ function (angular, app, _, $, gfunc) {
      var buttonTemplate = '<a  class="grafana-target-segment grafana-target-function dropdown-toggle"' +
                              ' tabindex="1" gf-dropdown="functionMenu" data-toggle="dropdown"' +
-                              ' data-placement="bottom"><i class="icon-plus"></i></a>';
+                              ' data-placement="top"><i class="icon-plus"></i></a>';
      return {
        link: function($scope, elem) {

--- a/src/app/directives/bootstrap-tagsinput.js
+++ b/src/app/directives/bootstrap-tagsinput.js
@@ -87,13 +87,12 @@ function (angular, $) {
    .module('kibana.directives')
    .directive('gfDropdown', function ($parse, $compile, $timeout) {
-      function buildTemplate(items, ul) {
+      function buildTemplate(items, placement) {
-        if (!ul) {
+        var upclass = placement === 'top' ? 'dropup' : '';
-          ul = [
+        var ul = [
-            '<ul class="dropdown-menu" role="menu" aria-labelledby="drop1">',
+          '<ul class="dropdown-menu ' + upclass + '" role="menu" aria-labelledby="drop1">',
          '</ul>'
        ];
-        }
        angular.forEach(items, function (item, index) {
          if (item.divider) {
@@ -122,10 +121,12 @@ function (angular, $) {
        link: function postLink(scope, iElement, iAttrs) {
          var getter = $parse(iAttrs.gfDropdown), items = getter(scope);
          $timeout(function () {
-            var dropdown = angular.element(buildTemplate(items).join(''));
+            var placement = iElement.data('placement');
+            var dropdown = angular.element(buildTemplate(items, placement).join(''));
            dropdown.insertAfter(iElement);
            $compile(iElement.next('ul.dropdown-menu'))(scope);
          });
          iElement.addClass('dropdown-toggle').attr('data-toggle', 'dropdown');
        }
      };

--- a/src/app/directives/grafanaGraph.js
+++ b/src/app/directives/grafanaGraph.js
@@ -15,7 +15,7 @@ function (angular, $, kbn, moment, _) {
      restrict: 'A',
      template: '<div> </div>',
      link: function(scope, elem) {
-        var data, plot;
+        var data, plot, annotations;
        var hiddenData = {};
        scope.$on('refresh',function() {
@@ -35,8 +35,9 @@ function (angular, $, kbn, moment, _) {
        });
        // Receive render events
-        scope.$on('render',function(event, d) {
+        scope.$on('render',function(event, renderData) {
-          data = d || data;
+          data = renderData || data;
+          annotations = data.annotations;
          render_panel();
        });
@@ -206,13 +207,13 @@ function (angular, $, kbn, moment, _) {
        }
        function addAnnotations(options) {
-          if(!data.annotations || data.annotations.length === 0) {
+          if(!annotations || annotations.length === 0) {
            return;
          }
          var types = {};
-          _.each(data.annotations, function(event) {
+          _.each(annotations, function(event) {
            if (!types[event.annotation.name]) {
              types[event.annotation.name] = {
                level: _.keys(types).length + 1,
@@ -235,7 +236,7 @@ function (angular, $, kbn, moment, _) {
          options.events = {
            levels: _.keys(types).length + 1,
-            data: data.annotations,
+            data: annotations,
            types: types
          };
        }
@@ -313,7 +314,7 @@ function (angular, $, kbn, moment, _) {
            if (seriesInfo.alias) {
              group = '<small style="font-size:0.9em;">' +
                '<i class="icon-circle" style="color:'+item.series.color+';"></i>' + ' ' +
-                (seriesInfo.alias || seriesInfo.query)+
+                (decodeURIComponent(seriesInfo.alias)) +
              '</small><br>';
            } else {
              group = kbn.query_color_dot(item.series.color, 15) + ' ';

--- a/src/app/filters/all.js
+++ b/src/app/filters/all.js
@@ -114,4 +114,10 @@ define(['angular', 'jquery', 'underscore', 'moment'], function (angular, $, _, m
    };
  });
+  module.filter('urlDecode', function() {
+    return function(input) {
+      return decodeURIComponent(input);
+    };
+  });
 });
\ No newline at end of file
--- a/src/app/panels/filtering/module.html
+++ b/src/app/panels/filtering/module.html
@@ -17,7 +17,7 @@
            </a>
              <ul class="dropdown-menu">
                <li ng-repeat="option in filter.options">
-                  <a ng-click="filterOptionSelected(filter, option)">{{option.text}}</a>
+                  <a ng-click="filterOptionSelected(filter, option)">{{option.text | urlDecode}}</a>
                </li>
              </ul>
          </li>

--- a/src/app/panels/graphite/legend.html
+++ b/src/app/panels/graphite/legend.html
@@ -9,7 +9,7 @@
    </i>
    <span class='small histogram-legend-item'>
      <a ng-click="toggleSeries(series, $event)" data-unique="1" data-placement="{{series.yaxis === 2 ? 'bottomRight' : 'bottomLeft'}}">
-        {{series.alias}}
+        {{series.alias | urlDecode}}
      </a>
      <span ng-if="panel.legend.values">
        <span ng-show="panel.legend.current">

--- a/src/app/partials/graphite/editor.html
+++ b/src/app/partials/graphite/editor.html
--- a/src/app/services/graphite/gfunc.js
+++ b/src/app/services/graphite/gfunc.js
@@ -70,6 +70,11 @@ function (_) {
  });
  addFuncDef({
+    name: 'isNonNull',
+    category: categories.Combine,
+  });
+  addFuncDef({
    name: 'rangeOfSeries',
    category: categories.Combine
  });

--- a/src/app/services/graphite/graphiteDatasource.js
+++ b/src/app/services/graphite/graphiteDatasource.js
@@ -118,7 +118,7 @@ function (angular, _, $, config, kbn, moment) {
    GraphiteDatasource.prototype.metricFindQuery = function(filterSrv, query) {
      var interpolated;
      try {
-        interpolated = filterSrv.applyTemplateToTarget(query);
+        interpolated = encodeURIComponent(filterSrv.applyTemplateToTarget(query));
      }
      catch(err) {
        return $q.reject(err);

--- a/src/app/services/graphite/lexer.js
+++ b/src/app/services/graphite/lexer.js
@@ -124,6 +124,7 @@ define([
      i === 45 ||           // -
      i === 42 ||           // *
      i === 58 ||           // :
+      i === 37 ||           // %
      i >= 97 && i <= 122;  // a-z
  }

--- a/src/css/bootstrap.dark.min.css
+++ b/src/css/bootstrap.dark.min.css
--- a/src/css/bootstrap.light.min.css
+++ b/src/css/bootstrap.light.min.css
--- a/src/css/default.min.css
+++ b/src/css/default.min.css
--- a/src/css/less/grafana.less
+++ b/src/css/less/grafana.less
@@ -271,7 +271,7 @@
 }
 .grafana-target-segment {
-  padding: 5px 7px;
+  padding: 8px 7px;
  display: inline-block;
  font-weight: normal;
  border-right: 1px solid @grafanaTargetSegmentBorder;
@@ -337,10 +337,11 @@ input[type=text].grafana-function-param-input {
  }
  a {
-    padding: 5px 7px;
+    padding: 8px 7px;
    position: relative;
-    top: 5px;
+    top: 8px;
    color: @grafanaTargetColor;
+    font-size: 16px;
    .grafana-target-hidden & {
      color: @grafanaTargetColorHide;
@@ -353,7 +354,7 @@ input[type=text].grafana-function-param-input {
 }
 input[type=text].grafana-target-text-input {
-  padding: 5px 7px;
+  padding: 8px 7px;
  border: none;
  margin: 0px;
  background: transparent;
@@ -367,8 +368,7 @@ input[type=text].grafana-target-segment-input {
  border-right: 1px solid @grafanaTargetSegmentBorder;
  margin: 0px;
  border-radius: 0;
-  height: 22px;
+  padding: 8px 4px;
-  line-height: 22px;
 }
 select.grafana-target-segment-input {
@@ -376,8 +376,8 @@ select.grafana-target-segment-input {
  border-right: 1px solid @grafanaTargetSegmentBorder;
  margin: 0px;
  border-radius: 0;
-  height: 30px;
+  height: 36px;
-  line-height: 30px;
+  padding: 8px 5px;
 }
 .grafana-target .dropdown {