More work on tags in variable dropdown, now the actual tag values query is…

More work on tags in variable dropdown, now the actual tag values query is hooked up and works, #2080

public/app/directives/variableValueSelect.js

@@ -13,7 +13,7 @@ function (angular, app, _) {
       var vm = this;
 
       vm.show = function() {
-        vm.oldCurrentText = vm.variable.current.text;
+        vm.oldLinkText = vm.variable.current.text;
         vm.highlightIndex = -1;
 
         var currentValues = vm.variable.current.value;
@@ -44,6 +44,9 @@ function (angular, app, _) {
 
       vm.updateLinkText = function() {
         vm.linkText = vm.variable.current.text;
+        if (vm.oldLinkText && vm.oldLinkText !== vm.linkText) {
+          vm.onUpdated();
+        }
       };
 
       vm.clearSelections = function() {

public/app/features/dashboard/submenuCtrl.js

@@ -18,9 +18,7 @@ function (angular, _) {
       $scope.panel = $scope.pulldown;
       $scope.row = $scope.pulldown;
       $scope.annotations = $scope.dashboard.templating.list;
-      $scope.variables = _.map($scope.dashboard.templating.list, function(variable) {
-        return variable;
-      });
+      $scope.variables = $scope.dashboard.templating.list;
     };
 
     $scope.disableAnnotation = function (annotation) {
@@ -28,8 +26,8 @@ function (angular, _) {
       $rootScope.$broadcast('refresh');
     };
 
-    $scope.getValuesForTag = function() {
-      return $q.when(['backend_01', 'backend_02']);
+    $scope.getValuesForTag = function(variable, tagKey) {
+      return templateValuesSrv.getValuesForTag(variable, tagKey);
     };
 
     $scope.variableUpdated = function(variable) {

public/app/features/templating/partials/editor.html

@@ -228,25 +228,25 @@
 
 			<div class="editor-row" ng-if="current.type === 'query'">
 				<div class="tight-form-section">
-					<h5>value groups/tags</h5>
-					<div class="tight-form" ng-if="current.usetags">
+					<h5>Value groups/tags</h5>
+					<div class="tight-form" ng-if="current.useTags">
 						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 115px">
-								tags query
+							<li class="tight-form-item" style="width: 135px">
+								Tags query
 							</li>
 							<li>
-								<input type="text" style="width: 588px" class="input-xxlarge tight-form-input last" ng-model='current.tagsquery' placeholder="metric name or tags query" ng-model-onblur ng-change="runquery()"></input>
+								<input type="text" style="width: 588px" class="input-xxlarge tight-form-input last" ng-model='current.tagsQuery' placeholder="metric name or tags query" ng-model-onblur></input>
 							</li>
 						</ul>
 						<div class="clearfix"></div>
 					</div>
-					<div class="tight-form" ng-if="current.usetags">
+					<div class="tight-form" ng-if="current.useTags">
 						<ul class="tight-form-list">
-							<li class="tight-form-item" style="width: 115px;">
-								tags values query
+							<li class="tight-form-item" style="width: 135px;">
+								Tag values query
 							</li>
 							<li>
-								<input type="text" style="width: 588px" class="input tight-form-input last" ng-model='current.tagvaluesquery' placeholder="apps.$__tag.*" ng-model-onblur ng-change="runquery()"></input>
+								<input type="text" style="width: 588px" class="input tight-form-input last" ng-model='current.tagValuesQuery' placeholder="apps.$__tag.*" ng-model-onblur></input>
 							</li>
 						</ul>
 						<div class="clearfix"></div>
@@ -254,7 +254,7 @@
 					<div class="tight-form">
 						<ul class="tight-form-list">
 							<li class="tight-form-item last">
-								<editor-checkbox text="enable" model="current.usetags" change="runquery()"></editor-checkbox>
+								<editor-checkbox text="Enable" model="current.useTags" change="runQuery()"></editor-checkbox>
 							</li>
 						</ul>
 						<div class="clearfix"></div>

public/app/features/templating/templateValuesSrv.js

@@ -154,6 +154,17 @@ function (angular, _, kbn) {
       });
     };
 
+    this.getValuesForTag = function(variable, tagKey) {
+      return datasourceSrv.get(variable.datasource).then(function(datasource) {
+        var query = variable.tagValuesQuery.replace('$tag', tagKey);
+        return datasource.metricFindQuery(query).then(function (results) {
+          return _.map(results, function(value) {
+            return value.text;
+          });
+        });
+      });
+    };
+
     this.metricNamesToVariableValues = function(variable, metricNames) {
       var regex, options, i, matches;
       options = {}; // use object hash to remove duplicates

public/app/partials/submenu.html

@@ -6,7 +6,7 @@
 				<span class="template-variable tight-form-item" ng-show="!variable.hideLabel" style="padding-right: 5px">
 					{{variable.label || variable.name}}:
 				</span>
-				<variable-value-select variable="variable" on-updated="variableUpdated(variable)" get-values-for-tag="getValuesForTag(tagKey)"></variable-value-select>
+				<variable-value-select variable="variable" on-updated="variableUpdated(variable)" get-values-for-tag="getValuesForTag(variable, tagKey)"></variable-value-select>
 			</li>
 		</ul>