small changes to PR #327, Partial support for url encoded metric names when using graphite datasource

CHANGELOG.md

@@ -8,6 +8,7 @@ vNext
 - 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.

src/app/directives/grafanaGraph.js

@@ -314,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>' + ' ' +
-                (decodeURIComponent(seriesInfo.alias) || seriesInfo.query)+
+                (decodeURIComponent(seriesInfo.alias)) +
               '</small><br>';
             } else {
               group = kbn.query_color_dot(item.series.color, 15) + ' ';

src/app/filters/all.js

@@ -118,6 +118,6 @@ define(['angular', 'jquery', 'underscore', 'moment'], function (angular, $, _, m
     return function(input) {
       return decodeURIComponent(input);
     };
- });
+  });
 
 });

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 | urlDecode }}
+        {{series.alias | urlDecode}}
       </a>
       <span ng-if="panel.legend.values">
         <span ng-show="panel.legend.current">

src/app/partials/graphite/editor.html

@@ -70,7 +70,7 @@
           </a>
           <ul class="dropdown-menu scrollable grafana-segment-dropdown-menu" role="menu">
             <li ng-repeat="altSegment in altSegments" role="menuitem">
-              <a href="javascript:void(0)" tabindex="1" ng-click="setSegment($index, $parent.$index)" ng-bind-html-unsafe="altSegment.html | urlDecode"></a>
+              <a href="javascript:void(0)" tabindex="1" ng-click="setSegment($index, $parent.$index)" ng-bind-html-unsafe="altSegment.html"></a>
             </li>
           </ul>
         </li>

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);

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
   }