Skip to content

Commit 790a8d2

Browse files
rebornixrebornix
committed
remove builder from reference widget. microsoft#57196.
1 parent 19d01dd commit 790a8d2

1 file changed

Lines changed: 77 additions & 85 deletions

File tree

‎src/vs/editor/contrib/referenceSearch/referencesWidget.ts‎

Lines changed: 77 additions & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@
44
*--------------------------------------------------------------------------------------------*/
55
'use strict';
66

7-
import { $, Builder } from 'vs/base/browser/builder';
87
import * as dom from 'vs/base/browser/dom';
98
import { IKeyboardEvent } from 'vs/base/browser/keyboardEvent';
109
import { IMouseEvent } from 'vs/base/browser/mouseEvent';
@@ -308,7 +307,7 @@ class FileReferencesTemplate {
308307
container.appendChild(parent);
309308
this.file = new IconLabel(parent);
310309

311-
this.badge = new CountBadge($('.count').appendTo(parent).getHTMLElement());
310+
this.badge = new CountBadge(dom.append(parent, dom.$('.count')));
312311
const styler = attachBadgeStyler(this.badge, themeService);
313312

314313
this.dispose = () => {
@@ -517,13 +516,13 @@ export class ReferenceWidget extends PeekViewWidget {
517516
private _onDidSelectReference = new Emitter<SelectionEvent>();
518517

519518
private _tree: WorkbenchTree;
520-
private _treeContainer: Builder;
519+
private _treeContainer: HTMLElement;
521520
private _sash: VSash;
522521
private _preview: ICodeEditor;
523522
private _previewModelReference: IReference<ITextEditorModel>;
524523
private _previewNotAvailableMessage: TextModel;
525-
private _previewContainer: Builder;
526-
private _messageContainer: Builder;
524+
private _previewContainer: HTMLElement;
525+
private _messageContainer: HTMLElement;
527526

528527
constructor(
529528
editor: ICodeEditor,
@@ -583,96 +582,87 @@ export class ReferenceWidget extends PeekViewWidget {
583582
}
584583

585584
protected _fillBody(containerElement: HTMLElement): void {
586-
let container = $(containerElement);
587-
588585
this.setCssClass('reference-zone-widget');
589586

590587
// message pane
591-
container.div({ 'class': 'messages' }, div => {
592-
this._messageContainer = div.hide();
593-
});
588+
this._messageContainer = dom.append(containerElement, dom.$('div.messages'));
589+
dom.hide(this._messageContainer);
594590

595591
// editor
596-
container.div({ 'class': 'preview inline' }, (div: Builder) => {
597-
598-
let options: IEditorOptions = {
599-
scrollBeyondLastLine: false,
600-
scrollbar: {
601-
verticalScrollbarSize: 14,
602-
horizontal: 'auto',
603-
useShadows: true,
604-
verticalHasArrows: false,
605-
horizontalHasArrows: false
606-
},
607-
overviewRulerLanes: 2,
608-
fixedOverflowWidgets: true,
609-
minimap: {
610-
enabled: false
611-
}
612-
};
613-
614-
this._preview = this._instantiationService.createInstance(EmbeddedCodeEditorWidget, div.getHTMLElement(), options, this.editor);
615-
this._previewContainer = div.hide();
616-
this._previewNotAvailableMessage = TextModel.createFromString(nls.localize('missingPreviewMessage', "no preview available"));
617-
});
592+
this._previewContainer = dom.append(containerElement, dom.$('div.preview.inline'));
593+
let options: IEditorOptions = {
594+
scrollBeyondLastLine: false,
595+
scrollbar: {
596+
verticalScrollbarSize: 14,
597+
horizontal: 'auto',
598+
useShadows: true,
599+
verticalHasArrows: false,
600+
horizontalHasArrows: false
601+
},
602+
overviewRulerLanes: 2,
603+
fixedOverflowWidgets: true,
604+
minimap: {
605+
enabled: false
606+
}
607+
};
608+
this._preview = this._instantiationService.createInstance(EmbeddedCodeEditorWidget, this._previewContainer, options, this.editor);
609+
dom.hide(this._previewContainer);
610+
this._previewNotAvailableMessage = TextModel.createFromString(nls.localize('missingPreviewMessage', "no preview available"));
618611

619612
// sash
620613
this._sash = new VSash(containerElement, this.layoutData.ratio || .8);
621614
this._sash.onDidChangePercentages(() => {
622615
let [left, right] = this._sash.percentages;
623-
this._previewContainer.style({ width: left });
624-
this._treeContainer.style({ width: right });
616+
this._previewContainer.style.width = left;
617+
this._treeContainer.style.width = right;
625618
this._preview.layout();
626619
this._tree.layout();
627620
this.layoutData.ratio = this._sash.ratio;
628621
});
629622

630623
// tree
631-
container.div({ 'class': 'ref-tree inline' }, (div: Builder) => {
632-
let controller = this._instantiationService.createInstance(Controller, { keyboardSupport: this._defaultTreeKeyboardSupport, clickBehavior: ClickBehavior.ON_MOUSE_UP /* our controller already deals with this */ });
633-
this._callOnDispose.push(controller);
634-
635-
let config = <tree.ITreeConfiguration>{
636-
dataSource: this._instantiationService.createInstance(DataSource),
637-
renderer: this._instantiationService.createInstance(Renderer),
638-
controller,
639-
accessibilityProvider: new AriaProvider()
640-
};
641-
642-
let options: tree.ITreeOptions = {
643-
twistiePixels: 20,
644-
ariaLabel: nls.localize('treeAriaLabel', "References")
645-
};
646-
647-
this._tree = this._instantiationService.createInstance(WorkbenchTree, div.getHTMLElement(), config, options);
648-
649-
ctxReferenceWidgetSearchTreeFocused.bindTo(this._tree.contextKeyService);
650-
651-
// listen on selection and focus
652-
let onEvent = (element: any, kind: 'show' | 'goto' | 'side') => {
653-
if (element instanceof OneReference) {
654-
if (kind === 'show') {
655-
this._revealReference(element, false);
656-
}
657-
this._onDidSelectReference.fire({ element, kind, source: 'tree' });
658-
}
659-
};
660-
this._disposables.push(this._tree.onDidChangeFocus(event => {
661-
if (event && event.payload && event.payload.origin === 'keyboard') {
662-
onEvent(event.focus, 'show'); // only handle events from keyboard, mouse/touch is handled by other listeners below
663-
}
664-
}));
665-
this._disposables.push(this._tree.onDidChangeSelection(event => {
666-
if (event && event.payload && event.payload.origin === 'keyboard') {
667-
onEvent(event.selection[0], 'goto'); // only handle events from keyboard, mouse/touch is handled by other listeners below
668-
}
669-
}));
670-
this._disposables.push(controller.onDidFocus(element => onEvent(element, 'show')));
671-
this._disposables.push(controller.onDidSelect(element => onEvent(element, 'goto')));
672-
this._disposables.push(controller.onDidOpenToSide(element => onEvent(element, 'side')));
624+
this._treeContainer = dom.append(containerElement, dom.$('div.ref-tree.inline'));
625+
let controller = this._instantiationService.createInstance(Controller, { keyboardSupport: this._defaultTreeKeyboardSupport, clickBehavior: ClickBehavior.ON_MOUSE_UP /* our controller already deals with this */ });
626+
this._callOnDispose.push(controller);
627+
628+
let config = <tree.ITreeConfiguration>{
629+
dataSource: this._instantiationService.createInstance(DataSource),
630+
renderer: this._instantiationService.createInstance(Renderer),
631+
controller,
632+
accessibilityProvider: new AriaProvider()
633+
};
673634

674-
this._treeContainer = div.hide();
675-
});
635+
let treeOptions: tree.ITreeOptions = {
636+
twistiePixels: 20,
637+
ariaLabel: nls.localize('treeAriaLabel', "References")
638+
};
639+
640+
this._tree = this._instantiationService.createInstance(WorkbenchTree, this._treeContainer, config, treeOptions);
641+
642+
ctxReferenceWidgetSearchTreeFocused.bindTo(this._tree.contextKeyService);
643+
644+
// listen on selection and focus
645+
let onEvent = (element: any, kind: 'show' | 'goto' | 'side') => {
646+
if (element instanceof OneReference) {
647+
if (kind === 'show') {
648+
this._revealReference(element, false);
649+
}
650+
this._onDidSelectReference.fire({ element, kind, source: 'tree' });
651+
}
652+
};
653+
this._disposables.push(this._tree.onDidChangeFocus(event => {
654+
if (event && event.payload && event.payload.origin === 'keyboard') {
655+
onEvent(event.focus, 'show'); // only handle events from keyboard, mouse/touch is handled by other listeners below
656+
}
657+
}));
658+
this._disposables.push(this._tree.onDidChangeSelection(event => {
659+
if (event && event.payload && event.payload.origin === 'keyboard') {
660+
onEvent(event.selection[0], 'goto'); // only handle events from keyboard, mouse/touch is handled by other listeners below
661+
}
662+
}));
663+
this._disposables.push(controller.onDidFocus(element => onEvent(element, 'show')));
664+
this._disposables.push(controller.onDidSelect(element => onEvent(element, 'goto')));
665+
this._disposables.push(controller.onDidOpenToSide(element => onEvent(element, 'side')));
676666
}
677667

678668
protected _doLayoutBody(heightInPixel: number, widthInPixel: number): void {
@@ -684,9 +674,10 @@ export class ReferenceWidget extends PeekViewWidget {
684674

685675
// set height/width
686676
const [left, right] = this._sash.percentages;
687-
this._previewContainer.style({ height, width: left });
688-
this._treeContainer.style({ height, width: right });
689-
677+
this._previewContainer.style.height = height;
678+
this._previewContainer.style.width = left;
679+
this._treeContainer.style.height = height;
680+
this._treeContainer.style.width = right;
690681
// forward
691682
this._tree.layout(heightInPixel);
692683
this._preview.layout();
@@ -726,11 +717,12 @@ export class ReferenceWidget extends PeekViewWidget {
726717

727718
if (this._model.empty) {
728719
this.setTitle('');
729-
this._messageContainer.innerHtml(nls.localize('noResults', "No results")).show();
720+
this._messageContainer.innerHTML = nls.localize('noResults', "No results");
721+
dom.show(this._messageContainer);
730722
return TPromise.as(void 0);
731723
}
732724

733-
this._messageContainer.hide();
725+
dom.hide(this._messageContainer);
734726
this._decorationsManager = new DecorationsManager(this._preview, this._model);
735727
this._disposeOnNewModel.push(this._decorationsManager);
736728

@@ -751,8 +743,8 @@ export class ReferenceWidget extends PeekViewWidget {
751743

752744
// make sure things are rendered
753745
dom.addClass(this.container, 'results-loaded');
754-
this._treeContainer.show();
755-
this._previewContainer.show();
746+
dom.show(this._treeContainer);
747+
dom.show(this._previewContainer);
756748
this._preview.layout();
757749
this._tree.layout();
758750
this.focus();

0 commit comments

Comments
 (0)