Merge the two scroll events

Have a single event that updates the scroll tops for both markdown cells and outputs
This commit is contained in:
Matt Bierner 2021-03-31 21:07:44 -07:00
parent 0e5ecf116f
commit 470e37c3d8
5 changed files with 26 additions and 50 deletions

View file

@ -270,7 +270,8 @@ export class NotebookTextDiffEditor extends EditorPane implements INotebookTextD
updateItems.push({
output: key,
cellTop: cellTop,
outputOffset: outputOffset
outputOffset: outputOffset,
forceDisplay: false
});
}
}
@ -280,7 +281,7 @@ export class NotebookTextDiffEditor extends EditorPane implements INotebookTextD
removedItems.forEach(output => activeWebview.removeInset(output));
if (updateItems.length) {
activeWebview.updateViewScrollTop(false, updateItems);
activeWebview.updateScrollTops(updateItems, []);
}
}
}
@ -577,7 +578,7 @@ export class NotebookTextDiffEditor extends EditorPane implements INotebookTextD
const cellTop = this._list.getAbsoluteTopOfElement(cellDiffViewModel);
const outputIndex = cellViewModel.outputsViewModels.indexOf(output.source);
const outputOffset = cellTop + cellDiffViewModel.getOutputOffsetInCell(diffSide, outputIndex);
activeWebview.updateViewScrollTop(true, [{ output: output.source, cellTop, outputOffset }]);
activeWebview.updateScrollTops([{ output: output.source, cellTop, outputOffset, forceDisplay: true }], []);
}
});
}
@ -623,7 +624,7 @@ export class NotebookTextDiffEditor extends EditorPane implements INotebookTextD
const cellTop = this._list.getAbsoluteTopOfElement(cellDiffViewModel);
const outputIndex = cellViewModel.outputsViewModels.indexOf(displayOutput);
const outputOffset = cellTop + cellDiffViewModel.getOutputOffsetInCell(diffSide, outputIndex);
activeWebview.updateViewScrollTop(true, [{ output: displayOutput, cellTop, outputOffset }]);
activeWebview.updateScrollTops([{ output: displayOutput, cellTop, outputOffset, forceDisplay: true }], []);
});
}

View file

@ -139,6 +139,7 @@ export interface IDisplayOutputLayoutUpdateRequest {
output: IDisplayOutputViewModel;
cellTop: number;
outputOffset: number;
forceDisplay: boolean;
}
export interface ICommonCellInfo {

View file

@ -1122,7 +1122,6 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
this._localStore.add(this._list.onWillScroll(e => {
if (this._webview?.isResolved()) {
this._webview.updateViewScrollTop(true, []);
this._webviewTransparentCover!.style.top = `${e.scrollTop}px`;
}
}));
@ -1172,18 +1171,14 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
updateItems.push({
output: key,
cellTop: cellTop,
outputOffset
outputOffset,
forceDisplay: false,
});
}
});
removedItems.forEach(output => this._webview?.removeInset(output));
if (updateItems.length) {
this._debug('_list.onDidChangeContentHeight/outputs', updateItems);
this._webview?.updateViewScrollTop(false, updateItems);
}
const markdownUpdateItems: { id: string, top: number }[] = [];
for (const cellId of this._webview.markdownPreviewMapping.keys()) {
const cell = this.viewModel?.viewCells.find(cell => cell.id === cellId);
@ -1193,9 +1188,9 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
}
}
if (markdownUpdateItems.length) {
if (markdownUpdateItems.length || updateItems.length) {
this._debug('_list.onDidChangeContentHeight/markdown', markdownUpdateItems);
this._webview?.updateMarkdownScrollTop(markdownUpdateItems);
this._webview?.updateScrollTops(updateItems, markdownUpdateItems);
}
});
}));
@ -1318,7 +1313,7 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
}
}
this._webview?.updateMarkdownScrollTop(offsetUpdateRequests);
this._webview?.updateScrollTops([], offsetUpdateRequests);
}
}
@ -2212,15 +2207,14 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditor
await this._resolveWebview();
}
const cellTop = this._list.getAbsoluteTopOfElement(cell);
if (!this._webview!.insetMapping.has(output.source)) {
const cellTop = this._list.getAbsoluteTopOfElement(cell);
await this._webview!.createOutput({ cellId: cell.id, cellHandle: cell.handle, cellUri: cell.uri }, output, cellTop, offset);
} else {
const cellTop = this._list.getAbsoluteTopOfElement(cell);
const outputIndex = cell.outputsViewModels.indexOf(output.source);
const outputOffset = cellTop + cell.getOutputOffset(outputIndex);
this._webview!.updateViewScrollTop(true, [{ output: output.source, cellTop, outputOffset }]);
this._webview!.updateScrollTops([{ output: output.source, cellTop, outputOffset, forceDisplay: true }], []);
}
});
}

View file

@ -188,17 +188,13 @@ export interface ICreationRequestMessage {
export interface IContentWidgetTopRequest {
id: string;
top: number;
forceDisplay: boolean;
}
export interface IViewScrollTopRequestMessage {
type: 'view-scroll';
forceDisplay: boolean;
widgets: IContentWidgetTopRequest[];
}
export interface IViewScrollMarkdownRequestMessage {
type: 'view-scroll-markdown';
cells: { id: string; top: number }[];
markdownPreviews: { id: string; top: number }[];
}
export interface IScrollRequestMessage {
@ -339,8 +335,7 @@ export type ToWebviewMessage =
| IHideMarkdownMessage
| IUnhideMarkdownMessage
| IUpdateSelectedMarkdownPreviews
| IInitializeMarkdownMessage
| IViewScrollMarkdownRequestMessage;
| IInitializeMarkdownMessage;
export type AnyMessage = FromWebviewMessage | ToWebviewMessage;
@ -1111,23 +1106,12 @@ var requirejs = (function() {
return true;
}
updateMarkdownScrollTop(items: { id: string, top: number }[]) {
if (this._disposed || !items.length) {
updateScrollTops(outputs: IDisplayOutputLayoutUpdateRequest[], markdownPreviews: { id: string, top: number }[]) {
if (this._disposed) {
return;
}
this._sendMessageToWebview({
type: 'view-scroll-markdown',
cells: items
});
}
updateViewScrollTop(forceDisplay: boolean, items: IDisplayOutputLayoutUpdateRequest[]) {
if (!items.length) {
return;
}
const widgets = coalesce(items.map((item): IContentWidgetTopRequest | undefined => {
const widgets = coalesce(outputs.map((item): IContentWidgetTopRequest | undefined => {
const outputCache = this.insetMapping.get(item.output);
if (!outputCache) {
return;
@ -1140,17 +1124,18 @@ var requirejs = (function() {
return {
id: id,
top: outputOffset,
forceDisplay: item.forceDisplay,
};
}));
if (!widgets.length) {
if (!widgets.length && !markdownPreviews.length) {
return;
}
this._sendMessageToWebview({
type: 'view-scroll',
forceDisplay,
widgets: widgets
widgets: widgets,
markdownPreviews,
});
}

View file

@ -691,18 +691,13 @@ function webviewPreloads() {
const widget = document.getElementById(request.id)!;
if (widget) {
widget.style.top = request.top + 'px';
if (event.data.forceDisplay) {
if (request.forceDisplay) {
widget.parentElement!.style.display = 'block';
}
}
}
break;
}
case 'view-scroll-markdown':
{
// const date = new Date();
// console.log(`${date.getSeconds()}:${date.getMilliseconds().toString().padStart(3, '0')}`, '[iframe]: view-scroll-markdown', event.data.cells);
for (const cell of event.data.cells) {
for (const cell of event.data.markdownPreviews) {
const widget = document.getElementById(`${cell.id}_preview`)!;
if (widget) {
widget.style.top = `${cell.top}px`;