Skip to content

Commit d760fde

Browse files
committed
1 parent 7900444 commit d760fde

2 files changed

Lines changed: 44 additions & 27 deletions

File tree

src/vs/workbench/contrib/notebook/browser/view/notebookCellList.ts

Lines changed: 34 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import { CellRevealPosition, CellRevealType, CursorAtBoundary, getVisibleCells,
2323
import { CellViewModel, NotebookViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/notebookViewModel';
2424
import { diff, IProcessedOutput, NOTEBOOK_EDITOR_CURSOR_BOUNDARY, CellKind } from 'vs/workbench/contrib/notebook/common/notebookCommon';
2525
import { clamp } from 'vs/base/common/numbers';
26+
import { SCROLLABLE_ELEMENT_PADDING_TOP } from 'vs/workbench/contrib/notebook/browser/constants';
2627

2728
export class NotebookCellList extends WorkbenchList<CellViewModel> implements IDisposable, IStyleController, INotebookCellList {
2829
get onWillScroll(): Event<ScrollEvent> { return this.view.onWillScroll; }
@@ -546,28 +547,35 @@ export class NotebookCellList extends WorkbenchList<CellViewModel> implements ID
546547
super.domFocus();
547548
}
548549

550+
getViewScrollTop() {
551+
return this.view.getScrollTop();
552+
}
553+
554+
getViewScrollBottom() {
555+
return this.getViewScrollTop() + this.view.renderHeight - SCROLLABLE_ELEMENT_PADDING_TOP;
556+
}
557+
549558
private _revealRange(viewIndex: number, range: Range, revealType: CellRevealType, newlyCreated: boolean, alignToBottom: boolean) {
550559
const element = this.view.element(viewIndex);
551-
const scrollTop = this.view.getScrollTop();
552-
const wrapperBottom = scrollTop + this.view.renderHeight;
553-
const startLineNumber = range.startLineNumber;
554-
const lineOffset = element.getLineScrollTopOffset(startLineNumber);
560+
const scrollTop = this.getViewScrollTop();
561+
const wrapperBottom = this.getViewScrollBottom();
562+
const positionOffset = element.getPositionScrollTopOffset(range.startLineNumber, range.startColumn);
555563
const elementTop = this.view.elementTop(viewIndex);
556-
const lineTop = elementTop + lineOffset;
564+
const positionTop = elementTop + positionOffset;
557565

558566
// TODO@rebornix 30 ---> line height * 1.5
559-
if (lineTop < scrollTop) {
560-
this.view.setScrollTop(lineTop - 30);
561-
} else if (lineTop > wrapperBottom) {
562-
this.view.setScrollTop(scrollTop + lineTop - wrapperBottom + 30);
567+
if (positionTop < scrollTop) {
568+
this.view.setScrollTop(positionTop - 30);
569+
} else if (positionTop > wrapperBottom) {
570+
this.view.setScrollTop(scrollTop + positionTop - wrapperBottom + 30);
563571
} else if (newlyCreated) {
564572
// newly scrolled into view
565573
if (alignToBottom) {
566574
// align to the bottom
567-
this.view.setScrollTop(scrollTop + lineTop - wrapperBottom + 30);
575+
this.view.setScrollTop(scrollTop + positionTop - wrapperBottom + 30);
568576
} else {
569577
// align to to top
570-
this.view.setScrollTop(lineTop - 30);
578+
this.view.setScrollTop(positionTop - 30);
571579
}
572580
}
573581

@@ -580,8 +588,8 @@ export class NotebookCellList extends WorkbenchList<CellViewModel> implements ID
580588
// For example, we scroll item 10 into the view upwards, in the first round, items 7, 8, 9, 10 are all in the viewport. Then item 7 and 8 resize themselves to be larger and finally item 10 is removed from the view.
581589
// To ensure that item 10 is always there, we need to scroll item 10 to the top edge of the viewport.
582590
private _revealRangeInternal(viewIndex: number, range: Range, revealType: CellRevealType) {
583-
const scrollTop = this.view.getScrollTop();
584-
const wrapperBottom = scrollTop + this.view.renderHeight;
591+
const scrollTop = this.getViewScrollTop();
592+
const wrapperBottom = this.getViewScrollBottom();
585593
const elementTop = this.view.elementTop(viewIndex);
586594
const element = this.view.element(viewIndex);
587595

@@ -624,9 +632,9 @@ export class NotebookCellList extends WorkbenchList<CellViewModel> implements ID
624632
private _revealRangeInCenterInternal(viewIndex: number, range: Range, revealType: CellRevealType) {
625633
const reveal = (viewIndex: number, range: Range, revealType: CellRevealType) => {
626634
const element = this.view.element(viewIndex);
627-
let lineOffset = element.getLineScrollTopOffset(range.startLineNumber);
628-
let lineOffsetInView = this.view.elementTop(viewIndex) + lineOffset;
629-
this.view.setScrollTop(lineOffsetInView - this.view.renderHeight / 2);
635+
let positionOffset = element.getPositionScrollTopOffset(range.startLineNumber, range.startColumn);
636+
let positionOffsetInView = this.view.elementTop(viewIndex) + positionOffset;
637+
this.view.setScrollTop(positionOffsetInView - this.view.renderHeight / 2);
630638

631639
if (revealType === CellRevealType.Range) {
632640
element.revealRangeInCenter(range);
@@ -656,24 +664,25 @@ export class NotebookCellList extends WorkbenchList<CellViewModel> implements ID
656664
private _revealRangeInCenterIfOutsideViewportInternal(viewIndex: number, range: Range, revealType: CellRevealType) {
657665
const reveal = (viewIndex: number, range: Range, revealType: CellRevealType) => {
658666
const element = this.view.element(viewIndex);
659-
let lineOffset = element.getLineScrollTopOffset(range.startLineNumber);
660-
let lineOffsetInView = this.view.elementTop(viewIndex) + lineOffset;
661-
this.view.setScrollTop(lineOffsetInView - this.view.renderHeight / 2);
667+
let positionOffset = element.getPositionScrollTopOffset(range.startLineNumber, range.startColumn);
668+
let positionOffsetInView = this.view.elementTop(viewIndex) + positionOffset;
669+
this.view.setScrollTop(positionOffsetInView - this.view.renderHeight / 2);
662670

663671
if (revealType === CellRevealType.Range) {
664672
element.revealRangeInCenter(range);
665673
}
666674
};
667675

668-
const scrollTop = this.view.getScrollTop();
669-
const wrapperBottom = scrollTop + this.view.renderHeight;
676+
const scrollTop = this.getViewScrollTop();
677+
const wrapperBottom = this.getViewScrollBottom();
670678
const elementTop = this.view.elementTop(viewIndex);
671679
const viewItemOffset = elementTop;
672680
const element = this.view.element(viewIndex);
681+
const positionOffset = viewItemOffset + element.getPositionScrollTopOffset(range.startLineNumber, range.startColumn);
673682

674-
if (viewItemOffset < scrollTop || viewItemOffset > wrapperBottom) {
683+
if (positionOffset < scrollTop || positionOffset > wrapperBottom) {
675684
// let it render
676-
this.view.setScrollTop(viewItemOffset - this.view.renderHeight / 2);
685+
this.view.setScrollTop(positionOffset - this.view.renderHeight / 2);
677686

678687
// after rendering, it might be pushed down due to markdown cell dynamic height
679688
const elementTop = this.view.elementTop(viewIndex);
@@ -708,8 +717,8 @@ export class NotebookCellList extends WorkbenchList<CellViewModel> implements ID
708717
return;
709718
}
710719

711-
const scrollTop = this.view.getScrollTop();
712-
const wrapperBottom = scrollTop + this.view.renderHeight;
720+
const scrollTop = this.getViewScrollTop();
721+
const wrapperBottom = this.getViewScrollBottom();
713722
const elementTop = this.view.elementTop(viewIndex);
714723

715724
if (ignoreIfInsideViewport && elementTop >= scrollTop && elementTop < wrapperBottom) {

src/vs/workbench/contrib/notebook/browser/viewModel/baseCellViewModel.ts

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { IPosition } from 'vs/editor/common/core/position';
1212
import * as editorCommon from 'vs/editor/common/editorCommon';
1313
import * as model from 'vs/editor/common/model';
1414
import { SearchParams } from 'vs/editor/common/model/textModelSearch';
15-
import { EDITOR_TOOLBAR_HEIGHT, EDITOR_TOP_MARGIN } from 'vs/workbench/contrib/notebook/browser/constants';
15+
import { EDITOR_TOP_PADDING } from 'vs/workbench/contrib/notebook/browser/constants';
1616
import { CellEditState, CellFocusMode, CursorAtBoundary, CellViewModelStateChangeEvent, IEditableCellViewModel } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
1717
import { CellKind, NotebookCellMetadata, NotebookDocumentMetadata } from 'vs/workbench/contrib/notebook/common/notebookCommon';
1818
import { NotebookCellTextModel } from 'vs/workbench/contrib/notebook/common/model/notebookCellTextModel';
@@ -279,7 +279,15 @@ export abstract class BaseCellViewModel extends Disposable {
279279
return 0;
280280
}
281281

282-
return this._textEditor.getTopForLineNumber(line) + EDITOR_TOP_MARGIN + EDITOR_TOOLBAR_HEIGHT;
282+
return this._textEditor.getTopForLineNumber(line) + EDITOR_TOP_PADDING;
283+
}
284+
285+
getPositionScrollTopOffset(line: number, column: number): number {
286+
if (!this._textEditor) {
287+
return 0;
288+
}
289+
290+
return this._textEditor.getTopForPosition(line, column) + EDITOR_TOP_PADDING;
283291
}
284292

285293
cursorAtBoundary(): CursorAtBoundary {

0 commit comments

Comments
 (0)