' +
+ '' +
- '{{panel.title}}' +
- ''+
-
''+
'\n'+
'';
@@ -100,9 +96,7 @@ function (angular, $) {
$controllers.first().prepend(panelHeader);
$controllers.first().find('.panel-header').nextAll().wrapAll(content);
- $scope.require([
- 'panels/'+nameAsPath+'/module'
- ], function() {
+ $scope.require(['panels/' + nameAsPath + '/module'], function() {
loadModule($module);
});
} else {
@@ -110,6 +104,126 @@ function (angular, $) {
}
});
});
+
+
+ /*
+ /* Panel base functionality
+ /* */
+ newScope.initPanel = function(scope) {
+
+ scope.updateColumnSpan = function(span) {
+ scope.panel.span = span;
+
+ $timeout(function() {
+ scope.$emit('render');
+ });
+ };
+
+ function enterFullscreenMode(options) {
+ var docHeight = $(window).height();
+ var editHeight = Math.floor(docHeight * 0.3);
+ var fullscreenHeight = Math.floor(docHeight * 0.7);
+ var oldTimeRange = scope.range;
+
+ scope.height = options.edit ? editHeight : fullscreenHeight;
+ scope.editMode = options.edit;
+
+ if (!scope.fullscreen) {
+ var closeEditMode = $rootScope.$on('panel-fullscreen-exit', function() {
+ scope.editMode = false;
+ scope.fullscreen = false;
+ delete scope.height;
+
+ closeEditMode();
+
+ $timeout(function() {
+ if (oldTimeRange !== $scope.range) {
+ scope.dashboard.refresh();
+ }
+ else {
+ scope.$emit('render');
+ }
+ });
+ });
+ }
+
+ $(window).scrollTop(0);
+
+ scope.fullscreen = true;
+
+ $rootScope.$emit('panel-fullscreen-enter');
+
+ $timeout(function() {
+ scope.$emit('render');
+ });
+ }
+
+ scope.toggleFullscreenEdit = function() {
+ if (scope.editMode) {
+ $rootScope.$emit('panel-fullscreen-exit');
+ return;
+ }
+
+ enterFullscreenMode({edit: true});
+ };
+
+ $scope.toggleFullscreen = function() {
+ if (scope.fullscreen && !scope.editMode) {
+ $rootScope.$emit('panel-fullscreen-exit');
+ return;
+ }
+
+ enterFullscreenMode({ edit: false });
+ };
+
+ var menu = [
+ {
+ text: 'Edit',
+ configModal: "app/partials/paneleditor.html",
+ condition: !scope.panelMeta.fullscreenEdit
+ },
+ {
+ text: 'Edit',
+ click: "toggleFullscreenEdit()",
+ condition: scope.panelMeta.fullscreenEdit
+ },
+ {
+ text: "Fullscreen",
+ click: 'toggleFullscreen()',
+ condition: scope.panelMeta.fullscreenView
+ },
+ {
+ text: 'Duplicate',
+ click: 'duplicatePanel(panel)',
+ condition: true
+ },
+ {
+ text: 'Span',
+ submenu: [
+ { text: '1', click: 'updateColumnSpan(1)' },
+ { text: '2', click: 'updateColumnSpan(2)' },
+ { text: '3', click: 'updateColumnSpan(3)' },
+ { text: '4', click: 'updateColumnSpan(4)' },
+ { text: '5', click: 'updateColumnSpan(5)' },
+ { text: '6', click: 'updateColumnSpan(6)' },
+ { text: '7', click: 'updateColumnSpan(7)' },
+ { text: '8', click: 'updateColumnSpan(8)' },
+ { text: '9', click: 'updateColumnSpan(9)' },
+ { text: '10', click: 'updateColumnSpan(10)' },
+ { text: '11', click: 'updateColumnSpan(11)' },
+ { text: '12', click: 'updateColumnSpan(12)' },
+ ],
+ condition: true
+ },
+ {
+ text: 'Remove',
+ click: 'remove_panel_from_row(row, panel)',
+ condition: true
+ }
+ ];
+
+ scope.panelMeta.menu = _.where(menu, { condition: true });
+ };
}
};
});
diff --git a/src/app/panels/graphite/module.html b/src/app/panels/graphite/module.html
index 6f2bdd1f759..4c56568b993 100644
--- a/src/app/panels/graphite/module.html
+++ b/src/app/panels/graphite/module.html
@@ -2,13 +2,6 @@
ng-init="init()"
style="min-height:{{panel.height || row.height}}"
ng-class="{'panel-fullscreen': fullscreen}">
-
diff --git a/src/app/panels/graphite/module.js b/src/app/panels/graphite/module.js
index 91554c236da..2d5e45b2fac 100644
--- a/src/app/panels/graphite/module.js
+++ b/src/app/panels/graphite/module.js
@@ -39,7 +39,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.panelMeta = {
modals : [],
editorTabs: [],
-
fullEditorTabs : [
{
title: 'General',
@@ -57,30 +56,9 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
src:'app/panels/graphite/styleEditor.html'
}
],
-
- menuItems: [
- { text: 'Edit', click: 'openConfigureModal()' },
- { text: 'Fullscreen', click: 'toggleFullscreen()' },
- { text: 'Duplicate', click: 'duplicatePanel(panel)' },
- { text: 'Span', submenu: [
- { text: '1', click: 'updateColumnSpan(1)' },
- { text: '2', click: 'updateColumnSpan(2)' },
- { text: '3', click: 'updateColumnSpan(3)' },
- { text: '4', click: 'updateColumnSpan(4)' },
- { text: '5', click: 'updateColumnSpan(5)' },
- { text: '6', click: 'updateColumnSpan(6)' },
- { text: '7', click: 'updateColumnSpan(7)' },
- { text: '8', click: 'updateColumnSpan(8)' },
- { text: '9', click: 'updateColumnSpan(9)' },
- { text: '10', click: 'updateColumnSpan(10)' },
- { text: '11', click: 'updateColumnSpan(11)' },
- { text: '12', click: 'updateColumnSpan(12)' },
- ]},
- { text: 'Remove', click: 'remove_panel_from_row(row, panel)' }
- ],
-
- status : "Unstable",
- description : "Graphs panel"
+ fullscreenEdit: true,
+ fullscreenView: true,
+ description : "Graphing"
};
// Set and populate defaults
@@ -220,10 +198,10 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}
$scope.init = function() {
- // Hide view options by default
+ $scope.initPanel($scope);
+
$scope.fullscreen = false;
- $scope.options = false;
- $scope.editor = {index: 1};
+ $scope.editor = { index: 1 };
$scope.editorTabs = _.pluck($scope.panelMeta.fullEditorTabs,'title');
$scope.hiddenSeries = {};
@@ -239,15 +217,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.get_data();
};
- $scope.remove_panel_from_row = function(row, panel) {
- if ($scope.fullscreen) {
- $rootScope.$emit('panel-fullscreen-exit');
- }
- else {
- $scope.$parent.remove_panel_from_row(row, panel);
- }
- };
-
$scope.removeTarget = function (target) {
$scope.panel.targets = _.without($scope.panel.targets, target);
$scope.get_data();
@@ -284,13 +253,13 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.annotationsPromise = annotationsSrv.getAnnotations($scope.rangeUnparsed);
return $scope.datasource.query(graphiteQuery)
- .then($scope.receiveGraphiteData)
+ .then($scope.dataHandler)
.then(null, function(err) {
$scope.panel.error = err.message || "Graphite HTTP Request Error";
});
};
- $scope.receiveGraphiteData = function(results) {
+ $scope.dataHandler = function(results) {
$scope.panelMeta.loading = false;
$scope.legend = [];
@@ -300,44 +269,11 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
return;
}
- results = results.data;
- var data = [];
-
$scope.datapointsWarning = false;
$scope.datapointsCount = 0;
$scope.datapointsOutside = false;
- _.each(results, function(targetData) {
- var datapoints = targetData.datapoints;
- var alias = targetData.target;
- var color = $scope.panel.aliasColors[alias] || $scope.colors[data.length];
- var yaxis = $scope.panel.aliasYAxis[alias] || 1;
-
- var seriesInfo = {
- alias: alias,
- color: color,
- enable: true,
- yaxis: yaxis
- };
-
- var series = new timeSeries.ZeroFilled({
- datapoints: datapoints,
- info: seriesInfo,
- });
-
- if (datapoints && datapoints.length > 0) {
- var last = moment.utc(datapoints[datapoints.length - 1][1] * 1000);
- var from = moment.utc($scope.range.from);
- if (last - from < -1000) {
- $scope.datapointsOutside = true;
- }
- }
-
- $scope.datapointsCount += datapoints.length;
-
- $scope.legend.push(seriesInfo);
- data.push(series);
- });
+ var data = _.map(results.data, $scope.seriesHandler);
$scope.datapointsWarning = $scope.datapointsCount || !$scope.datapointsOutside;
@@ -350,53 +286,39 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
});
};
- $scope.add_target = function() {
- $scope.panel.targets.push({target: ''});
- };
+ $scope.seriesHandler = function(seriesData, index) {
+ var datapoints = seriesData.datapoints;
+ var alias = seriesData.target;
+ var color = $scope.panel.aliasColors[alias] || $scope.colors[index];
+ var yaxis = $scope.panel.aliasYAxis[alias] || 1;
+
+ var seriesInfo = {
+ alias: alias,
+ color: color,
+ enable: true,
+ yaxis: yaxis
+ };
- $scope.enterFullscreenMode = function(options) {
- var docHeight = $(window).height();
- var editHeight = Math.floor(docHeight * 0.3);
- var fullscreenHeight = Math.floor(docHeight * 0.7);
- var oldTimeRange = $scope.range;
-
- $scope.height = options.edit ? editHeight : fullscreenHeight;
- $scope.editMode = options.edit;
-
- if (!$scope.fullscreen) {
- var closeEditMode = $rootScope.$on('panel-fullscreen-exit', function() {
- $scope.editMode = false;
- $scope.fullscreen = false;
- delete $scope.height;
-
- closeEditMode();
-
- $timeout(function() {
- if (oldTimeRange !== $scope.range) {
- $scope.dashboard.refresh();
- }
- else {
- $scope.$emit('render');
- }
- });
- });
- }
+ var series = new timeSeries.ZeroFilled({
+ datapoints: datapoints,
+ info: seriesInfo,
+ });
- $(window).scrollTop(0);
+ if (datapoints && datapoints.length > 0) {
+ var last = moment.utc(datapoints[datapoints.length - 1][1] * 1000);
+ var from = moment.utc($scope.range.from);
+ if (last - from < -1000) {
+ $scope.datapointsOutside = true;
+ }
+ }
- $scope.fullscreen = true;
- $rootScope.$emit('panel-fullscreen-enter');
+ $scope.datapointsCount += datapoints.length;
- $timeout($scope.render);
+ return series;
};
- $scope.openConfigureModal = function() {
- if ($scope.editMode) {
- $rootScope.$emit('panel-fullscreen-exit');
- return;
- }
-
- $scope.enterFullscreenMode({edit: true});
+ $scope.add_target = function() {
+ $scope.panel.targets.push({target: ''});
};
$scope.otherPanelInFullscreenMode = function() {
@@ -413,15 +335,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.render();
};
- $scope.toggleFullscreen = function() {
- if ($scope.fullscreen && !$scope.editMode) {
- $rootScope.$emit('panel-fullscreen-exit');
- return;
- }
-
- $scope.enterFullscreenMode({edit: false});
- };
-
$scope.toggleSeries = function(info) {
if ($scope.hiddenSeries[info.alias]) {
delete $scope.hiddenSeries[info.alias];
@@ -444,11 +357,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.render();
};
- $scope.updateColumnSpan = function(span) {
- $scope.panel.span = span;
- $timeout($scope.render);
- };
-
});
diff --git a/src/app/panels/text/module.js b/src/app/panels/text/module.js
index 39e16f55599..063b59e88df 100644
--- a/src/app/panels/text/module.js
+++ b/src/app/panels/text/module.js
@@ -24,7 +24,6 @@ function (angular, app, _, require) {
module.controller('text', function($scope) {
$scope.panelMeta = {
- status : "Stable",
description : "A static text panel that can use plain text, markdown, or (sanitized) HTML"
};
@@ -45,6 +44,7 @@ function (angular, app, _, require) {
_.defaults($scope.panel,_d);
$scope.init = function() {
+ $scope.initPanel($scope);
$scope.ready = false;
};