From ceb079a7ea1d6e24e99f385378bdaf1d8a501369 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 29 Mar 2015 13:46:37 +0200 Subject: [PATCH 1/3] removed old docs, need to update export & import docs, and playlist docs --- docs/sources/reference/export_import.md | 44 ++----------------------- docs/sources/reference/playlist.md | 26 ++------------- 2 files changed, 4 insertions(+), 66 deletions(-) diff --git a/docs/sources/reference/export_import.md b/docs/sources/reference/export_import.md index bfcdd7bd0d1..8ae39cb0cf2 100644 --- a/docs/sources/reference/export_import.md +++ b/docs/sources/reference/export_import.md @@ -6,45 +6,5 @@ page_keywords: grafana, export, import, documentation # Export and Import -## Export (Json file) - -Load the dashboard you wish to export (e.g. via search) - -Click on the "Save" icon (floppy disk) - -![](/img/v1/export_import_save_menu.png) - -Click on "Export schema" - -![](/img/v1/export_schema_link.png) - -Save file on local disk - -![](/img/v1/export_save_file.png) - -## Import - -Click the "Search" icon (open folder) - -![](/img/v1/export_import_search_menu.png) - -Click "Import" button - -![](/img/v1/export_import_button.png) - -Click "Browse" button and browse to previously exported dashboard on local disk (which should be a valid Json file) - -![](/img/v1/export_import_browse_button.png) - -Select exported dashboard - -![](/img/v1/export_import_popup.png) - - -Click "Save" icon to show save menu - -![](/img/v1/export_import_save_menu.png) - -Click new save icon (floppy disk) to Save newly imported dashboard - -![](/img/v1/export_import_save_dashboard.png) +You find the import view in the bottom of the search dropdown. From this view you +can import local json files or migrate dashboards stored in Elasticsearch or InfluxDB. diff --git a/docs/sources/reference/playlist.md b/docs/sources/reference/playlist.md index 0f81bfe48fc..e45219657a9 100644 --- a/docs/sources/reference/playlist.md +++ b/docs/sources/reference/playlist.md @@ -6,28 +6,6 @@ page_keywords: grafana, playlist, documentation # Playlist Guide -In Grafana v1.5 a playlist feature was added. You can use this feature by first marking a couple - of dashboards as favorites. This is accomplished in the Save menu. Click on the save icon and then _Mark As Favorite_. +*TODO* - -## Step 1 - Mark as favorire -![](/img/v1/mark_as_favorite.png) - -Then open the playlist modal. You will find this button in the open dashboard / search popup (CTRL+F). - -## Step 2 - Open playlist view -![](/img/v1/playlist_button.png) - -This opens the playlist view. - -## Step 3 - Select dashbords and interval - -![](/img/v1/playlist_modal.png) - -In this view you can select the dashboards you want to include in the playlist, and even remove dashboards from you favorites list. Set the time span between dashboard change, for example 1m, 10m, 1h for 1 minute, 10 minute or 1 hour interval. - -To start the dashboard click the Start button. - -When a dashboard playlist is running, most menu buttons and dashboard controls are hidden. This is in order to present as clear a view of the dashboard as possible for big tv displays. Click the stop playlist link in the top menu to the right to stop the playlist. - -![](playlist_playing_hiden_menu.png) +Needs update for Grafana 2.0 From 0f791c9fa8d16f37ae60e209533341e25f9f0811 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 29 Mar 2015 14:30:03 +0200 Subject: [PATCH 2/3] Refactoring of share modal --- public/app/features/dashboard/all.js | 2 +- .../features/dashboard/dashboardNavCtrl.js | 2 +- .../{shareDashboard.html => shareModal.html} | 91 +++++++++++-------- .../dashboard/partials/sharePanel.html | 65 ------------- .../dashboard/partials/snapshotTopNav.html | 6 ++ .../{sharePanelCtrl.js => shareModalCtrl.js} | 14 ++- .../features/dashboard/shareSnapshotCtrl.js | 1 + .../features/dashboard/snapshotTopNavCtrl.js | 7 ++ public/app/features/panel/panelSrv.js | 2 +- ...lCtrl-specs.js => shareModalCtrl-specs.js} | 4 +- public/test/test-main.js | 2 +- 11 files changed, 88 insertions(+), 108 deletions(-) rename public/app/features/dashboard/partials/{shareDashboard.html => shareModal.html} (58%) delete mode 100644 public/app/features/dashboard/partials/sharePanel.html rename public/app/features/dashboard/{sharePanelCtrl.js => shareModalCtrl.js} (84%) rename public/test/specs/{sharePanelCtrl-specs.js => shareModalCtrl-specs.js} (95%) diff --git a/public/app/features/dashboard/all.js b/public/app/features/dashboard/all.js index 1380034dd19..a279e9f3078 100644 --- a/public/app/features/dashboard/all.js +++ b/public/app/features/dashboard/all.js @@ -5,7 +5,7 @@ define([ './saveDashboardAsCtrl', './playlistCtrl', './rowCtrl', - './sharePanelCtrl', + './shareModalCtrl', './shareSnapshotCtrl', './submenuCtrl', './dashboardSrv', diff --git a/public/app/features/dashboard/dashboardNavCtrl.js b/public/app/features/dashboard/dashboardNavCtrl.js index 6c017ae856e..5334852d967 100644 --- a/public/app/features/dashboard/dashboardNavCtrl.js +++ b/public/app/features/dashboard/dashboardNavCtrl.js @@ -37,7 +37,7 @@ function (angular, _) { $scope.shareDashboard = function() { $scope.appEvent('show-modal', { - src: './app/features/dashboard/partials/shareDashboard.html', + src: './app/features/dashboard/partials/shareModal.html', scope: $scope.$new(), }); }; diff --git a/public/app/features/dashboard/partials/shareDashboard.html b/public/app/features/dashboard/partials/shareModal.html similarity index 58% rename from public/app/features/dashboard/partials/shareDashboard.html rename to public/app/features/dashboard/partials/shareModal.html index 295ac71e0f5..b6b722465f9 100644 --- a/public/app/features/dashboard/partials/shareDashboard.html +++ b/public/app/features/dashboard/partials/shareModal.html @@ -1,12 +1,12 @@ -
+
- - Share Dashboard + + {{modalTitle}}
-
-
+
+
@@ -15,38 +15,58 @@
-
-
-
-
- -
-
-
-
- -
-
- -
-
-
- - - - -
- -
+
+
- + + + + + diff --git a/public/app/features/dashboard/partials/sharePanel.html b/public/app/features/dashboard/partials/sharePanel.html deleted file mode 100644 index e56fe89be59..00000000000 --- a/public/app/features/dashboard/partials/sharePanel.html +++ /dev/null @@ -1,65 +0,0 @@ -
-
-
- - Share Panel -
- -
-
-
-
- - -
- -
-
-
-
- -
-
-
-
- -
-
- -
-
-
- - - - -
- -
-
- -
-
IFrame embedding
-

The html code below can be pasted and included in another web page. Unless anonymous access - is enabled the user viewing that page need to be signed into grafana for the graph to load. - -

-
-
- - - -
- -
-
-
-
-
diff --git a/public/app/features/dashboard/partials/snapshotTopNav.html b/public/app/features/dashboard/partials/snapshotTopNav.html index 3bd0fb31bbf..68e8b9532d6 100644 --- a/public/app/features/dashboard/partials/snapshotTopNav.html +++ b/public/app/features/dashboard/partials/snapshotTopNav.html @@ -19,6 +19,12 @@
+
    +
  • + +
    • +
+
  • diff --git a/public/app/features/dashboard/sharePanelCtrl.js b/public/app/features/dashboard/shareModalCtrl.js similarity index 84% rename from public/app/features/dashboard/sharePanelCtrl.js rename to public/app/features/dashboard/shareModalCtrl.js index eb0a7a7a957..5ad12b6e521 100644 --- a/public/app/features/dashboard/sharePanelCtrl.js +++ b/public/app/features/dashboard/shareModalCtrl.js @@ -9,7 +9,7 @@ function (angular, _, require, config) { var module = angular.module('grafana.controllers'); - module.controller('SharePanelCtrl', function($scope, $rootScope, $location, $timeout, timeSrv, $element, templateSrv) { + module.controller('ShareModalCtrl', function($scope, $rootScope, $location, $timeout, timeSrv, $element, templateSrv) { $scope.init = function() { $scope.editor = { index: 0 }; @@ -19,6 +19,18 @@ function (angular, _, require, config) { includeTemplateVars: true }; + $scope.tabs = [{title: 'Link', src: 'shareLink.html'}]; + + if ($scope.options.toPanel) { + $scope.modalTitle = 'Share Panel'; + $scope.tabs.push({title: 'Embed', src: 'shareEmbed.html'}); + } else { + $scope.modalTitle = 'Share Dashboard'; + if (!$scope.dashboardMeta.isSnapshot) { + $scope.tabs.push({title: 'Snapshot sharing', src: 'shareSnapshot.html'}); + } + } + $scope.buildUrl(); }; diff --git a/public/app/features/dashboard/shareSnapshotCtrl.js b/public/app/features/dashboard/shareSnapshotCtrl.js index 4006abfe4b5..d75da5d5524 100644 --- a/public/app/features/dashboard/shareSnapshotCtrl.js +++ b/public/app/features/dashboard/shareSnapshotCtrl.js @@ -63,6 +63,7 @@ function (angular, _) { // remove template queries _.each(dash.templating.list, function(variable) { variable.query = ""; + variable.options = []; variable.refresh = false; }); diff --git a/public/app/features/dashboard/snapshotTopNavCtrl.js b/public/app/features/dashboard/snapshotTopNavCtrl.js index 06e7c9e6fdb..13ddb444685 100644 --- a/public/app/features/dashboard/snapshotTopNavCtrl.js +++ b/public/app/features/dashboard/snapshotTopNavCtrl.js @@ -17,6 +17,13 @@ function (angular, moment) { } }; + $scope.shareDashboard = function() { + $scope.appEvent('show-modal', { + src: './app/features/dashboard/partials/shareModal.html', + scope: $scope.$new(), + }); + }; + }); }); diff --git a/public/app/features/panel/panelSrv.js b/public/app/features/panel/panelSrv.js index 0e983fc3d07..b28ef4218ac 100644 --- a/public/app/features/panel/panelSrv.js +++ b/public/app/features/panel/panelSrv.js @@ -26,7 +26,7 @@ function (angular, _, config) { $scope.sharePanel = function() { $scope.appEvent('show-modal', { - src: './app/features/dashboard/partials/sharePanel.html', + src: './app/features/dashboard/partials/shareModal.html', scope: $scope.$new() }); }; diff --git a/public/test/specs/sharePanelCtrl-specs.js b/public/test/specs/shareModalCtrl-specs.js similarity index 95% rename from public/test/specs/sharePanelCtrl-specs.js rename to public/test/specs/shareModalCtrl-specs.js index bdbc3cfe5c3..40a2b2d868c 100644 --- a/public/test/specs/sharePanelCtrl-specs.js +++ b/public/test/specs/shareModalCtrl-specs.js @@ -1,6 +1,6 @@ define([ 'helpers', - 'features/dashboard/sharePanelCtrl' + 'features/dashboard/shareModalCtrl' ], function(helpers) { 'use strict'; @@ -16,7 +16,7 @@ define([ beforeEach(module('grafana.controllers')); beforeEach(ctx.providePhase()); - beforeEach(ctx.createControllerPhase('SharePanelCtrl')); + beforeEach(ctx.createControllerPhase('ShareModalCtrl')); describe('shareUrl with current time range and panel', function() { diff --git a/public/test/test-main.js b/public/test/test-main.js index 41797787565..a38f8dca32b 100644 --- a/public/test/test-main.js +++ b/public/test/test-main.js @@ -132,7 +132,7 @@ require([ 'specs/graph-specs', 'specs/graph-tooltip-specs', 'specs/seriesOverridesCtrl-specs', - 'specs/sharePanelCtrl-specs', + 'specs/shareModalCtrl-specs', 'specs/timeSrv-specs', 'specs/templateSrv-specs', 'specs/templateValuesSrv-specs', From c42d09b26759fe0adc0fb303a6276dc69ed6e81a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Torkel=20=C3=96degaard?= Date: Sun, 29 Mar 2015 15:01:27 +0200 Subject: [PATCH 3/3] Enabled snapshot sharing of single panels, enabled sharing of snapshot dashboards (but you cannot snapshot a snapshot --- public/app/features/dashboard/dashboardSrv.js | 13 +++++ .../dashboard/partials/shareModal.html | 4 +- .../app/features/dashboard/shareModalCtrl.js | 20 +++---- .../features/dashboard/shareSnapshotCtrl.js | 58 +++++++++++-------- public/app/features/panel/soloPanelCtrl.js | 16 +---- public/test/specs/helpers.js | 1 + public/test/specs/shareModalCtrl-specs.js | 17 +++--- 7 files changed, 67 insertions(+), 62 deletions(-) diff --git a/public/app/features/dashboard/dashboardSrv.js b/public/app/features/dashboard/dashboardSrv.js index 20f04b421d7..dc01a328b12 100644 --- a/public/app/features/dashboard/dashboardSrv.js +++ b/public/app/features/dashboard/dashboardSrv.js @@ -78,6 +78,19 @@ function (angular, $, kbn, _, moment) { } }; + p.getPanelById = function(id) { + for (var i = 0; i < this.rows.length; i++) { + var row = this.rows[i]; + for (var j = 0; j < row.panels.length; j++) { + var panel = row.panels[j]; + if (panel.id === id) { + return panel; + } + } + } + return null; + }; + p.rowSpan = function(row) { return _.reduce(row.panels, function(p,v) { return p + v.span; diff --git a/public/app/features/dashboard/partials/shareModal.html b/public/app/features/dashboard/partials/shareModal.html index b6b722465f9..881d30ada97 100644 --- a/public/app/features/dashboard/partials/shareModal.html +++ b/public/app/features/dashboard/partials/shareModal.html @@ -1,4 +1,4 @@ -
    +
    @@ -59,7 +59,7 @@
    -
    +
    Direct link rendered image
    diff --git a/public/app/features/dashboard/shareModalCtrl.js b/public/app/features/dashboard/shareModalCtrl.js index 5ad12b6e521..358c2c74f66 100644 --- a/public/app/features/dashboard/shareModalCtrl.js +++ b/public/app/features/dashboard/shareModalCtrl.js @@ -13,22 +13,20 @@ function (angular, _, require, config) { $scope.init = function() { $scope.editor = { index: 0 }; - $scope.options = { - forCurrent: true, - toPanel: $scope.panel ? true : false, - includeTemplateVars: true - }; + $scope.options = { forCurrent: true, includeTemplateVars: true }; + $scope.modeSharePanel = $scope.panel ? true : false; $scope.tabs = [{title: 'Link', src: 'shareLink.html'}]; - if ($scope.options.toPanel) { + if ($scope.modeSharePanel) { $scope.modalTitle = 'Share Panel'; $scope.tabs.push({title: 'Embed', src: 'shareEmbed.html'}); } else { $scope.modalTitle = 'Share Dashboard'; - if (!$scope.dashboardMeta.isSnapshot) { - $scope.tabs.push({title: 'Snapshot sharing', src: 'shareSnapshot.html'}); - } + } + + if (!$scope.dashboardMeta.isSnapshot) { + $scope.tabs.push({title: 'Snapshot sharing', src: 'shareSnapshot.html'}); } $scope.buildUrl(); @@ -64,7 +62,7 @@ function (angular, _, require, config) { delete params.to; } - if ($scope.options.toPanel) { + if ($scope.modeSharePanel) { params.panelId = $scope.panel.id; params.fullscreen = true; } else { @@ -97,8 +95,6 @@ function (angular, _, require, config) { $scope.imageUrl += '&height=500'; }; - $scope.init(); - }); module.directive('clipboardButton',function() { diff --git a/public/app/features/dashboard/shareSnapshotCtrl.js b/public/app/features/dashboard/shareSnapshotCtrl.js index d75da5d5524..ed6536face6 100644 --- a/public/app/features/dashboard/shareSnapshotCtrl.js +++ b/public/app/features/dashboard/shareSnapshotCtrl.js @@ -44,34 +44,12 @@ function (angular, _) { $timeout(function() { $scope.saveSnapshot(external); - }, 3000); + }, 4000); }; $scope.saveSnapshot = function(external) { var dash = angular.copy($scope.dashboard); - // change title - dash.title = $scope.snapshot.name; - // make relative times absolute - dash.time = timeSrv.timeRange(); - // remove panel queries & links - dash.forEachPanel(function(panel) { - panel.targets = []; - panel.links = []; - }); - // remove annotations - dash.annotations.list = []; - // remove template queries - _.each(dash.templating.list, function(variable) { - variable.query = ""; - variable.options = []; - variable.refresh = false; - }); - - // cleanup snapshotData - delete $scope.dashboard.snapshot; - $scope.dashboard.forEachPanel(function(panel) { - delete panel.snapshotData; - }); + $scope.scrubDashboard(dash); var cmdData = { dashboard: dash, @@ -99,6 +77,38 @@ function (angular, _) { }); }; + $scope.scrubDashboard = function(dash) { + // change title + dash.title = $scope.snapshot.name; + // make relative times absolute + dash.time = timeSrv.timeRange(); + // remove panel queries & links + dash.forEachPanel(function(panel) { + panel.targets = []; + panel.links = []; + }); + // remove annotations + dash.annotations.list = []; + // remove template queries + _.each(dash.templating.list, function(variable) { + variable.query = ""; + variable.options = []; + variable.refresh = false; + }); + + // snapshot single panel + if ($scope.modeSharePanel) { + var singlePanel = dash.getPanelById($scope.panel.id); + dash.rows = [{ height: '500px', span: 12, panels: [singlePanel] }]; + } + + // cleanup snapshotData + delete $scope.dashboard.snapshot; + $scope.dashboard.forEachPanel(function(panel) { + delete panel.snapshotData; + }); + }; + $scope.saveExternalSnapshotRef = function(cmdData, results) { // save external in local instance as well cmdData.external = true; diff --git a/public/app/features/panel/soloPanelCtrl.js b/public/app/features/panel/soloPanelCtrl.js index 9068c8f60e8..02727694e41 100644 --- a/public/app/features/panel/soloPanelCtrl.js +++ b/public/app/features/panel/soloPanelCtrl.js @@ -49,7 +49,7 @@ function (angular, $) { $scope.test = "Hej"; $scope.$index = 0; - $scope.panel = $scope.getPanelById(panelId); + $scope.panel = $scope.dashboard.getPanelById(panelId); if (!$scope.panel) { $scope.appEvent('alert-error', ['Panel not found', '']); @@ -63,20 +63,6 @@ function (angular, $) { templateValuesSrv.init($scope.dashboard, $scope.dashboardViewState); }; - $scope.getPanelById = function(id) { - var rows = $scope.dashboard.rows; - for (var i = 0; i < rows.length; i++) { - var row = rows[i]; - for (var j = 0; j < row.panels.length; j++) { - var panel = row.panels[j]; - if (panel.id === id) { - return panel; - } - } - } - return null; - }; - if (!$scope.skipAutoInit) { $scope.init(); } diff --git a/public/test/specs/helpers.js b/public/test/specs/helpers.js index 94c79b57f96..a0f7c186331 100644 --- a/public/test/specs/helpers.js +++ b/public/test/specs/helpers.js @@ -44,6 +44,7 @@ define([ self.scope.panel = {}; self.scope.row = { panels:[] }; self.scope.dashboard = {}; + self.scope.dashboardMeta = {}; self.scope.dashboardViewState = new DashboardViewStateStub(); self.scope.appEvent = sinon.spy(); self.scope.onAppEvent = sinon.spy(); diff --git a/public/test/specs/shareModalCtrl-specs.js b/public/test/specs/shareModalCtrl-specs.js index 40a2b2d868c..f7493f52ad0 100644 --- a/public/test/specs/shareModalCtrl-specs.js +++ b/public/test/specs/shareModalCtrl-specs.js @@ -4,7 +4,7 @@ define([ ], function(helpers) { 'use strict'; - describe('SharePanelCtrl', function() { + describe('ShareModalCtrl', function() { var ctx = new helpers.ControllerTestContext(); function setTime(range) { @@ -26,7 +26,7 @@ define([ setTime({ from: 'now-1h', to: 'now' }); - ctx.scope.buildUrl(); + ctx.scope.init(); expect(ctx.scope.shareUrl).to.be('http://server/#/test?from=now-1h&to=now&panelId=22&fullscreen'); }); @@ -35,24 +35,23 @@ define([ ctx.scope.panel = { id: 22 }; setTime({ from: 1362178800000, to: 1396648800000 }); - ctx.scope.buildUrl(); + ctx.scope.init(); expect(ctx.scope.shareUrl).to.be('http://server/#/test?from=1362178800000&to=1396648800000&panelId=22&fullscreen'); }); - it('should remove panel id when toPanel is false', function() { + it('should remove panel id when no panel in scope', function() { ctx.$location.path('/test'); - ctx.scope.panel = { id: 22 }; - ctx.scope.options = { toPanel: false, forCurrent: true }; + ctx.scope.options = { forCurrent: true }; + ctx.scope.panel = null; setTime({ from: 'now-1h', to: 'now' }); - ctx.scope.buildUrl(); + ctx.scope.init(); expect(ctx.scope.shareUrl).to.be('http://server/#/test?from=now-1h&to=now'); }); it('should include template variables in url', function() { ctx.$location.path('/test'); - ctx.scope.panel = { id: 22 }; - ctx.scope.options = { includeTemplateVars: true, toPanel: false, forCurrent: true }; + ctx.scope.options = { includeTemplateVars: true, forCurrent: true }; ctx.templateSrv.variables = [{ name: 'app', current: {text: 'mupp' }}, {name: 'server', current: {text: 'srv-01'}}]; setTime({ from: 'now-1h', to: 'now' });