#3973: Persist scroll position when tab notebooks (#4531)

* #3973: Persist scroll position when tab notebooks

* Remove getter and setter
This commit is contained in:
Raj
2019-03-19 14:01:24 -07:00
committed by GitHub
parent 5e72cd12d1
commit 833d197412
2 changed files with 18 additions and 1 deletions

View File

@@ -7,7 +7,7 @@
<div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: column"> <div style="overflow: hidden; width: 100%; height: 100%; display: flex; flex-flow: column">
<div #toolbar class="editor-toolbar actionbar-container" style="flex: 0 0 auto; display: flex; flex-flow: row; width: 100%; align-items: center;"> <div #toolbar class="editor-toolbar actionbar-container" style="flex: 0 0 auto; display: flex; flex-flow: row; width: 100%; align-items: center;">
</div> </div>
<div class="scrollable" style="flex: 1 1 auto; position: relative" (click)="unselectActiveCell()"> <div #container class="scrollable" style="flex: 1 1 auto; position: relative" (click)="unselectActiveCell()" (scroll)="scrollHandler($event)">
<loading-spinner [loading]="isLoading"></loading-spinner> <loading-spinner [loading]="isLoading"></loading-spinner>
<div class="notebook-cell" *ngFor="let cell of cells" (click)="selectCell(cell, $event)" [class.active]="cell.active"> <div class="notebook-cell" *ngFor="let cell of cells" (click)="selectCell(cell, $event)" [class.active]="cell.active">
<code-cell-component *ngIf="cell.cellType === 'code'" [cellModel]="cell" [model]="model" [activeCellId]="activeCellId"> <code-cell-component *ngIf="cell.cellType === 'code'" [cellModel]="cell" [model]="model" [activeCellId]="activeCellId">

View File

@@ -51,6 +51,7 @@ export const NOTEBOOK_SELECTOR: string = 'notebook-component';
}) })
export class NotebookComponent extends AngularDisposable implements OnInit, OnDestroy, INotebookEditor { export class NotebookComponent extends AngularDisposable implements OnInit, OnDestroy, INotebookEditor {
@ViewChild('toolbar', { read: ElementRef }) private toolbar: ElementRef; @ViewChild('toolbar', { read: ElementRef }) private toolbar: ElementRef;
@ViewChild('container', { read: ElementRef }) private container: ElementRef;
private _model: NotebookModel; private _model: NotebookModel;
private _isInErrorState: boolean = false; private _isInErrorState: boolean = false;
private _errorMessage: string; private _errorMessage: string;
@@ -62,6 +63,7 @@ export class NotebookComponent extends AngularDisposable implements OnInit, OnDe
private profile: IConnectionProfile; private profile: IConnectionProfile;
private _trustedAction: TrustedAction; private _trustedAction: TrustedAction;
private _providerRelatedActions: IAction[] = []; private _providerRelatedActions: IAction[] = [];
private _scrollTop: number;
constructor( constructor(
@@ -112,6 +114,7 @@ export class NotebookComponent extends AngularDisposable implements OnInit, OnDe
this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this)); this._register(this.themeService.onDidColorThemeChange(this.updateTheme, this));
this.updateTheme(this.themeService.getColorTheme()); this.updateTheme(this.themeService.getColorTheme());
this.initActionBar(); this.initActionBar();
this.setScrollPosition();
this.doLoad(); this.doLoad();
} }
@@ -157,6 +160,11 @@ export class NotebookComponent extends AngularDisposable implements OnInit, OnDe
} }
} }
//Saves scrollTop value on scroll change
public scrollHandler(event: Event){
this._scrollTop = event.srcElement.scrollTop;
}
public unselectActiveCell() { public unselectActiveCell() {
if (this.model && this.model.activeCell) { if (this.model && this.model.activeCell) {
this.model.activeCell.active = false; this.model.activeCell.active = false;
@@ -201,6 +209,15 @@ export class NotebookComponent extends AngularDisposable implements OnInit, OnDe
} }
} }
private setScrollPosition(): void {
if (this._notebookParams && this._notebookParams.input) {
this._notebookParams.input.layoutChanged(() => {
let containerElement = <HTMLElement>this.container.nativeElement;
containerElement.scrollTop = this._scrollTop;
});
}
}
private async doLoad(): Promise<void> { private async doLoad(): Promise<void> {
try { try {
await this.setNotebookManager(); await this.setNotebookManager();