mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-30 01:25:38 -05:00
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:
@@ -3,8 +3,8 @@
|
||||
* Licensed under the Source EULA. See License.txt in the project root for license information.
|
||||
*--------------------------------------------------------------------------------------------*/
|
||||
|
||||
import { localize } from 'vs/nls';
|
||||
import { Action } from 'vs/base/common/actions';
|
||||
|
||||
import { INotebookEditor, INotebookService } from 'sql/workbench/services/notebook/browser/notebookService';
|
||||
import { CodeEditorWidget } from 'vs/editor/browser/widget/codeEditorWidget';
|
||||
import { IRange } from 'vs/editor/common/core/range';
|
||||
@@ -13,7 +13,7 @@ import { TextModel } from 'vs/editor/common/model/textModel';
|
||||
import { ICellModel } from 'sql/workbench/services/notebook/browser/models/modelInterfaces';
|
||||
import { QueryTextEditor } from 'sql/workbench/browser/modelComponents/queryTextEditor';
|
||||
import { Selection } from 'vs/editor/common/core/selection';
|
||||
|
||||
import { ToggleableAction } from 'sql/workbench/contrib/notebook/browser/notebookActions';
|
||||
|
||||
|
||||
// Action to decorate markdown
|
||||
@@ -390,3 +390,40 @@ export enum MarkdownLineType {
|
||||
EVERY_LINE,
|
||||
WRAPPED_ABOVE_AND_BELOW
|
||||
}
|
||||
|
||||
export class TogglePreviewAction extends ToggleableAction {
|
||||
|
||||
private static readonly previewShowLabel = localize('previewShowLabel', "Show Preview");
|
||||
private static readonly previewHideLabel = localize('previewHideLabel', "Hide Preview");
|
||||
private static readonly baseClass = 'codicon';
|
||||
private static readonly previewShowCssClass = 'split-toggle-on';
|
||||
private static readonly previewHideCssClass = 'split-toggle-off';
|
||||
private static readonly maskedIconClass = 'masked-icon';
|
||||
|
||||
constructor(
|
||||
id: string, toggleTooltip: boolean, showPreview: boolean
|
||||
) {
|
||||
super(id, {
|
||||
baseClass: TogglePreviewAction.baseClass,
|
||||
toggleOffLabel: TogglePreviewAction.previewShowLabel,
|
||||
toggleOffClass: TogglePreviewAction.previewShowCssClass,
|
||||
toggleOnLabel: TogglePreviewAction.previewHideLabel,
|
||||
toggleOnClass: TogglePreviewAction.previewHideCssClass,
|
||||
maskedIconClass: TogglePreviewAction.maskedIconClass,
|
||||
shouldToggleTooltip: toggleTooltip,
|
||||
isOn: showPreview
|
||||
});
|
||||
}
|
||||
|
||||
public get previewMode(): boolean {
|
||||
return this.state.isOn;
|
||||
}
|
||||
public set previewMode(value: boolean) {
|
||||
this.toggle(value);
|
||||
}
|
||||
public async run(context: any): Promise<boolean> {
|
||||
this.previewMode = !this.previewMode;
|
||||
context.cellModel.showPreview = this.previewMode;
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user