feat(templating): changed how the All templating value works

public/app/features/templating/templateSrv.js

@@ -13,7 +13,7 @@ function (angular, _) {
     var self = this;
     var self = this;
 
 
     this._regex = /\$(\w+)|\[\[([\s\S]+?)\]\]/g;
     this._regex = /\$(\w+)|\[\[([\s\S]+?)\]\]/g;
-    this._values = {};
+    this._index = {};
     this._texts = {};
     this._texts = {};
     this._grafanaVariables = {};
     this._grafanaVariables = {};
 
 
@@ -23,14 +23,14 @@ function (angular, _) {
     };
     };
 
 
     this.updateTemplateData = function() {
     this.updateTemplateData = function() {
-      this._values = {};
+      this._index = {};
 
 
       for (var i = 0; i < this.variables.length; i++) {
       for (var i = 0; i < this.variables.length; i++) {
         var variable = this.variables[i];
         var variable = this.variables[i];
         if (!variable.current || !variable.current.isNone && !variable.current.value) {
         if (!variable.current || !variable.current.isNone && !variable.current.value) {
           continue;
           continue;
         }
         }
-        this._values[variable.name] = variable.current;
+        this._index[variable.name] = variable;
       }
       }
     };
     };
 
 
@@ -80,7 +80,7 @@ function (angular, _) {
     this.variableExists = function(expression) {
     this.variableExists = function(expression) {
       this._regex.lastIndex = 0;
       this._regex.lastIndex = 0;
       var match = this._regex.exec(expression);
       var match = this._regex.exec(expression);
-      return match && (self._values[match[1] || match[2]] !== void 0);
+      return match && (self._index[match[1] || match[2]] !== void 0);
     };
     };
 
 
     this.containsVariable = function(str, variableName) {
     this.containsVariable = function(str, variableName) {
@@ -96,17 +96,24 @@ function (angular, _) {
       str = _.escape(str);
       str = _.escape(str);
       this._regex.lastIndex = 0;
       this._regex.lastIndex = 0;
       return str.replace(this._regex, function(match, g1, g2) {
       return str.replace(this._regex, function(match, g1, g2) {
-        if (self._values[g1 || g2]) {
+        if (self._index[g1 || g2]) {
           return '<span class="template-variable">' + match + '</span>';
           return '<span class="template-variable">' + match + '</span>';
         }
         }
         return match;
         return match;
       });
       });
     };
     };
 
 
+    this.getAllValue = function(variable) {
+      if (variable.allValue) {
+        return variable.allValue;
+      }
+      return _.pluck(variable.options, 'value');
+    };
+
     this.replace = function(target, scopedVars, format) {
     this.replace = function(target, scopedVars, format) {
       if (!target) { return target; }
       if (!target) { return target; }
 
 
-      var value, systemValue;
+      var variable, systemValue, value;
       this._regex.lastIndex = 0;
       this._regex.lastIndex = 0;
 
 
       return target.replace(this._regex, function(match, g1, g2) {
       return target.replace(this._regex, function(match, g1, g2) {
@@ -117,25 +124,34 @@ function (angular, _) {
           }
           }
         }
         }
 
 
-        value = self._values[g1 || g2];
-        if (!value) {
+        variable = self._index[g1 || g2];
+        if (!variable) {
           return match;
           return match;
         }
         }
 
 
-        systemValue = self._grafanaVariables[value.value];
+        systemValue = self._grafanaVariables[variable.current.value];
         if (systemValue) {
         if (systemValue) {
           return self.formatValue(systemValue);
           return self.formatValue(systemValue);
         }
         }
 
 
-        var res = self.formatValue(value.value, format);
+        value = variable.current.value;
+        if (self.isAllValue(value)) {
+          value = self.getAllValue(variable);
+        }
+
+        var res = self.formatValue(value, format);
         return res;
         return res;
       });
       });
     };
     };
 
 
+    this.isAllValue = function(value) {
+      return value === '$__all' || Array.isArray(value) && value[0] === '$__all';
+    };
+
     this.replaceWithText = function(target, scopedVars) {
     this.replaceWithText = function(target, scopedVars) {
       if (!target) { return target; }
       if (!target) { return target; }
 
 
-      var value;
+      var variable;
       this._regex.lastIndex = 0;
       this._regex.lastIndex = 0;
 
 
       return target.replace(this._regex, function(match, g1, g2) {
       return target.replace(this._regex, function(match, g1, g2) {
@@ -144,10 +160,10 @@ function (angular, _) {
           if (option) { return option.text; }
           if (option) { return option.text; }
         }
         }
 
 
-        value = self._values[g1 || g2];
-        if (!value) { return match; }
+        variable = self._index[g1 || g2];
+        if (!variable) { return match; }
 
 
-        return self._grafanaVariables[value.value] || value.text;
+        return self._grafanaVariables[variable.current.value] || variable.current.text;
       });
       });
     };
     };
 
 

public/app/features/templating/templateValuesSrv.js

@@ -231,12 +231,11 @@ function (angular, _, kbn) {
 
 
     this.addAllOption = function(variable) {
     this.addAllOption = function(variable) {
       if (variable.allValue) {
       if (variable.allValue) {
-        variable.options.unshift({text: 'All', value: variable.allValue, isAll: true});
+        variable.options.unshift({text: 'All', value: variable.allValue});
         return;
         return;
       }
       }
 
 
-      var value =_.pluck(variable.options, 'text');
-      variable.options.unshift({text: 'All', value: value, isAll: true});
+      variable.options.unshift({text: 'All', value: "$__all"});
     };
     };
 
 
   });
   });

public/test/specs/templateSrv-specs.js

@@ -66,6 +66,41 @@ define([
       });
       });
     });
     });
 
 
+    describe('variable with all option', function() {
+      beforeEach(function() {
+        _templateSrv.init([{
+          name: 'test',
+          current: {value: '$__all' },
+          options: [
+            {value: 'value1'}, {value: 'value2'}
+          ]
+        }]);
+      });
+
+      it('should replace $test with formatted all value', function() {
+        var target = _templateSrv.replace('this.$test.filters', {}, 'glob');
+        expect(target).to.be('this.{value1,value2}.filters');
+      });
+    });
+
+    describe('variable with all option and custom value', function() {
+      beforeEach(function() {
+        _templateSrv.init([{
+          name: 'test',
+          current: {value: '$__all' },
+          allValue: '*',
+          options: [
+            {value: 'value1'}, {value: 'value2'}
+          ]
+        }]);
+      });
+
+      it('should replace $test with formatted all value', function() {
+        var target = _templateSrv.replace('this.$test.filters', {}, 'glob');
+        expect(target).to.be('this.*.filters');
+      });
+    });
+
     describe('lucene format', function() {
     describe('lucene format', function() {
       it('should properly escape $test with lucene escape sequences', function() {
       it('should properly escape $test with lucene escape sequences', function() {
         _templateSrv.init([{name: 'test', current: {value: 'value/4' }}]);
         _templateSrv.init([{name: 'test', current: {value: 'value/4' }}]);

public/test/specs/templateValuesSrv-specs.js

@@ -267,8 +267,7 @@ define([
 
 
       it('should add All option', function() {
       it('should add All option', function() {
         expect(scenario.variable.options[0].text).to.be('All');
         expect(scenario.variable.options[0].text).to.be('All');
-        expect(scenario.variable.options[0].value).to.eql(['backend1', 'backend2', 'backend3']);
-        expect(scenario.variable.options[0].isAll).to.be(true);
+        expect(scenario.variable.options[0].value).to.be('$__all');
       });
       });
     });
     });