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

big improvement to fullscreen edit/view mode

Browse Source
This commit is contained in:
Torkel Ödegaard 2014-01-03 12:46:36 +01:00
parent aa8c881471
commit 0bf055e379
6 changed files with 22 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,7 +1,7 @@
<div ng-controller='graphite' <div ng-controller='graphite'
ng-init="init()" ng-init="init()"
style="min-height:{{panel.height || row.height}}" style="min-height:{{panel.height || row.height}}"
ng-class='{"panel-fullscreen": showFullscreen}'> ng-class='{"panel-fullscreen": fullscreen}'>
<style> <style>
.histogram-legend { .histogram-legend {

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

@ -240,7 +240,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}; };
$scope.remove_panel_from_row = function(row, panel) { $scope.remove_panel_from_row = function(row, panel) {
if ($scope.showFullscreen) { if ($scope.fullscreen) {
$rootScope.$emit('panel-fullscreen-exit'); $rootScope.$emit('panel-fullscreen-exit');
} }
else { else {
@ -385,7 +385,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
var closeEditMode = $rootScope.$on('panel-fullscreen-exit', function() { var closeEditMode = $rootScope.$on('panel-fullscreen-exit', function() {
$scope.inEditMode = false; $scope.inEditMode = false;
$scope.showFullscreen = false; $scope.fullscreen = false;
$scope.row.height = oldHeight; $scope.row.height = oldHeight;
closeEditMode(); closeEditMode();
@ -395,8 +395,10 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}); });
}); });
$(window).scrollTop(0);
$scope.inEditMode = options.edit; $scope.inEditMode = options.edit;
$scope.showFullscreen = true; $scope.fullscreen = true;
$rootScope.$emit('panel-fullscreen-enter'); $rootScope.$emit('panel-fullscreen-enter');
$timeout(function() { $timeout(function() {
@ -405,7 +407,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}; };
$scope.openConfigureModal = function() { $scope.openConfigureModal = function() {
if ($scope.showFullscreen) { if ($scope.fullscreen) {
$rootScope.$emit('panel-fullscreen-exit'); $rootScope.$emit('panel-fullscreen-exit');
return; return;
} }
@ -457,7 +459,7 @@ function (angular, app, $, _, kbn, moment, timeSeries) {
}; };
$scope.toggleFullscreen = function(evt) { $scope.toggleFullscreen = function(evt) {
if ($scope.showFullscreen) { if ($scope.fullscreen) {
$rootScope.$emit('panel-fullscreen-exit'); $rootScope.$emit('panel-fullscreen-exit');
return; return;
} }

2
src/app/partials/dashboard.html
View File

@ -12,8 +12,6 @@
<div class="container-fluid main" ng-class="{'grafana-dashboard-hide-controls': dashboard.current.hideControls}"> <div class="container-fluid main" ng-class="{'grafana-dashboard-hide-controls': dashboard.current.hideControls}">
<div class="row-fluid"> <div class="row-fluid">
<div class="row-fluid container" style="margin-top:10px; width:98%"> <div class="row-fluid container" style="margin-top:10px; width:98%">
<div ng-show="fullscreenPanelExists" class="modal-backdrop fade in"></div>
<!-- Rows --> <!-- Rows -->
<div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboard.current.rows" ng-style="row_style(row)"> <div class="row-fluid kibana-row" ng-controller="RowCtrl" ng-repeat="(row_name, row) in dashboard.current.rows" ng-style="row_style(row)">
<div class="row-control"> <div class="row-control">

2
src/css/bootstrap.dark.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
src/index.html
View File

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

17
src/vendor/bootstrap/less/grafana.less vendored
View File

@ -122,18 +122,25 @@
.panel-fullscreen { .panel-fullscreen {
z-index: 1500; z-index: 1500;
display: block; display: block important;
position: fixed; position: fixed;
left: 20px; left: 0px;
right: 20px; right: 0px;
top: 25px; top: 49px;
bottom: 25px; bottom: 0px;
outline: 1px solid #101214; outline: 1px solid #101214;
border-top: 1px solid #3e444c; border-top: 1px solid #3e444c;
padding: 0 10px; padding: 0 10px;
background: @kibanaPanelBackground; background: @kibanaPanelBackground;
} }
.dashboard-fullscreen .container-fluid.main {
height: 0px;
width: 0px;
position: fixed;
right: -10000px;
}
.grafana-legend-container { .grafana-legend-container {
margin: 4px 15px; margin: 4px 15px;
text-align: left; text-align: left;