Fix for zindex override removal, should restore series order

src/app/components/timeSeries.js

@@ -9,7 +9,6 @@ function (_, kbn) {
     this.datapoints = opts.datapoints;
     this.datapoints = opts.datapoints;
     this.info = opts.info;
     this.info = opts.info;
     this.label = opts.info.alias;
     this.label = opts.info.alias;
-    this.zindex = 0;
   }
   }
 
 
   function matchSeriesOverride(aliasOrRegex, seriesAlias) {
   function matchSeriesOverride(aliasOrRegex, seriesAlias) {
@@ -31,6 +30,7 @@ function (_, kbn) {
     this.points = {};
     this.points = {};
     this.bars = {};
     this.bars = {};
     this.info.yaxis = 1;
     this.info.yaxis = 1;
+    this.zindex = 0;
     delete this.stack;
     delete this.stack;
 
 
     for (var i = 0; i < overrides.length; i++) {
     for (var i = 0; i < overrides.length; i++) {

src/app/directives/grafanaGraph.js

@@ -168,19 +168,19 @@ function (angular, $, kbn, moment, _) {
           addAnnotations(options);
           addAnnotations(options);
           configureAxisOptions(data, options);
           configureAxisOptions(data, options);
 
 
-          data = _.sortBy(data, function(series) { return series.zindex; });
+          var sortedSeries = _.sortBy(data, function(series) { return series.zindex; });
 
 
           // if legend is to the right delay plot draw a few milliseconds
           // if legend is to the right delay plot draw a few milliseconds
           // so the legend width calculation can be done
           // so the legend width calculation can be done
           if (shouldDelayDraw(panel)) {
           if (shouldDelayDraw(panel)) {
             legendSideLastValue = panel.legend.rightSide;
             legendSideLastValue = panel.legend.rightSide;
             setTimeout(function() {
             setTimeout(function() {
-              plot = $.plot(elem, data, options);
+              plot = $.plot(elem, sortedSeries, options);
               addAxisLabels();
               addAxisLabels();
             }, 50);
             }, 50);
           }
           }
           else {
           else {
-            plot = $.plot(elem, data, options);
+            plot = $.plot(elem, sortedSeries, options);
             addAxisLabels();
             addAxisLabels();
           }
           }
         }
         }

src/app/panels/graph/styleEditor.html

@@ -66,16 +66,14 @@
 <div class="editor-row">
 <div class="editor-row">
   <div class="section">
   <div class="section">
 		<h5>Series specific overrides <tip>Regex match example: /server[0-3]/i </tip></h5>
 		<h5>Series specific overrides <tip>Regex match example: /server[0-3]/i </tip></h5>
-
+		<div>
 		<div class="grafana-target" ng-repeat="override in panel.seriesOverrides" ng-controller="SeriesOverridesCtrl">
 		<div class="grafana-target" ng-repeat="override in panel.seriesOverrides" ng-controller="SeriesOverridesCtrl">
 			<div class="grafana-target-inner-wrapper">
 			<div class="grafana-target-inner-wrapper">
 				<div class="grafana-target-inner">
 				<div class="grafana-target-inner">
 
 
 					<ul class="grafana-target-controls-left">
 					<ul class="grafana-target-controls-left">
-						<li>
-							<a class="grafana-target-segment" ng-click="removeSeriesOverride(override)" role="menuitem">
-								<i class="icon-remove"></i>
-							</a>
+						<li class="grafana-target-segment>"
+							<i class="icon-remove" ng-click="removeSeriesOverride(override)"></i>
 						</li>
 						</li>
 					</ul>
 					</ul>
 
 
@@ -90,9 +88,7 @@
 										class="input-medium grafana-target-segment-input" >
 										class="input-medium grafana-target-segment-input" >
 						</li>
 						</li>
 						<li class="grafana-target-segment" ng-repeat="option in currentOverrides">
 						<li class="grafana-target-segment" ng-repeat="option in currentOverrides">
-							<a class="pointer" ng-click="removeOverride(option)">
-								<i class="icon-remove"></i>
-							</a>
+							<i class="pointer icon-remove" ng-click="removeOverride(option)"></i>
 							{{option.name}}: {{option.value}}
 							{{option.name}}: {{option.value}}
 						</li>
 						</li>
 						<li class="dropdown">
 						<li class="dropdown">
@@ -105,6 +101,7 @@
 				</div>
 				</div>
 			</div>
 			</div>
 		</div>
 		</div>
+		</div>
 
 
 		<button class="btn btn-success" style="margin-top: 20px" ng-click="addSeriesOverride()">Add series override rule</button>
 		<button class="btn btn-success" style="margin-top: 20px" ng-click="addSeriesOverride()">Add series override rule</button>
 	</div>
 	</div>

src/test/specs/grafanaGraph-specs.js

@@ -92,8 +92,8 @@ define([
     });
     });
 
 
     graphScenario('should order series order according to zindex', function(ctx) {
     graphScenario('should order series order according to zindex', function(ctx) {
-      ctx.setup(function(scope, data) {
-        data[0].zindex = 2;
+      ctx.setup(function(scope) {
+        scope.panel.seriesOverrides = [{ alias: 'series1', zindex: 2 }];
       });
       });
 
 
       it('should move zindex 2 last', function() {
       it('should move zindex 2 last', function() {

src/test/specs/timeSeries-specs.js

@@ -101,8 +101,8 @@ define([
 
 
         it('should set yaxis', function() {
         it('should set yaxis', function() {
           expect(series.info.yaxis).to.be(2);
           expect(series.info.yaxis).to.be(2);
-
         });
         });
+
         it('should set zindex', function() {
         it('should set zindex', function() {
           expect(series.zindex).to.be(2);
           expect(series.zindex).to.be(2);
         });
         });