IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

improved going in and out of fullscreen/edit mode

Browse Source
This commit is contained in:
Torkel Ödegaard 2014-01-03 17:35:41 +01:00
parent 0bf055e379
commit fc2718e7e4
4 changed files with 25 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/controllers/dash.js
View File

@ -66,11 +66,11 @@ function (angular, $, config, _) {
$scope.bindKeyboardShortcuts = function() { $scope.bindKeyboardShortcuts = function() {
$rootScope.$on('panel-fullscreen-enter', function() { $rootScope.$on('panel-fullscreen-enter', function() {
$scope.fullscreenPanelExists = true; $rootScope.fullscreen = true;
}); });
$rootScope.$on('panel-fullscreen-exit', function() { $rootScope.$on('panel-fullscreen-exit', function() {
$scope.fullscreenPanelExists = false; $rootScope.fullscreen = false;
}); });
keyboardManager.bind('ctrl+f', function(evt) { keyboardManager.bind('ctrl+f', function(evt) {

2
src/app/panels/graphite/module.html
View File

@ -54,7 +54,7 @@
<div ng-include="'app/panels/graphite/legend.html'"></div> <div ng-include="'app/panels/graphite/legend.html'"></div>
</div> </div>
<div class="panel-full-edit-tabs" ng-if="inEditMode"> <div class="panel-full-edit-tabs" ng-if="editMode">
<div ng-model="editor.index" bs-tabs> <div ng-model="editor.index" bs-tabs>
<div ng-repeat="tab in editorTabs" data-title="{{tab}}"> <div ng-repeat="tab in editorTabs" data-title="{{tab}}">
</div> </div>

54
src/app/panels/graphite/module.js
View File

@ -214,6 +214,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.init = function() { $scope.init = function() {
// Hide view options by default // Hide view options by default
$scope.fullscreen = false;
$scope.options = false; $scope.options = false;
$scope.editor = {index: 1}; $scope.editor = {index: 1};
$scope.editorTabs = _.union(['General'],_.pluck($scope.panelMeta.fullEditorTabs,'title')); $scope.editorTabs = _.union(['General'],_.pluck($scope.panelMeta.fullEditorTabs,'title'));
@ -381,23 +382,26 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.enterFullscreenMode = function(options) { $scope.enterFullscreenMode = function(options) {
var oldHeight = $scope.row.height; var oldHeight = $scope.row.height;
var docHeight = $(window).height(); var docHeight = $(window).height();
$scope.row.height = options.edit ? 200 : Math.floor(docHeight * 0.7); $scope.row.height = options.edit ? 200 : Math.floor(docHeight * 0.7);
$scope.editMode = options.edit;
var closeEditMode = $rootScope.$on('panel-fullscreen-exit', function() { if (!$scope.fullscreen) {
$scope.inEditMode = false; var closeEditMode = $rootScope.$on('panel-fullscreen-exit', function() {
$scope.fullscreen = false; $scope.editMode = false;
$scope.row.height = oldHeight; $scope.fullscreen = false;
$scope.row.height = oldHeight;
closeEditMode(); closeEditMode();
$timeout(function() { $timeout(function() {
$scope.$emit('render'); $scope.dashboard.refresh();
});
}); });
}); }
$(window).scrollTop(0); $(window).scrollTop(0);
$scope.inEditMode = options.edit;
$scope.fullscreen = true; $scope.fullscreen = true;
$rootScope.$emit('panel-fullscreen-enter'); $rootScope.$emit('panel-fullscreen-enter');
@ -407,7 +411,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}; };
$scope.openConfigureModal = function() { $scope.openConfigureModal = function() {
if ($scope.fullscreen) { if ($scope.editMode) {
$rootScope.$emit('panel-fullscreen-exit'); $rootScope.$emit('panel-fullscreen-exit');
return; return;
} }
@ -415,18 +419,6 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
$scope.enterFullscreenMode({edit: true}); $scope.enterFullscreenMode({edit: true});
}; };
$scope.set_refresh = function (state) {
$scope.refresh = state;
};
$scope.close_edit = function() {
if($scope.refresh) {
$scope.get_data();
}
$scope.refresh = false;
$scope.$emit('render');
};
$scope.render = function() { $scope.render = function() {
$scope.$emit('render'); $scope.$emit('render');
}; };
@ -458,20 +450,12 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
} }
}; };
$scope.toggleFullscreen = function(evt) { $scope.toggleFullscreen = function() {
if ($scope.fullscreen) { if ($scope.fullscreen && !$scope.editMode) {
$rootScope.$emit('panel-fullscreen-exit'); $rootScope.$emit('panel-fullscreen-exit');
return; return;
} }
if (evt) {
var elem = $(evt.target);
if (!elem.hasClass('panel-extra') ||
elem.attr('ng-click')) {
return;
}
}
$scope.enterFullscreenMode({edit: false}); $scope.enterFullscreenMode({edit: false});
}; };
@ -488,7 +472,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}); });
module.directive('histogramChart', function(filterSrv) { module.directive('histogramChart', function(filterSrv, $rootScope) {
return { return {
restrict: 'A', restrict: 'A',
template: '<div> </div>', template: '<div> </div>',
@ -497,6 +481,10 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
var hiddenData = {}; var hiddenData = {};
scope.$on('refresh',function() { scope.$on('refresh',function() {
if ($rootScope.fullscreen && !scope.fullscreen) {
return;
}
scope.get_data(); scope.get_data();
}); });

2
src/index.html
View File

@ -41,7 +41,7 @@
</div> </div>
</div> </div>
<div ng-view ng-class="{'dashboard-fullscreen': fullscreenPanelExists}"></div> <div ng-view ng-class="{'dashboard-fullscreen': fullscreen}"></div>
</body> </body>
</html> </html>