fix(graphite): minor fix to graphite query editor so it does not issue render…

fix(graphite): minor fix to graphite query editor so it does not issue render requests for incomplete queries, fixes #3510

public/app/features/dashboard/partials/dashboardTopNav.html

@@ -37,6 +37,7 @@
 						<li ng-if="dashboardMeta.canEdit"><a class="pointer" ng-click="openEditView('templating');">Templating</a></li>
 						<li><a class="pointer" ng-click="exportDashboard();">Export</a></li>
 						<li><a class="pointer" ng-click="editJson();">View JSON</a></li>
+						<li ng-if="contextSrv.isEditor && !dashboard.editable"><a class="pointer" ng-click="makeEditable();">Make Editable</a></li>
 						<li ng-if="contextSrv.isEditor"><a class="pointer" ng-click="saveDashboardAs();">Save As...</a></li>
 						<li ng-if="dashboardMeta.canSave"><a class="pointer" ng-click="deleteDashboard();">Delete dashboard</a></li>
 					</ul>

public/app/features/panel/panel_helper.js

@@ -11,7 +11,7 @@ function (angular, _, $, kbn, dateMath, rangeUtil) {
 
   var module = angular.module('grafana.services');
 
-  module.service('panelHelper', function(timeSrv, $rootScope) {
+  module.service('panelHelper', function(timeSrv, $rootScope, $q) {
     var self = this;
 
     this.setTimeQueryStart = function(scope) {
@@ -103,6 +103,10 @@ function (angular, _, $, kbn, dateMath, rangeUtil) {
     };
 
     this.issueMetricQuery = function(scope, datasource) {
+      if (!scope.panel.targets || scope.panel.targets.length === 0) {
+        return $q.when([]);
+      }
+
       var metricsQuery = {
         range: scope.range,
         rangeRaw: scope.rangeRaw,

public/app/plugins/datasource/graphite/datasource.js

@@ -37,6 +37,9 @@ function (angular, _, $, config, dateMath) {
         };
 
         var params = this.buildGraphiteParams(graphOptions, options.scopedVars);
+        if (params.length === 0) {
+          return $q.when([]);
+        }
 
         if (options.format === 'png') {
           return $q.when(this.url + '/render' + '?' + params.join('&'));
@@ -235,6 +238,7 @@ function (angular, _, $, config, dateMath) {
       var target, targetValue, i;
       var regex = /\#([A-Z])/g;
       var intervalFormatFixRegex = /'(\d+)m'/gi;
+      var hasTargets = false;
 
       if (options.format !== 'png') {
         options['format'] = 'json';
@@ -274,6 +278,7 @@ function (angular, _, $, config, dateMath) {
         targets[target.refId] = targetValue;
 
         if (!target.hide) {
+          hasTargets = true;
           clean_options.push("target=" + encodeURIComponent(targetValue));
         }
       }
@@ -285,6 +290,10 @@ function (angular, _, $, config, dateMath) {
         }
       });
 
+      if (!hasTargets) {
+        return [];
+      }
+
       return clean_options;
     };
 

public/app/plugins/datasource/graphite/query_ctrl.js

@@ -132,9 +132,7 @@ function (angular, _, config, gfunc, Parser) {
               $scope.segments = $scope.segments.splice(0, fromIndex);
               $scope.segments.push(uiSegmentSrv.newSelectMetric());
             }
-            return;
-          }
-          if (segments[0].expandable) {
+          } else if (segments[0].expandable) {
             if ($scope.segments.length === fromIndex) {
               $scope.segments.push(uiSegmentSrv.newSelectMetric());
             }
@@ -162,29 +160,29 @@ function (angular, _, config, gfunc, Parser) {
       var query = index === 0 ?  '*' : getSegmentPathUpTo(index) + '.*';
 
       return $scope.datasource.metricFindQuery(query).then(function(segments) {
-          var altSegments = _.map(segments, function(segment) {
-            return uiSegmentSrv.newSegment({ value: segment.text, expandable: segment.expandable });
-          });
-
-          if (altSegments.length === 0) { return altSegments; }
-
-          // add template variables
-          _.each(templateSrv.variables, function(variable) {
-            altSegments.unshift(uiSegmentSrv.newSegment({
-              type: 'template',
-              value: '$' + variable.name,
-              expandable: true,
-            }));
-          });
-
-          // add wildcard option
-          altSegments.unshift(uiSegmentSrv.newSegment('*'));
-          return altSegments;
-        })
-        .then(null, function(err) {
-          $scope.parserError = err.message || 'Failed to issue metric query';
-          return [];
+        var altSegments = _.map(segments, function(segment) {
+          return uiSegmentSrv.newSegment({ value: segment.text, expandable: segment.expandable });
+        });
+
+        if (altSegments.length === 0) { return altSegments; }
+
+        // add template variables
+        _.each(templateSrv.variables, function(variable) {
+          altSegments.unshift(uiSegmentSrv.newSegment({
+            type: 'template',
+            value: '$' + variable.name,
+            expandable: true,
+          }));
         });
+
+        // add wildcard option
+        altSegments.unshift(uiSegmentSrv.newSegment('*'));
+        return altSegments;
+      })
+      .then(null, function(err) {
+        $scope.parserError = err.message || 'Failed to issue metric query';
+        return [];
+      });
     };
 
     $scope.segmentValueChanged = function (segment, segmentIndex) {
@@ -195,11 +193,10 @@ function (angular, _, config, gfunc, Parser) {
       }
 
       if (segment.expandable) {
-        return checkOtherSegments(segmentIndex + 1)
-          .then(function () {
-            setSegmentFocus(segmentIndex + 1);
-            $scope.targetChanged();
-          });
+        return checkOtherSegments(segmentIndex + 1).then(function() {
+          setSegmentFocus(segmentIndex + 1);
+          $scope.targetChanged();
+        });
       }
       else {
         $scope.segments = $scope.segments.splice(0, segmentIndex + 1);
@@ -220,12 +217,13 @@ function (angular, _, config, gfunc, Parser) {
       }
 
       var oldTarget = $scope.target.target;
-
       var target = getSegmentPathUpTo($scope.segments.length);
       $scope.target.target = _.reduce($scope.functions, wrapFunction, target);
 
       if ($scope.target.target !== oldTarget) {
-        $scope.$parent.get_data();
+        if ($scope.segments[$scope.segments.length - 1].value !== 'select metric') {
+          $scope.$parent.get_data();
+        }
       }
     };
 
@@ -254,8 +252,8 @@ function (angular, _, config, gfunc, Parser) {
     $scope.moveAliasFuncLast = function() {
       var aliasFunc = _.find($scope.functions, function(func) {
         return func.def.name === 'alias' ||
-               func.def.name === 'aliasByNode' ||
-               func.def.name === 'aliasByMetric';
+          func.def.name === 'aliasByNode' ||
+          func.def.name === 'aliasByMetric';
       });
 
       if (aliasFunc) {

public/app/plugins/datasource/graphite/specs/datasource_specs.ts

@@ -66,6 +66,12 @@ describe('graphiteDatasource', function() {
   });
 
   describe('building graphite params', function() {
+    it('should return empty array if no targets', function() {
+      var results = ctx.ds.buildGraphiteParams({
+        targets: [{}]
+      });
+      expect(results.length).to.be(0);
+    });
 
     it('should uri escape targets', function() {
       var results = ctx.ds.buildGraphiteParams({