Merge branch 'master' into pluginlist

CHANGELOG.md

@@ -1,11 +1,18 @@
 # 3.0.0-beta3 (unreleased)
 
+### Enhancements
+* **InfluxDB**: Changed multi query encoding to work with InfluxDB 0.11 & 0.12, closes [#4533](https://github.com/grafana/grafana/issues/4533)
+
 ### Bug fixes
 * **Postgres**: Fixed page render crash when using postgres, fixes [#4558](https://github.com/grafana/grafana/issues/4558)
 * **Table panel**: Fixed table panel bug when trying to show annotations in table panel, fixes [#4563](https://github.com/grafana/grafana/issues/4563)
 * **App Config**: Fixed app config issue showing content of other app config, fixes [#4575](https://github.com/grafana/grafana/issues/4575)
 * **Graph Panel**: Fixed legend option max not updating, fixes [#4601](https://github.com/grafana/grafana/issues/4601)
 * **Graph Panel**: Fixed issue where newly added graph panels shared same axes config, fixes [#4582](https://github.com/grafana/grafana/issues/4582)
+* **Graph Panel**: Fixed issue with axis labels overlapping Y-axis, fixes [#4626](https://github.com/grafana/grafana/issues/4626)
+* **InfluxDB**: Fixed issue with templating query containing template variable, fixes [#4602](https://github.com/grafana/grafana/issues/4602)
+* **Graph Panel**: Fixed issue with hiding series and stacking, fixes [#4557](https://github.com/grafana/grafana/issues/4557)
+* **Mixed Datasources**: Fixed issue with mixing many datasources in same graph, fixes [#4604](https://github.com/grafana/grafana/issues/4604)
 
 # 3.0.0-beta2 (2016-04-04)
 

pkg/api/api.go

@@ -30,6 +30,7 @@ func Register(r *macaron.Macaron) {
 	// authed views
 	r.Get("/profile/", reqSignedIn, Index)
 	r.Get("/profile/password", reqSignedIn, Index)
+	r.Get("/profile/switch-org/:id", reqSignedIn, ChangeActiveOrgAndRedirectToHome)
 	r.Get("/org/", reqSignedIn, Index)
 	r.Get("/org/new", reqSignedIn, Index)
 	r.Get("/datasources/", reqSignedIn, Index)

pkg/api/user.go

@@ -4,6 +4,7 @@ import (
 	"github.com/grafana/grafana/pkg/bus"
 	"github.com/grafana/grafana/pkg/middleware"
 	m "github.com/grafana/grafana/pkg/models"
+	"github.com/grafana/grafana/pkg/setting"
 	"github.com/grafana/grafana/pkg/util"
 )
 
@@ -109,6 +110,23 @@ func UserSetUsingOrg(c *middleware.Context) Response {
 	return ApiSuccess("Active organization changed")
 }
 
+// GET /profile/switch-org/:id
+func ChangeActiveOrgAndRedirectToHome(c *middleware.Context) {
+	orgId := c.ParamsInt64(":id")
+
+	if !validateUsingOrg(c.UserId, orgId) {
+		NotFoundHandler(c)
+	}
+
+	cmd := m.SetUsingOrgCommand{UserId: c.UserId, OrgId: orgId}
+
+	if err := bus.Dispatch(&cmd); err != nil {
+		NotFoundHandler(c)
+	}
+
+	c.Redirect(setting.AppSubUrl + "/")
+}
+
 func ChangeUserPassword(c *middleware.Context, cmd m.ChangeUserPasswordCommand) Response {
 	userQuery := m.GetUserByIdQuery{Id: c.UserId}
 

public/app/core/components/sidemenu/sidemenu.html

@@ -21,10 +21,6 @@
 					<i class="{{::menuItem.icon}}" ng-show="::menuItem.icon"></i>
 					{{::menuItem.text}}
 				</a>
-				<a ng-click="menuItem.click()" ng-show="::menuItem.click">
-					<i class="{{::menuItem.icon}}"></i>
-					{{::menuItem.text}}
-				</a>
 			</li>
 		</ul>
 	</li>

public/app/core/components/sidemenu/sidemenu.ts

@@ -72,9 +72,8 @@ export class SideMenuCtrl {
        this.orgMenu.push({
          text: "Switch to " + org.name,
          icon: "fa fa-fw fa-random",
-         click: () => {
-           this.switchOrg(org.orgId);
-         }
+         url: this.getUrl('/profile/switch-org/' + org.orgId),
+         target: '_self'
        });
      });
 
@@ -83,12 +82,6 @@ export class SideMenuCtrl {
      }
    });
  }
-
- switchOrg(orgId) {
-   this.backendSrv.post('/api/user/using/' + orgId).then(() => {
-     window.location.href = `${config.appSubUrl}/`;
-   });
- };
 }
 
 export function sideMenuDirective() {

public/app/core/services/popover_srv.ts

@@ -46,9 +46,12 @@ function popoverSrv($compile, $rootScope) {
     drop.on('close', () => {
       popoverScope.dismiss({fromDropClose: true});
       destroyDrop();
+      if (options.onClose) {
+        options.onClose();
+      }
     });
 
-    drop.open();
+    setTimeout(() => { drop.open(); }, 10);
   };
 }
 

public/app/features/panel/metrics_panel_ctrl.ts

@@ -184,7 +184,6 @@ class MetricsPanelCtrl extends PanelCtrl {
       cacheTimeout: this.panel.cacheTimeout
     };
 
-    this.setTimeQueryStart();
     return datasource.query(metricsQuery);
   }
 
@@ -252,8 +251,12 @@ class MetricsPanelCtrl extends PanelCtrl {
   }
 
   addDataQuery(datasource) {
-    var target = {
-    };
+    var target: any = {};
+
+    if (datasource) {
+      target.datasource = datasource.name;
+    }
+
     this.panel.targets.push(target);
   }
 }

public/app/plugins/datasource/influxdb/datasource.ts

@@ -55,7 +55,7 @@ export default class InfluxDatasource {
       query = query.replace(/\$interval/g, (target.interval || options.interval));
       return query;
 
-    }).join("\n");
+    }).join(";");
 
     // replace grafana variables
     allQueries = allQueries.replace(/\$timeFilter/g, timeFilter);
@@ -107,7 +107,7 @@ export default class InfluxDatasource {
 
     var timeFilter = this.getTimeFilter({rangeRaw: options.rangeRaw});
     var query = options.annotation.query.replace('$timeFilter', timeFilter);
-    query = this.templateSrv.replace(query);
+    query = this.templateSrv.replace(query, null, 'regex');
 
     return this._seriesQuery(query).then(data => {
       if (!data || !data.results || !data.results[0]) {
@@ -133,6 +133,17 @@ export default class InfluxDatasource {
     return this._influxRequest('GET', '/query', {q: query, epoch: 'ms'});
   }
 
+
+  serializeParams(params) {
+    if (!params) { return '';}
+
+    return _.reduce(params, (memo, value, key) => {
+      if (value === null || value === undefined) { return memo; }
+      memo.push(encodeURIComponent(key) + '=' + encodeURIComponent(value));
+      return memo;
+    }, []).join("&");
+  }
+
   testDatasource() {
     return this.metricFindQuery('SHOW MEASUREMENTS LIMIT 1').then(() => {
       return { status: "success", message: "Data source is working", title: "Success" };
@@ -166,6 +177,7 @@ export default class InfluxDatasource {
       data:   data,
       precision: "ms",
       inspect: { type: 'influxdb' },
+      paramSerializer: this.serializeParams,
     };
 
     options.headers = options.headers || {};

public/app/plugins/panel/graph/graph.js

@@ -151,8 +151,10 @@ function (angular, $, moment, _, kbn, GraphTooltip) {
         }
 
         function processOffsetHook(plot, gridMargin) {
-          if (panel.yaxis) { gridMargin.left = 20; }
-          if (panel.rightYAxisLabel) { gridMargin.right = 20; }
+          var left = panel.yaxes[0];
+          var right = panel.yaxes[1];
+          if (left.show && left.label) { gridMargin.left = 20; }
+          if (right.show && right.label) { gridMargin.right = 20; }
         }
 
         // Function for rendering panel

public/app/plugins/panel/graph/graph_tooltip.js

@@ -33,9 +33,8 @@ function ($) {
       return j - 1;
     };
 
-    this.showTooltip = function(absoluteTime, relativeTime, innerHtml, pos) {
-      var body = '<div class="graph-tooltip small"><div class="graph-tooltip-time">'+ absoluteTime +
-        ' <span class="tone-down">(' + relativeTime + ')</span></div> ';
+    this.showTooltip = function(absoluteTime, innerHtml, pos) {
+      var body = '<div class="graph-tooltip small"><div class="graph-tooltip-time">'+ absoluteTime + '</div> ';
       body += innerHtml + '</div>';
       $tooltip.html(body).place_tt(pos.pageX + 20, pos.pageY);
     };
@@ -109,7 +108,7 @@ function ($) {
       var plot = elem.data().plot;
       var plotData = plot.getData();
       var seriesList = getSeriesFn();
-      var group, value, absoluteTime, relativeTime, hoverInfo, i, series, seriesHtml, tooltipFormat;
+      var group, value, absoluteTime, hoverInfo, i, series, seriesHtml, tooltipFormat;
 
       if (panel.tooltip.msResolution) {
         tooltipFormat = 'YYYY-MM-DD HH:mm:ss.SSS';
@@ -132,7 +131,6 @@ function ($) {
 
         seriesHtml = '';
 
-        relativeTime = dashboard.getRelativeTime(seriesHoverInfo.time);
         absoluteTime = dashboard.formatDate(seriesHoverInfo.time, tooltipFormat);
 
         for (i = 0; i < seriesHoverInfo.length; i++) {
@@ -142,17 +140,22 @@ function ($) {
             continue;
           }
 
+          var highlightClass = '';
+          if (item && i === item.seriesIndex) {
+            highlightClass = 'graph-tooltip-list-item--highlight';
+          }
+
           series = seriesList[i];
 
           value = series.formatValue(hoverInfo.value);
 
-          seriesHtml += '<div class="graph-tooltip-list-item"><div class="graph-tooltip-series-name">';
+          seriesHtml += '<div class="graph-tooltip-list-item ' + highlightClass + '"><div class="graph-tooltip-series-name">';
           seriesHtml += '<i class="fa fa-minus" style="color:' + series.color +';"></i> ' + series.label + ':</div>';
           seriesHtml += '<div class="graph-tooltip-value">' + value + '</div></div>';
           plot.highlight(i, hoverInfo.hoverIndex);
         }
 
-        self.showTooltip(absoluteTime, relativeTime, seriesHtml, pos);
+        self.showTooltip(absoluteTime, seriesHtml, pos);
       }
       // single series tooltip
       else if (item) {
@@ -169,12 +172,11 @@ function ($) {
 
         value = series.formatValue(value);
 
-        relativeTime = dashboard.getRelativeTime(item.datapoint[0]);
         absoluteTime = dashboard.formatDate(item.datapoint[0], tooltipFormat);
 
         group += '<div class="graph-tooltip-value">' + value + '</div>';
 
-        self.showTooltip(absoluteTime, relativeTime, group, pos);
+        self.showTooltip(absoluteTime, group, pos);
       }
       // no hit
       else {

public/app/plugins/panel/graph/module.ts

@@ -116,6 +116,7 @@ class GraphCtrl extends MetricsPanelCtrl {
 
     this.colors = $scope.$root.colors;
 
+    this.events.on('render', this.onRender.bind(this));
     this.events.on('data-received', this.onDataReceived.bind(this));
     this.events.on('data-error', this.onDataError.bind(this));
     this.events.on('data-snapshot-load', this.onDataSnapshotLoad.bind(this));
@@ -215,10 +216,17 @@ class GraphCtrl extends MetricsPanelCtrl {
       this.panel.tooltip.msResolution = this.panel.tooltip.msResolution || series.isMsResolutionNeeded();
     }
 
-    series.applySeriesOverrides(this.panel.seriesOverrides);
     return series;
   }
 
+  onRender() {
+    if (!this.seriesList) { return; }
+
+    for (let series of this.seriesList) {
+      series.applySeriesOverrides(this.panel.seriesOverrides);
+    }
+  }
+
   changeSeriesColor(series, color) {
     series.color = color;
     this.panel.aliasColors[series.alias] = series.color;
@@ -235,7 +243,6 @@ class GraphCtrl extends MetricsPanelCtrl {
     } else {
       this.toggleSeriesExclusiveMode(serie);
     }
-
     this.render();
   }
 

public/app/plugins/panel/graph/series_overrides_ctrl.js

@@ -60,6 +60,9 @@ define([
         template: '<gf-color-picker></gf-color-picker>',
         model: {
           colorSelected: $scope.colorSelected,
+        },
+        onClose: function() {
+          $scope.ctrl.render();
         }
       });
     };

public/sass/_variables.dark.scss

@@ -39,6 +39,7 @@ $brand-primary:         $orange;
 $brand-success:         $green;
 $brand-warning:         $brand-primary;
 $brand-danger:          $red;
+$brand-text-highlight:  #f7941d;
 
 // Status colors
 // -------------------------
@@ -242,8 +243,8 @@ $infoBackground:          $blue-dark;
 
 // Tooltips and popovers
 // -------------------------
-$tooltipColor:            $white;
-$tooltipBackground:       rgb(58, 57, 57);
+$tooltipColor:            $text-color;
+$tooltipBackground:       $dark-4;
 $tooltipArrowWidth:       5px;
 $tooltipArrowColor:       $tooltipBackground;
 $tooltipLinkColor:        $link-color;

public/sass/_variables.light.scss

@@ -44,6 +44,7 @@ $brand-primary:         $orange;
 $brand-success:         $green;
 $brand-warning:         $orange;
 $brand-danger:          $red;
+$brand-text-highlight:  #f7941d;
 
 // Status colors
 // -------------------------

public/sass/components/_panel_graph.scss

@@ -237,27 +237,28 @@
 
   .graph-tooltip-time {
     text-align: center;
-    font-weight: $font-weight-semi-bold;
     position: relative;
     top: -3px;
-  }
-
-  .tone-down {
-    opacity: 0.7;
+    padding: 0.2rem;
   }
 
   .graph-tooltip-list-item {
     display: table-row;
+
+    &--highlight {
+      color: $brand-text-highlight;
+    }
   }
 
   .graph-tooltip-series-name {
     display: table-cell;
+    padding: 0.15rem;
   }
 
   .graph-tooltip-value {
     display: table-cell;
     font-weight: bold;
-    padding-left: 10px;
+    padding-left: 15px;
     text-align: right;
   }
 }

public/sass/components/_tooltip.scss

@@ -88,13 +88,6 @@
   }
 }
 
-.grafana-tooltip hr {
- padding: 2px;
- color: #c8c8c8;
- margin: 0px;
- border-bottom: 0px solid #c8c8c8;
-}
-
 .grafana-tip {
   padding-left: 5px;
 }