added grid min max support for png renderer (url property mappings that is), #22

src/app/directives/grafanaGraph.js

@@ -174,6 +174,9 @@ function (angular, $, kbn, moment, _) {
           url += scope.panel.stack ? '&areaMode=stacked' : '';
           url += scope.panel.fill !== 0 ? ('&areaAlpha=' + (scope.panel.fill/10).toFixed(1)) : '';
           url += scope.panel.linewidth !== 0 ? '&lineWidth=' + scope.panel.linewidth : '';
+          url += scope.panel.legend ? '' : '&hideLegend=true';
+          url += scope.panel.grid.min ? '&yMin=' + scope.panel.grid.min : '';
+          url += scope.panel.grid.max ? '&yMax=' + scope.panel.grid.max : '';
 
           switch(scope.panel.nullPointMode) {
           case 'connected':

src/app/panels/graphite/axisEditor.html

@@ -40,19 +40,19 @@
   <div class="section">
     <h5>Grid</h5>
     <div class="editor-option">
-      <label class="small">Min / <a href='' ng-click="panel.grid.min = _.toggle(panel.grid.min,null,0)">Auto <i class="icon-star" ng-show="_.isNull(panel.grid.min)"></i></a></label>
-      <input type="number" class="input-small" ng-model="panel.grid.min"/>
+      <label class="small">Min / <a ng-click="toggleGridMinMax('min')">Auto <i class="icon-star" ng-show="_.isNull(panel.grid.min)"></i></a></label>
+      <input type="number" class="input-small" ng-model="panel.grid.min" ng-change="render()" ng-model-onblur />
     </div>
     <div class="editor-option">
-      <label class="small">Max / <a ref='' ng-click="panel.grid.max = _.toggle(panel.grid.max,null,0)">Auto <i class="icon-star" ng-show="_.isNull(panel.grid.max)"></i></a></label>
-      <input type="number" class="input-small" ng-model="panel.grid.max"/>
+      <label class="small">Max / <a ng-click="toggleGridMinMax('max')">Auto <i class="icon-star" ng-show="_.isNull(panel.grid.max)"></i></a></label>
+      <input type="number" class="input-small" ng-model="panel.grid.max" ng-change="render()" ng-model-onblur />
     </div>
   </div>
 
   <div class="section">
     <h5>Legend</h5>
     <div class="editor-option">
-      <label class="small">Legend</label><input type="checkbox" ng-model="panel.legend" ng-checked="panel.legend">
+      <label class="small">Legend</label><input type="checkbox" ng-model="panel.legend" ng-checked="panel.legend" ng-change="render();">
     </div>
   </div>
 

src/app/panels/graphite/module.js

@@ -46,11 +46,11 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
           src:'app/panels/graphite/editor.html'
         },
         {
-          title:'Axis & Legends',
+          title:'Axes & Grid',
           src:'app/panels/graphite/axisEditor.html'
         },
         {
-          title:'Style',
+          title:'Display Styles',
           src:'app/panels/graphite/styleEditor.html'
         }
       ],
@@ -465,6 +465,11 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
       $scope.render();
     };
 
+    $scope.toggleGridMinMax = function(key) {
+      $scope.panel.grid[key] = _.toggle($scope.panel.grid[key], null, 0);
+      $scope.render();
+    };
+
     $scope.updateColumnSpan = function(span) {
       $scope.panel.span = span;
       $timeout($scope.render);