Skip to content

Commit

Permalink
Move collapse-related code out of cellRenderer to a cell part #131808
Browse files Browse the repository at this point in the history
  • Loading branch information
roblourens committed Mar 16, 2022
1 parent e2d1be5 commit c79072c
Show file tree
Hide file tree
Showing 7 changed files with 161 additions and 112 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { BaseCellRenderTemplate } from 'vs/workbench/contrib/notebook/browser/vi
import { NotebookCellInternalMetadata } from 'vs/workbench/contrib/notebook/common/notebookCommon';

export class CellExecutionPart extends CellPart {
private kernelDisposables = new DisposableStore();
private kernelDisposables = this._register(new DisposableStore());
private currentCell: ICellViewModel | undefined;

constructor(
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
import * as DOM from 'vs/base/browser/dom';
import { FastDomNode } from 'vs/base/browser/fastDomNode';
import { DisposableStore } from 'vs/base/common/lifecycle';
import { ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CodeCellLayoutInfo, ICellViewModel, INotebookEditorDelegate } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellPart';
import { CellTitleToolbarPart } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellToolbars';
Expand Down Expand Up @@ -55,6 +55,19 @@ export class CellFocusIndicator extends CellPart {
this.currentElement.isOutputCollapsed = !this.currentElement.isOutputCollapsed;
}
}));

this._register(DOM.addDisposableListener(this.left.domNode, DOM.EventType.DBLCLICK, e => {
if (!this.currentElement || !this.notebookEditor.hasModel()) {
return;
}

const clickedOnInput = e.offsetY < (this.currentElement.layoutInfo as CodeCellLayoutInfo).outputContainerOffset;
if (clickedOnInput) {
this.currentElement.isInputCollapsed = !this.currentElement.isInputCollapsed;
} else {
this.currentElement.isOutputCollapsed = !this.currentElement.isOutputCollapsed;
}
}));
}

renderCell(element: ICellViewModel, templateData: BaseCellRenderTemplate): void {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,6 @@ import { CodeCellViewModel } from 'vs/workbench/contrib/notebook/browser/viewMod
import { INotebookCellStatusBarService } from 'vs/workbench/contrib/notebook/common/notebookCellStatusBarService';
import { INotebookExecutionStateService } from 'vs/workbench/contrib/notebook/common/notebookExecutionStateService';


export class CodeCell extends Disposable {
private _outputContainerRenderer: CellOutputContainer;

Expand Down Expand Up @@ -521,7 +520,6 @@ export class CodeCell extends Disposable {
this.viewCell.detachTextEditor();
this._removeInputCollapsePreview();
this._outputContainerRenderer.dispose();
this.templateData.focusIndicator.left.setHeight(0);
this._pendingLayout?.dispose();

super.dispose();
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/

import * as DOM from 'vs/base/browser/dom';
import { ICellViewModel, INotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellPart';
import { BaseCellRenderTemplate } from 'vs/workbench/contrib/notebook/browser/view/notebookRenderingCommon';

export class CollapsedCellInput extends CellPart {
private currentCell: ICellViewModel | undefined;

constructor(
private readonly notebookEditor: INotebookEditor,
cellInputCollapsedContainer: HTMLElement,
) {
super();

this._register(DOM.addDisposableListener(cellInputCollapsedContainer, DOM.EventType.DBLCLICK, e => {
if (!this.currentCell || !this.notebookEditor.hasModel()) {
return;
}

if (this.currentCell.isInputCollapsed) {
this.currentCell.isInputCollapsed = false;
} else {
this.currentCell.isOutputCollapsed = false;
}
}));

this._register(DOM.addDisposableListener(cellInputCollapsedContainer, DOM.EventType.CLICK, e => {
if (!this.currentCell || !this.notebookEditor.hasModel()) {
return;
}

const element = e.target as HTMLElement;

if (element && element.classList && element.classList.contains('expandInputIcon')) {
// clicked on the expand icon
this.currentCell.isInputCollapsed = false;
}
}));
}

renderCell(element: ICellViewModel, templateData: BaseCellRenderTemplate): void {
this.currentCell = element;
}

prepareLayout(): void {
}

updateInternalLayoutNow(element: ICellViewModel): void {
}

updateState(element: ICellViewModel, e: CellViewModelStateChangeEvent): void {
}
}

Original file line number Diff line number Diff line change
@@ -0,0 +1,75 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/

import * as DOM from 'vs/base/browser/dom';
import { Codicon, CSSIcon } from 'vs/base/common/codicons';
import { localize } from 'vs/nls';
import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
import { EXPAND_CELL_OUTPUT_COMMAND_ID, ICellViewModel, INotebookEditor } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellViewModelStateChangeEvent } from 'vs/workbench/contrib/notebook/browser/notebookViewEvents';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellPart';
import { BaseCellRenderTemplate } from 'vs/workbench/contrib/notebook/browser/view/notebookRenderingCommon';

const $ = DOM.$;

export class CollapsedCellOutput extends CellPart {
private currentCell: ICellViewModel | undefined;

constructor(
private readonly notebookEditor: INotebookEditor,
cellOutputCollapseContainer: HTMLElement,
@IKeybindingService keybindingService: IKeybindingService
) {
super();

const placeholder = DOM.append(cellOutputCollapseContainer, $('span.expandOutputPlaceholder')) as HTMLElement;
placeholder.textContent = localize('cellOutputsCollapsedMsg', "Outputs are collapsed");
const expandIcon = DOM.append(cellOutputCollapseContainer, $('span.expandOutputIcon'));
expandIcon.classList.add(...CSSIcon.asClassNameArray(Codicon.more));

const keybinding = keybindingService.lookupKeybinding(EXPAND_CELL_OUTPUT_COMMAND_ID);
if (keybinding) {
placeholder.title = localize('cellExpandOutputButtonLabelWithDoubleClick', "Double click to expand cell output ({0})", keybinding.getLabel());
cellOutputCollapseContainer.title = localize('cellExpandOutputButtonLabel', "Expand Cell Output (${0})", keybinding.getLabel());
}

DOM.hide(cellOutputCollapseContainer);

this._register(DOM.addDisposableListener(expandIcon, DOM.EventType.CLICK, () => this.expand()));
this._register(DOM.addDisposableListener(cellOutputCollapseContainer, DOM.EventType.DBLCLICK, () => this.expand()));
}

private expand() {
if (!this.currentCell) {
return;
}

if (!this.currentCell) {
return;
}

const textModel = this.notebookEditor.textModel!;
const index = textModel.cells.indexOf(this.currentCell.model);

if (index < 0) {
return;
}

this.currentCell.isOutputCollapsed = !this.currentCell.isOutputCollapsed;
}

renderCell(element: ICellViewModel, templateData: BaseCellRenderTemplate): void {
this.currentCell = element;
}

prepareLayout(): void {
}

updateInternalLayoutNow(element: ICellViewModel): void {
}

updateState(element: ICellViewModel, e: CellViewModelStateChangeEvent): void {
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,8 @@ import { Range } from 'vs/editor/common/core/range';
import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { ICellOutputViewModel, ICellViewModel } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
import { CellFocusIndicator } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellFocusIndicator';
import { CellPart } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellPart';
import { CellEditorStatusBar } from 'vs/workbench/contrib/notebook/browser/view/cellParts/cellStatusPart';
import { FoldedCellHint } from 'vs/workbench/contrib/notebook/browser/view/cellParts/foldedCellHint';
import { CellViewModel, NotebookViewModel } from 'vs/workbench/contrib/notebook/browser/viewModel/notebookViewModelImpl';
import { ICellRange } from 'vs/workbench/contrib/notebook/common/notebookRange';

Expand Down Expand Up @@ -101,7 +99,6 @@ export interface BaseCellRenderTemplate {
container: HTMLElement;
cellContainer: HTMLElement;
decorationContainer: HTMLElement;
focusIndicator: CellFocusIndicator;
readonly templateDisposables: DisposableStore;
readonly elementDisposables: DisposableStore;
currentRenderedCell?: ICellViewModel;
Expand All @@ -113,7 +110,6 @@ export interface BaseCellRenderTemplate {
export interface MarkdownCellRenderTemplate extends BaseCellRenderTemplate {
editorContainer: HTMLElement;
foldingIndicator: HTMLElement;
foldedCellHint: FoldedCellHint;
currentEditor?: ICodeEditor;
}

Expand Down
Loading

0 comments on commit c79072c

Please sign in to comment.