Commit 4987a215 by Torkel Ödegaard

Lots of complicated code for dealing with panel state

parent 435a5a67
define([
'angular',
'lodash',
'jquery',
],
function (angular, _) {
function (angular, _, $) {
'use strict';
var module = angular.module('grafana.services');
module.factory('dashboardViewStateSrv', function($location, $route) {
module.factory('dashboardViewStateSrv', function($location, $timeout) {
// represents the transient view state
// like fullscreen panel & edit
......@@ -15,45 +16,127 @@ function (angular, _) {
var self = this;
$scope.onAppEvent('$routeUpdate', function() {
var current = $route.current.params;
console.log('Route updated', current);
if (self.fullscreen && !current.fullscreen) {
console.log('emit panel exit');
$scope.emitAppEvent('panel-fullscreen-exit');
}
if (!self.fullscreen && current.fullscreen) {
$scope.emitAppEvent('dashboard-view-state-mismatch', current);
var urlState = self.getQueryStringState();
if (self.needsSync(urlState)) {
self.update(urlState, true);
}
});
this.panelScopes = [];
this.$scope = $scope;
this.update(this.getQueryStringState(), true);
}
DashboardViewState.prototype.needsSync = function(urlState) {
if (urlState.fullscreen !== this.fullscreen) { return true; }
if (urlState.edit !== this.edit) { return true; }
if (urlState.panelId !== this.panelId) { return true; }
return false;
};
DashboardViewState.prototype.getQueryStringState = function() {
var queryParams = $location.search();
this.update({
panelId: parseInt(queryParams.panelId),
return {
panelId: parseInt(queryParams.panelId) || null,
fullscreen: queryParams.fullscreen ? true : false,
edit: queryParams.edit ? true : false
});
}
};
};
DashboardViewState.prototype.update = function(state, skipUrlSync) {
console.log('viewstate update: ', state);
DashboardViewState.prototype.update = function(state) {
_.extend(this, state);
if (!this.fullscreen) {
delete this.fullscreen;
delete this.panelId;
delete this.edit;
this.panelId = null;
this.edit = false;
}
if (!skipUrlSync) {
$location.search({
fullscreen: this.fullscreen ? true : null,
panelId: this.panelId,
edit: this.edit ? true : null
});
}
if (!this.edit) { delete this.edit; }
$location.search(this);
this.syncState();
};
DashboardViewState.prototype.test = function() {
DashboardViewState.prototype.syncState = function() {
if (this.panelScopes.length === 0) { return; }
if (this.fullscreen) {
if (this.fullscreenPanel) {
this.leaveFullscreen(false);
}
var panelScope = this.getPanelScope(this.panelId);
this.enterFullscreen(panelScope);
return;
}
if (this.fullscreenPanel) {
this.leaveFullscreen(true);
}
};
DashboardViewState.prototype.getPanelScope = function(id) {
return _.find(this.panelScopes, function(panelScope) {
return panelScope.panel.id === id;
});
};
DashboardViewState.prototype.leaveFullscreen = function(render) {
var self = this;
self.fullscreenPanel.editMode = false;
self.fullscreenPanel.fullscreen = false;
delete self.fullscreenPanel.height;
if (!render) { return false;}
$timeout(function() {
if (self.oldTimeRange !== self.fullscreenPanel.range) {
self.$scope.dashboard.emit_refresh();
}
else {
self.fullscreenPanel.$emit('render');
}
delete self.fullscreenPanel;
});
};
DashboardViewState.prototype.enterFullscreen = function(panelScope) {
var docHeight = $(window).height();
var editHeight = Math.floor(docHeight * 0.3);
var fullscreenHeight = Math.floor(docHeight * 0.7);
this.oldTimeRange = panelScope.range;
panelScope.height = this.edit ? editHeight : fullscreenHeight;
panelScope.editMode = this.edit;
this.fullscreenPanel = panelScope;
$(window).scrollTop(0);
panelScope.fullscreen = true;
$timeout(function() {
panelScope.$emit('render');
});
};
DashboardViewState.prototype.registerPanel = function(panelScope) {
this.panelScopes.push(panelScope);
var self = this;
self.panelScopes.push(panelScope);
if (self.panelId === panelScope.panel.id) {
self.enterFullscreen(panelScope);
}
panelScope.$on('$destroy', function() {
self.panelScopes = _.without(self.panelScopes, panelScope);
});
};
return {
......
......@@ -22,12 +22,12 @@ function (angular, _, $) {
},
{
text: 'Edit',
click: "toggleFullscreenEdit()",
click: "toggleFullscreen(true)",
condition: $scope.panelMeta.fullscreenEdit
},
{
text: "Fullscreen",
click: 'toggleFullscreen()',
click: 'toggleFullscreen(false)',
condition: $scope.panelMeta.fullscreenView
},
{
......@@ -135,22 +135,8 @@ function (angular, _, $) {
$scope.get_data();
};
$scope.toggleFullscreenEdit = function() {
if ($scope.editMode) {
$rootScope.$emit('panel-fullscreen-exit');
return;
}
$scope.enterFullscreenMode({edit: true});
};
$scope.toggleFullscreen = function() {
if ($scope.fullscreen && !$scope.editMode) {
$rootScope.$emit('panel-fullscreen-exit');
return;
}
$scope.enterFullscreenMode({ edit: false });
$scope.toggleFullscreen = function(edit) {
$scope.dashboardViewState.update({ fullscreen: true, edit: edit, panelId: $scope.panel.id });
};
$scope.otherPanelInFullscreenMode = function() {
......@@ -168,9 +154,6 @@ function (angular, _, $) {
$scope.setDatasource($scope.panel.datasource);
$scope.dashboardViewState.registerPanel($scope);
if ($scope.dashboardViewState.panelId === $scope.panel.id) {
$scope.enterFullscreenMode({edit: $scope.dashboardViewState.edit});
}
if ($scope.get_data) {
var panel_get_data = $scope.get_data;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment