Markdown toolbar > Preview toggle feature (#10963)

* Added toggle preview button to Markdown toolbar. Revised components, theme and styles to present the preview as a second column beside the markdown.

* Added showPreview to model and began working on togglePreview.

* Uncommented use of cellModel.showPreview

* add cell model event for onPreviewChange

* Renamed my showPreview boolean to prevent confusion with local boolean used in toogglePreview.

* Added CSS class when preview is enabled. Adjusted styles accordingly.

* Swapped icon show/hide references for correct sequence. Modified updatePreview to include state of doShowPreview.

* Added check for isEditMode so we can run togglePreview and show it once editor closes.

* Added listener to code.component that triggers layoutEmitter on changes to peview.

* Renamed local boolean doShowPreview. Removed unneeded code. Fixed ambiguity in my use of booleans, adding a getter and setter to textCell.

* Cleaned up implementation of new get/set for toggling preview.

Co-authored-by: chlafreniere <hichise@gmail.com>
This commit is contained in:
Hale Rankin
2020-06-26 13:47:17 -07:00
committed by GitHub
parent 00fe535add
commit 7ef8acf04e
11 changed files with 130 additions and 35 deletions

View File

@@ -56,6 +56,8 @@ export class CellModel implements ICellModel {
private _isCollapsed: boolean;
private _onCollapseStateChanged = new Emitter<boolean>();
private _modelContentChangedEvent: IModelContentChangedEvent;
private _showPreview: boolean = true;
private _onCellPreviewChanged = new Emitter<boolean>();
constructor(cellData: nb.ICellContents,
private _options: ICellModelOptions,
@@ -275,6 +277,21 @@ export class CellModel implements ICellModel {
this._stdInVisible = val;
}
public get showPreview(): boolean {
return this._showPreview;
}
public set showPreview(val: boolean) {
if (val !== this._showPreview) {
this._showPreview = val;
this._onCellPreviewChanged.fire(this._showPreview);
}
}
public get onCellPreviewChanged(): Event<boolean> {
return this._onCellPreviewChanged.event;
}
private notifyExecutionComplete(): void {
if (this._notebookService) {
this._notebookService.serializeNotebookStateChange(this.notebookModel.notebookUri, NotebookChangeType.CellExecuted, this)

View File

@@ -461,6 +461,8 @@ export interface ICellModel {
readonly onCellModeChanged: Event<boolean>;
modelContentChangedEvent: IModelContentChangedEvent;
isEditMode: boolean;
showPreview: boolean;
readonly onCellPreviewChanged: Event<boolean>;
sendChangeToNotebook(change: NotebookChangeType): void;
}