mirror of
https://github.com/grafana/grafana.git
synced 2024-11-27 19:30:36 -06:00
Merge branch 'load_on_Scroll' of git://github.com/jifwin/grafana into jifwin-load_on_Scroll
This commit is contained in:
commit
08b2edf98c
@ -36,6 +36,7 @@ export class DashboardModel {
|
||||
meta: any;
|
||||
events: any;
|
||||
editMode: boolean;
|
||||
loadOnScroll: boolean;
|
||||
|
||||
constructor(data, meta?) {
|
||||
if (!data) {
|
||||
@ -64,6 +65,7 @@ export class DashboardModel {
|
||||
this.version = data.version || 0;
|
||||
this.links = data.links || [];
|
||||
this.gnetId = data.gnetId || null;
|
||||
this.loadOnScroll = data.loadOnScroll || false;
|
||||
|
||||
this.rows = [];
|
||||
if (data.rows) {
|
||||
|
@ -61,6 +61,12 @@
|
||||
checked="dashboard.hideControls"
|
||||
label-class="width-11">
|
||||
</gf-form-switch>
|
||||
<gf-form-switch class="gf-form"
|
||||
label="Load on scroll"
|
||||
tooltip="Load panels as they become visible"
|
||||
checked="dashboard.loadOnScroll"
|
||||
label-class="width-11">
|
||||
</gf-form-switch>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -12,6 +12,8 @@ import * as dateMath from 'app/core/utils/datemath';
|
||||
import {Subject} from 'vendor/npm/rxjs/Subject';
|
||||
|
||||
class MetricsPanelCtrl extends PanelCtrl {
|
||||
scope: any;
|
||||
needsRefresh: boolean;
|
||||
loading: boolean;
|
||||
datasource: any;
|
||||
datasourceName: any;
|
||||
@ -40,6 +42,8 @@ class MetricsPanelCtrl extends PanelCtrl {
|
||||
this.datasourceSrv = $injector.get('datasourceSrv');
|
||||
this.timeSrv = $injector.get('timeSrv');
|
||||
this.templateSrv = $injector.get('templateSrv');
|
||||
this.scope = $scope;
|
||||
this.needsRefresh = false;
|
||||
|
||||
if (!this.panel.targets) {
|
||||
this.panel.targets = [{}];
|
||||
@ -50,6 +54,10 @@ class MetricsPanelCtrl extends PanelCtrl {
|
||||
this.events.on('panel-teardown', this.onPanelTearDown.bind(this));
|
||||
}
|
||||
|
||||
private isRenderGraph () {
|
||||
return window.location.href.indexOf("/dashboard-solo/") === 0;
|
||||
}
|
||||
|
||||
private onPanelTearDown() {
|
||||
if (this.dataSubscription) {
|
||||
this.dataSubscription.unsubscribe();
|
||||
@ -66,6 +74,14 @@ class MetricsPanelCtrl extends PanelCtrl {
|
||||
// ignore fetching data if another panel is in fullscreen
|
||||
if (this.otherPanelInFullscreenMode()) { return; }
|
||||
|
||||
if (this.scope.ctrl.dashboard.loadOnScroll) {
|
||||
if (!this.scope.$$childHead || (!this.scope.$$childHead.isVisible() && !this.isRenderGraph())) {
|
||||
this.scope.$$childHead.needsRefresh = true;
|
||||
return;
|
||||
}
|
||||
this.scope.$$childHead.needsRefresh = false;
|
||||
}
|
||||
|
||||
// if we have snapshot data use that
|
||||
if (this.panel.snapshotData) {
|
||||
this.updateTimeRange();
|
||||
|
@ -57,7 +57,7 @@ var panelTemplate = `
|
||||
</div>
|
||||
`;
|
||||
|
||||
module.directive('grafanaPanel', function($rootScope) {
|
||||
module.directive('grafanaPanel', function($rootScope, $document, $timeout) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
template: panelTemplate,
|
||||
@ -183,6 +183,19 @@ module.directive('grafanaPanel', function($rootScope) {
|
||||
infoDrop.destroy();
|
||||
}
|
||||
});
|
||||
|
||||
scope.needsRefresh = false;
|
||||
|
||||
scope.isVisible = function () {
|
||||
var position = panelContainer[0].getBoundingClientRect();
|
||||
return (0 < position.top) && (position.top < window.innerHeight);
|
||||
};
|
||||
|
||||
$document.bind('scroll', _.debounce(function () {
|
||||
if (scope.ctrl.dashboard.loadOnScroll && scope.needsRefresh) {
|
||||
scope.ctrl.refresh();
|
||||
}
|
||||
}, 250));
|
||||
}
|
||||
};
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user