Fix #3985 Hide cell toolbar for markdown cells (#3987)

* Fix #3985 Hide cell toolbar for markdown cells
* Note that I'm still hiding the overall toolbar section per UX feedback
* Also now hiding line numbers per UX feedback..
This commit is contained in:
Kevin Cunnane
2019-02-08 16:38:28 -08:00
committed by GitHub
parent 7dd32ed44b
commit b964dd0895
5 changed files with 35 additions and 6 deletions

View File

@@ -37,6 +37,7 @@ export class QueryTextEditor extends BaseTextEditor {
private _config: editorCommon.IConfiguration;
private _minHeight: number;
private _selected: boolean;
private _hideLineNumbers: boolean;
private _editorWorkspaceConfig;
private _scrollbarHeight: number;
constructor(
@@ -78,6 +79,9 @@ export class QueryTextEditor extends BaseTextEditor {
if (!this._selected) {
options.renderLineHighlight = 'none';
}
if (this._hideLineNumbers) {
options.lineNumbers = 'off';
}
}
return options;
}
@@ -169,6 +173,11 @@ export class QueryTextEditor extends BaseTextEditor {
this.refreshEditorConfguration();
}
public set hideLineNumbers(value: boolean) {
this._hideLineNumbers = value;
this.refreshEditorConfguration();
}
private refreshEditorConfguration(configuration = this.configurationService.getValue<IEditorConfiguration>(this.getResource())): void {
if (!this.getControl()) {
return;

View File

@@ -31,8 +31,11 @@ import { IModelService } from 'vs/editor/common/services/modelService';
import { IContextMenuService, IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { INotificationService } from 'vs/platform/notification/common/notification';
import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
import { CellTypes } from 'sql/parts/notebook/models/contracts';
import { OVERRIDE_EDITOR_THEMING_SETTING } from 'sql/workbench/services/notebook/common/notebookService';
export const CODE_SELECTOR: string = 'code-component';
const MARKDOWN_CLASS = 'markdown';
@Component({
selector: CODE_SELECTOR,
@@ -42,7 +45,18 @@ export class CodeComponent extends AngularDisposable implements OnInit, OnChange
@ViewChild('toolbar', { read: ElementRef }) private toolbarElement: ElementRef;
@ViewChild('moreactions', { read: ElementRef }) private moreActionsElementRef: ElementRef;
@ViewChild('editor', { read: ElementRef }) private codeElement: ElementRef;
@Input() cellModel: ICellModel;
public get cellModel(): ICellModel {
return this._cellModel;
}
@Input() public set cellModel(value: ICellModel) {
this._cellModel = value;
if (this.toolbarElement && value && value.cellType === CellTypes.Markdown) {
let nativeToolbar = <HTMLElement> this.toolbarElement.nativeElement;
DOM.addClass(nativeToolbar, MARKDOWN_CLASS);
}
}
@Output() public onContentChanged = new EventEmitter<void>();
@@ -62,13 +76,12 @@ export class CodeComponent extends AngularDisposable implements OnInit, OnChange
}
}
protected _actionBar: Taskbar;
private readonly _minimumHeight = 30;
private _cellModel: ICellModel;
private _editor: QueryTextEditor;
private _editorInput: UntitledEditorInput;
private _editorModel: ITextModel;
private _uri: string;
private _model: NotebookModel;
private _activeCellId: string;
private _cellToggleMoreActions: CellToggleMoreActions;
@@ -143,6 +156,10 @@ export class CodeComponent extends AngularDisposable implements OnInit, OnChange
let isActive = this.cellModel.id === this._activeCellId;
this._editor.toggleEditorSelected(isActive);
// For markdown cells, don't show line numbers unless we're using editor defaults
let overrideEditorSetting = this._configurationService.getValue<boolean>(OVERRIDE_EDITOR_THEMING_SETTING);
this._editor.hideLineNumbers = (overrideEditorSetting && this.cellModel.cellType === CellTypes.Markdown);
this._register(this._editor);
this._register(this._editorInput);
this._register(this._editorModel.onDidChangeContent(e => {

View File

@@ -19,6 +19,10 @@ code-component .toolbar {
orientation: portrait
}
code-component .toolbar.markdown {
display: none;
}
code-component .toolbar .carbon-taskbar {
position: sticky;
top: 0px;

View File

@@ -24,6 +24,7 @@ export const INotebookService = createDecorator<INotebookService>(SERVICE_ID);
export const DEFAULT_NOTEBOOK_PROVIDER = 'builtin';
export const DEFAULT_NOTEBOOK_FILETYPE = 'IPYNB';
export const SQL_NOTEBOOK_PROVIDER = 'sql';
export const OVERRIDE_EDITOR_THEMING_SETTING = 'notebook.overrideEditorTheming';
export interface INotebookService {
_serviceBrand: any;

View File

@@ -12,7 +12,7 @@ import { Registry } from 'vs/platform/registry/common/platform';
import {
INotebookService, INotebookManager, INotebookProvider, DEFAULT_NOTEBOOK_PROVIDER,
DEFAULT_NOTEBOOK_FILETYPE, INotebookEditor, SQL_NOTEBOOK_PROVIDER
DEFAULT_NOTEBOOK_FILETYPE, INotebookEditor, SQL_NOTEBOOK_PROVIDER, OVERRIDE_EDITOR_THEMING_SETTING
} from 'sql/workbench/services/notebook/common/notebookService';
import { RenderMimeRegistry } from 'sql/parts/notebook/outputs/registry';
import { standardRendererFactories } from 'sql/parts/notebook/outputs/factories';
@@ -39,8 +39,6 @@ import { IConfigurationService } from 'vs/platform/configuration/common/configur
import { IThemeService } from 'vs/platform/theme/common/themeService';
import { registerNotebookThemes } from 'sql/parts/notebook/notebookStyles';
const OVERRIDE_EDITOR_THEMING_SETTING = 'notebook.overrideEditorTheming';
export interface NotebookProviderProperties {
provider: string;
fileExtensions: string[];