Add: global parameters for dashboards

client/app/components/parameters.js

@@ -23,12 +23,16 @@ function ParametersDirective($location, $uibModal) {
       parameters: '=',
       syncValues: '=?',
       editable: '=?',
+      change: '&onChange',
     },
     template,
     link(scope) {
       // is this the correct location for this logic?
       if (scope.syncValues !== false) {
         scope.$watch('parameters', () => {
+          if (scope.change) {
+            scope.change({});
+          }
           scope.parameters.forEach((param) => {
             if (param.value !== null || param.value !== '') {
               $location.search(`p_${param.name}`, param.value);

client/app/pages/dashboards/dashboard.html

@@ -54,6 +54,10 @@ <h3>
     This dashboard is archived and won't appear in the dashboards list or search results.
   </div>
 
+  <div class="m-b-5">
+    <parameters parameters="$ctrl.globalParameters" on-change="$ctrl.onGlobalParametersChange()"></parameters>
+  </div>
+
   <div class="m-b-5">
     <filters ng-if="$ctrl.dashboard.dashboard_filters_enabled" filters="$ctrl.filters" on-change="$ctrl.filtersOnChange(filter, $modal)"></filters>
   </div>

client/app/pages/dashboards/dashboard.js

@@ -2,12 +2,13 @@ import * as _ from 'underscore';
 import template from './dashboard.html';
 import shareDashboardTemplate from './share-dashboard.html';
 
-function DashboardCtrl($rootScope, $routeParams, $location, $timeout, $q, $uibModal,
+function DashboardCtrl($rootScope, $scope, $routeParams, $location, $timeout, $q, $uibModal,
   Title, AlertDialog, Dashboard, currentUser, clientConfig, Events) {
   this.isFullscreen = false;
   this.refreshRate = null;
   this.showPermissionsControl = clientConfig.showPermissionsControl;
   this.currentUser = currentUser;
+  this.globalParameters = [];
   this.refreshRates = [
     { name: '10 seconds', rate: 10 },
     { name: '30 seconds', rate: 30 },
@@ -26,6 +27,32 @@ function DashboardCtrl($rootScope, $routeParams, $location, $timeout, $q, $uibMo
     }
   };
 
+  const extractGlobalParameters = () => {
+    let globalParams = {};
+    this.dashboard.widgets.forEach(row =>
+      row.forEach((widget) => {
+        widget.getQuery().getGlobalParametersDefs().forEach((param) => {
+          const defaults = {};
+          defaults[param.name] = _.clone(param);
+          defaults[param.name].locals = [];
+          globalParams = _.defaults(globalParams, defaults);
+          globalParams[param.name].locals.push(param);
+        });
+      })
+    );
+    this.globalParameters = _.values(globalParams);
+  };
+
+  this.onGlobalParametersChange = () => {
+    _.each(this.globalParameters, (global) => {
+      _.each(global.locals, (local) => {
+        local.value = global.value;
+      });
+    });
+  };
+
+  $scope.$on('deleteDashboardWidget', extractGlobalParameters);
+
   const renderDashboard = (dashboard, force) => {
     Title.set(dashboard.name);
     const promises = [];
@@ -42,6 +69,8 @@ function DashboardCtrl($rootScope, $routeParams, $location, $timeout, $q, $uibMo
        })
     );
 
+    extractGlobalParameters();
+
     $q.all(promises).then((queryResults) => {
       const filters = {};
       queryResults.forEach((queryResult) => {
@@ -139,7 +168,7 @@ function DashboardCtrl($rootScope, $routeParams, $location, $timeout, $q, $uibMo
       resolve: {
         dashboard: () => this.dashboard,
       },
-    });
+    }).result.then(() => extractGlobalParameters());
   };
 
   this.toggleFullscreen = () => {

client/app/pages/dashboards/widget.html

@@ -25,7 +25,7 @@
           </div>
         </div>
 
-        <parameters parameters="$ctrl.widget.query.getParametersDefs()"></parameters>
+        <parameters parameters="$ctrl.widget.query.getLocalParametersDefs()"></parameters>
 
         <div ng-switch="$ctrl.queryResult.getStatus()">
           <div ng-switch-when="failed">

client/app/pages/dashboards/widget.js

@@ -24,7 +24,7 @@ const EditTextBoxComponent = {
   },
 };
 
-function DashboardWidgetCtrl($location, $uibModal, $window, Events, currentUser) {
+function DashboardWidgetCtrl($location, $uibModal, $window, $scope, Events, currentUser) {
   this.canViewQuery = currentUser.hasPermission('view_query');
 
   this.editTextBox = () => {
@@ -51,6 +51,8 @@ function DashboardWidgetCtrl($location, $uibModal, $window, Events, currentUser)
 
       this.dashboard.layout = response.layout;
       this.dashboard.version = response.version;
+
+      $scope.$emit('deleteDashboardWidget');
     });
   };
 

client/app/services/query.js

@@ -293,6 +293,21 @@ function QueryResource($resource, $http, $q, $location, currentUser, QueryResult
     return this.getParameters().get();
   };
 
+  Query.prototype.getLocalParametersDefs = function getLocalParametersDefs() {
+    if (!this.$localParameters) {
+      this.$localParameters = this.getParametersDefs().filter(p => p.name[0] !== '$');
+    }
+
+    return this.$localParameters;
+  };
+
+  Query.prototype.getGlobalParametersDefs = function getGlobalParametersDefs() {
+    if (!this.$globalParameters) {
+      this.$globalParameters = this.getParametersDefs().filter(p => p.name[0] === '$');
+    }
+    return this.$globalParameters;
+  };
+
   return Query;
 }