POC for repeating panels based on template variable options

src/app/features/dashboard/all.js

@@ -14,5 +14,6 @@ define([
   './unsavedChangesSrv',
   './directives/dashSearchView',
   './graphiteImportCtrl',
+  './dynamicDashboardSrv',
   './importCtrl',
 ], function () {});

src/app/features/dashboard/dashboardCtrl.js

@@ -15,6 +15,7 @@ function (angular, $, config) {
       dashboardKeybindings,
       timeSrv,
       templateValuesSrv,
+      dynamicDashboardSrv,
       dashboardSrv,
       dashboardViewStateSrv,
       $timeout) {
@@ -44,6 +45,8 @@ function (angular, $, config) {
       // template values service needs to initialize completely before
       // the rest of the dashboard can load
       templateValuesSrv.init(dashboard).then(function() {
+        dynamicDashboardSrv.init(dashboard);
+
         $scope.dashboard = dashboard;
         $scope.dashboardViewState = dashboardViewStateSrv.create($scope);
         $scope.dashboardMeta = data.meta;

src/app/features/dashboard/dashboardSrv.js

@@ -126,6 +126,7 @@ function (angular, $, kbn, _, moment) {
 
       var currentRow = this.rows[rowIndex];
       currentRow.panels.push(newPanel);
+      return newPanel;
     };
 
     p.formatDate = function(date, format) {

src/app/features/dashboard/dynamicDashboardSrv.js

@@ -0,0 +1,48 @@
+define([
+  'angular',
+  'lodash',
+],
+function (angular, _) {
+  'use strict';
+
+  var module = angular.module('grafana.services');
+
+  module.service('dynamicDashboardSrv', function()  {
+
+    this.init = function(dashboard) {
+      this.handlePanelRepeats(dashboard);
+    };
+
+    this.handlePanelRepeats = function(dashboard) {
+      var i, j, row, panel;
+      for (i = 0; i < dashboard.rows.length; i++) {
+        row = dashboard.rows[i];
+        for (j = 0; j < row.panels.length; j++) {
+          panel = row.panels[j];
+          if (panel.repeat) {
+            this.repeatPanel(panel, row, dashboard);
+          }
+        }
+      }
+    };
+
+    this.repeatPanel = function(panel, row, dashboard) {
+      var variables = dashboard.templating.list;
+      var variable = _.findWhere(variables, {name: panel.repeat.replace('$', '')});
+      if (!variable) {
+        return;
+      }
+
+      _.each(variable.options, function(option) {
+        var copy = dashboard.duplicatePanel(panel, row);
+        copy.repeat = null;
+        console.log('duplicatePanel');
+      });
+    };
+
+
+  });
+
+});
+
+

src/app/features/panel/panelSrv.js

@@ -11,6 +11,7 @@ function (angular, _, config) {
   module.service('panelSrv', function($rootScope, $timeout, datasourceSrv, $q) {
 
     this.init = function($scope) {
+
       if (!$scope.panel.span) { $scope.panel.span = 12; }
 
       $scope.inspector = {};

src/app/partials/panelgeneral.html

@@ -10,6 +10,13 @@
 		<div class="editor-option">
       <label class="small">Height</label><input type="text" class="input-small" ng-model='panel.height'></select>
     </div>
+  </div>
+	<div class="section">
+    <h5>Templating options</h5>
+    <div class="editor-option">
+			<label class="small">Repeat Panel</label>
+			<input type="text" class="input-medium" ng-model='panel.repeat'></input>
+    </div>
   </div>
 </div>