Skip to content

V
vscode

掘金者说 / vscode
与 Fork 源项目一致

从无法访问的项目Fork

通知 1
Star 0
Fork 0
V
vscode

体验新版 GitCode，发现更多精彩内容 >>

提交 ad972a1d 编写于 作者: B Benjamin Pasero
浏览文件
操作

debt - deprecate builder and remove usage in some places

上级 2f0a98d2
隐藏空白更改
内联 并排
Showing with 166 addition and 157 deletion
src/vs/base/browser/builder.ts
浏览文件 @ ad972a1d
......@@ -12,23 +12,9 @@ import * as assert from 'vs/base/common/assert';
import * as DOM from 'vs/base/browser/dom';
/**
* Welcome to the monaco builder. The recommended way to use it is:
* !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*
* import Builder = require('vs/base/browser/builder');
* let $ = Builder.$;
* $(....).fn(...);
*
* See below for examples how to invoke the $():
*
* $() - creates an offdom builder
* $(builder) - wraps the given builder
* $(builder[]) - wraps the given builders into a multibuilder
* $('div') - creates a div
* $('.big') - creates a div with class `big`
* $('#head') - creates a div with id `head`
* $('ul#head') - creates an unordered list with id `head`
* $('<a href="back"></a>') - constructs a builder from the given HTML
* $('a', { href: 'back'}) - constructs a builder, similarly to the Builder#element() call
* @deprecated !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*/
export interface QuickBuilder {
(): Builder;
......@@ -62,7 +48,9 @@ function hasData(element: any): boolean {
}
/**
* Wraps around the provided element to manipulate it and add more child elements.
* !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*
* @deprecated !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*/
export class Builder implements IDisposable {
private currentElement: HTMLElement;
......@@ -199,7 +187,7 @@ export class Builder implements IDisposable {
assert.ok(child, 'Need a child to append');
if (DOM.isHTMLElement(child)) {
child = withElement(child);
child = _withElement(child);
}
assert.ok(child instanceof Builder || child instanceof MultiBuilder, 'Need a child to append');
......@@ -1018,7 +1006,7 @@ export class Builder implements IDisposable {
* Allows to store arbritary data into the current element.
*/
setProperty(key: string, value: any): Builder {
setPropertyOnElement(this.currentElement, key, value);
_setPropertyOnElement(this.currentElement, key, value);
return this;
}
......@@ -1027,7 +1015,7 @@ export class Builder implements IDisposable {
* Allows to get arbritary data from the current element.
*/
getProperty(key: string, fallback?: any): any {
return getPropertyFromElement(this.currentElement, key, fallback);
return _getPropertyFromElement(this.currentElement, key, fallback);
}
/**
......@@ -1047,7 +1035,7 @@ export class Builder implements IDisposable {
child(index = 0): Builder {
let children = this.currentElement.children;
return withElement(<HTMLElement>children.item(index));
return _withElement(<HTMLElement>children.item(index));
}
/**
......@@ -1191,8 +1179,9 @@ export class Builder implements IDisposable {
}
/**
* The multi builder provides the same methods as the builder, but allows to call
* them on an array of builders.
* !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*
* @deprecated !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*/
export class MultiBuilder extends Builder {
......@@ -1215,7 +1204,7 @@ export class MultiBuilder extends Builder {
if (types.isArray(builders)) {
for (let i = 0; i < builders.length; i++) {
if (builders[i] instanceof HTMLElement) {
this.push(withElement(builders[i]));
this.push(_withElement(builders[i]));
} else {
this.push(builders[i]);
}
......@@ -1302,7 +1291,7 @@ function withBuilder(builder: Builder, offdom?: boolean): Builder {
return new Builder(builder.getHTMLElement(), offdom);
}
export function withElement(element: HTMLElement, offdom?: boolean): Builder {
export function _withElement(element: HTMLElement, offdom?: boolean): Builder {
return new Builder(element, offdom);
}
......@@ -1315,14 +1304,14 @@ function offDOM(): Builder {
/**
* Allows to store arbritary data into element.
*/
export function setPropertyOnElement(element: HTMLElement, key: string, value: any): void {
export function _setPropertyOnElement(element: HTMLElement, key: string, value: any): void {
data(element)[key] = value;
}
/**
* Allows to get arbritary data from element.
*/
export function getPropertyFromElement(element: HTMLElement, key: string, fallback?: any): any {
export function _getPropertyFromElement(element: HTMLElement, key: string, fallback?: any): any {
if (hasData(element)) {
let value = data(element)[key];
if (!types.isUndefined(value)) {
......@@ -1337,12 +1326,17 @@ export function getPropertyFromElement(element: HTMLElement, key: string, fallba
* Adds the provided object as property to the given element. Call getBinding()
* to retrieve it again.
*/
export function bindElement(element: HTMLElement, object: any): void {
setPropertyOnElement(element, DATA_BINDING_ID, object);
export function _bindElement(element: HTMLElement, object: any): void {
_setPropertyOnElement(element, DATA_BINDING_ID, object);
}
let SELECTOR_REGEX = /([\w\-]+)?(#([\w\-]+))?((.([\w\-]+))*)/;
/**
* !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*
* @deprecated !!! DO NOT USE. USE vs/base/browser/dom.$ INSTEAD !!!
*/
export const $: QuickBuilder = function (arg?: any): Builder {
// Off-DOM use
......@@ -1357,7 +1351,7 @@ export const $: QuickBuilder = function (arg?: any): Builder {
// Wrap the given element
if (DOM.isHTMLElement(arg) || arg === window) {
return withElement(arg);
return _withElement(arg);
}
// Wrap the given builders
......@@ -1386,14 +1380,14 @@ export const $: QuickBuilder = function (arg?: any): Builder {
element = container.firstChild;
container.removeChild(element);
return withElement(<HTMLElement>element);
return _withElement(<HTMLElement>element);
}
let builders: Builder[] = [];
while (container.firstChild) {
element = container.firstChild;
container.removeChild(element);
builders.push(withElement(<HTMLElement>element));
builders.push(_withElement(<HTMLElement>element));
}
return new MultiBuilder(builders);
......
src/vs/base/browser/ui/button/button.ts
浏览文件 @ ad972a1d
......@@ -7,14 +7,13 @@
import 'vs/css!./button';
import * as DOM from 'vs/base/browser/dom';
import { Builder, $ } from 'vs/base/browser/builder';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode } from 'vs/base/common/keyCodes';
import { Color } from 'vs/base/common/color';
import { mixin } from 'vs/base/common/objects';
import { Event as BaseEvent, Emitter } from 'vs/base/common/event';
import { Disposable } from 'vs/base/common/lifecycle';
import { Gesture, EventType } from 'vs/base/browser/touch';
import { Gesture } from 'vs/base/browser/touch';
export interface IButtonOptions extends IButtonStyles {
title?: boolean;
......@@ -35,7 +34,7 @@ const defaultOptions: IButtonStyles = {
export class Button extends Disposable {
private $el: Builder;
private $el: HTMLElement;
private options: IButtonOptions;
private buttonBackground: Color;
......@@ -59,50 +58,52 @@ export class Button extends Disposable {
this.buttonForeground = this.options.buttonForeground;
this.buttonBorder = this.options.buttonBorder;
this.$el = this._register($('a.monaco-button').attr({
'tabIndex': '0',
'role': 'button'
}).appendTo(container));
this.$el = document.createElement('a');
DOM.addClass(this.$el, 'monaco-button');
this.$el.tabIndex = 0;
this.$el.setAttribute('role', 'button');
Gesture.addTarget(this.$el.getHTMLElement());
container.appendChild(this.$el);
this.$el.on([DOM.EventType.CLICK, EventType.Tap], e => {
Gesture.addTarget(this.$el);
this._register(DOM.addDisposableListener(this.$el, DOM.EventType.CLICK, e => {
if (!this.enabled) {
DOM.EventHelper.stop(e);
return;
}
this._onDidClick.fire(e);
});
}));
this.$el.on(DOM.EventType.KEY_DOWN, e => {
this._register(DOM.addDisposableListener(this.$el, DOM.EventType.KEY_DOWN, e => {
const event = new StandardKeyboardEvent(e as KeyboardEvent);
let eventHandled = false;
if (this.enabled && event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
this._onDidClick.fire(e);
eventHandled = true;
} else if (event.equals(KeyCode.Escape)) {
this.$el.domBlur();
this.$el.blur();
eventHandled = true;
}
if (eventHandled) {
DOM.EventHelper.stop(event, true);
}
});
}));
this.$el.on(DOM.EventType.MOUSE_OVER, e => {
if (!this.$el.hasClass('disabled')) {
this._register(DOM.addDisposableListener(this.$el, DOM.EventType.MOUSE_OVER, e => {
if (!DOM.hasClass(this.$el, 'disabled')) {
this.setHoverBackground();
}
});
}));
this.$el.on(DOM.EventType.MOUSE_OUT, e => {
this._register(DOM.addDisposableListener(this.$el, DOM.EventType.MOUSE_OUT, e => {
this.applyStyles(); // restore standard styles
});
}));
// Also set hover background when button is focused for feedback
this.focusTracker = this._register(DOM.trackFocus(this.$el.getHTMLElement()));
this.focusTracker = this._register(DOM.trackFocus(this.$el));
this._register(this.focusTracker.onDidFocus(() => this.setHoverBackground()));
this._register(this.focusTracker.onDidBlur(() => this.applyStyles())); // restore standard styles
......@@ -112,7 +113,7 @@ export class Button extends Disposable {
private setHoverBackground(): void {
const hoverBackground = this.buttonHoverBackground ? this.buttonHoverBackground.toString() : null;
if (hoverBackground) {
this.$el.style('background-color', hoverBackground);
this.$el.style.backgroundColor = hoverBackground;
}
}
......@@ -131,53 +132,51 @@ export class Button extends Disposable {
const foreground = this.buttonForeground ? this.buttonForeground.toString() : null;
const border = this.buttonBorder ? this.buttonBorder.toString() : null;
this.$el.style('color', foreground);
this.$el.style('background-color', background);
this.$el.style.color = foreground;
this.$el.style.backgroundColor = background;
this.$el.style('border-width', border ? '1px' : null);
this.$el.style('border-style', border ? 'solid' : null);
this.$el.style('border-color', border);
this.$el.style.borderWidth = border ? '1px' : null;
this.$el.style.borderStyle = border ? 'solid' : null;
this.$el.style.borderColor = border;
}
}
get element(): HTMLElement {
return this.$el.getHTMLElement();
return this.$el;
}
set label(value: string) {
if (!this.$el.hasClass('monaco-text-button')) {
this.$el.addClass('monaco-text-button');
if (!DOM.hasClass(this.$el, 'monaco-text-button')) {
DOM.addClass(this.$el, 'monaco-text-button');
}
this.$el.text(value);
this.$el.innerText = value;
if (this.options.title) {
this.$el.title(value);
this.$el.title = value;
}
}
set icon(iconClassName: string) {
this.$el.addClass(iconClassName);
DOM.addClass(this.$el, iconClassName);
}
set enabled(value: boolean) {
if (value) {
this.$el.removeClass('disabled');
this.$el.attr({
'aria-disabled': 'false',
'tabIndex': '0'
});
DOM.removeClass(this.$el, 'disabled');
this.$el.setAttribute('aria-disabled', String(false));
this.$el.tabIndex = 0;
} else {
this.$el.addClass('disabled');
this.$el.attr('aria-disabled', String(true));
DOM.removeTabIndexAndUpdateFocus(this.$el.getHTMLElement());
DOM.addClass(this.$el, 'disabled');
this.$el.setAttribute('aria-disabled', String(true));
DOM.removeTabIndexAndUpdateFocus(this.$el);
}
}
get enabled() {
return !this.$el.hasClass('disabled');
return !DOM.hasClass(this.$el, 'disabled');
}
focus(): void {
this.$el.domFocus();
this.$el.focus();
}
}
......@@ -201,7 +200,7 @@ export class ButtonGroup extends Disposable {
// Implement keyboard access in buttons if there are multiple
if (count > 1) {
$(button.element).on(DOM.EventType.KEY_DOWN, e => {
this._register(DOM.addDisposableListener(button.element, DOM.EventType.KEY_DOWN, e => {
const event = new StandardKeyboardEvent(e as KeyboardEvent);
let eventHandled = true;
......@@ -219,7 +218,8 @@ export class ButtonGroup extends Disposable {
this._buttons[buttonIndexToFocus].focus();
DOM.EventHelper.stop(e, true);
}
}, this.toDispose);
}));
}
}
}
......
src/vs/base/browser/ui/progressbar/progressbar.ts
浏览文件 @ ad972a1d
......@@ -7,10 +7,11 @@
import 'vs/css!./progressbar';
import * as assert from 'vs/base/common/assert';
import { Builder, $ } from 'vs/base/browser/builder';
import { Disposable } from 'vs/base/common/lifecycle';
import { Color } from 'vs/base/common/color';
import { mixin } from 'vs/base/common/objects';
import { removeClasses, addClass, hasClass, addClasses, removeClass, hide, show } from 'vs/base/browser/dom';
import { RunOnceScheduler } from 'vs/base/common/async';
const css_done = 'done';
const css_active = 'active';
......@@ -36,10 +37,11 @@ const defaultOpts = {
export class ProgressBar extends Disposable {
private options: IProgressBarOptions;
private workedVal: number;
private element: Builder;
private element: HTMLElement;
private bit: HTMLElement;
private totalWork: number;
private progressBarBackground: Color;
private showDelayedScheduler: RunOnceScheduler;
constructor(container: HTMLElement, options?: IProgressBarOptions) {
super();
......@@ -51,14 +53,19 @@ export class ProgressBar extends Disposable {
this.progressBarBackground = this.options.progressBarBackground;
this._register(this.showDelayedScheduler = new RunOnceScheduler(() => show(this.element), 0));
this.create(container);
}
private create(container: HTMLElement): void {
$(container).div({ 'class': css_progress_container }, builder => {
this.element = builder.clone();
this.bit = builder.div({ 'class': css_progress_bit }).getHTMLElement();
});
this.element = document.createElement('div');
addClass(this.element, css_progress_container);
container.appendChild(this.element);
this.bit = document.createElement('div');
addClass(this.bit, css_progress_bit);
this.element.appendChild(this.bit);
this.applyStyles();
}
......@@ -66,9 +73,7 @@ export class ProgressBar extends Disposable {
private off(): void {
this.bit.style.width = 'inherit';
this.bit.style.opacity = '1';
this.element.removeClass(css_active);
this.element.removeClass(css_infinite);
this.element.removeClass(css_discrete);
removeClasses(this.element, css_active, css_infinite, css_discrete);
this.workedVal = 0;
this.totalWork = undefined;
......@@ -89,10 +94,10 @@ export class ProgressBar extends Disposable {
}
private doDone(delayed: boolean): ProgressBar {
this.element.addClass(css_done);
addClass(this.element, css_done);
// let it grow to 100% width and hide afterwards
if (!this.element.hasClass(css_infinite)) {
if (!hasClass(this.element, css_infinite)) {
this.bit.style.width = 'inherit';
if (delayed) {
......@@ -122,10 +127,8 @@ export class ProgressBar extends Disposable {
this.bit.style.width = '2%';
this.bit.style.opacity = '1';
this.element.removeClass(css_discrete);
this.element.removeClass(css_done);
this.element.addClass(css_active);
this.element.addClass(css_infinite);
removeClasses(this.element, css_discrete, css_done);
addClasses(this.element, css_active, css_infinite);
return this;
}
......@@ -176,20 +179,20 @@ export class ProgressBar extends Disposable {
this.workedVal = value;
this.workedVal = Math.min(this.totalWork, this.workedVal);
if (this.element.hasClass(css_infinite)) {
this.element.removeClass(css_infinite);
if (hasClass(this.element, css_infinite)) {
removeClass(this.element, css_infinite);
}
if (this.element.hasClass(css_done)) {
this.element.removeClass(css_done);
if (hasClass(this.element, css_done)) {
removeClass(this.element, css_done);
}
if (!this.element.hasClass(css_active)) {
this.element.addClass(css_active);
if (!hasClass(this.element, css_active)) {
addClass(this.element, css_active);
}
if (!this.element.hasClass(css_discrete)) {
this.element.addClass(css_discrete);
if (!hasClass(this.element, css_discrete)) {
addClass(this.element, css_discrete);
}
this.bit.style.width = 100 * (this.workedVal / this.totalWork) + '%';
......@@ -198,19 +201,22 @@ export class ProgressBar extends Disposable {
}
getContainer(): HTMLElement {
return this.element.getHTMLElement();
return this.element;
}
show(delay?: number): void {
this.showDelayedScheduler.cancel();
if (typeof delay === 'number') {
this.element.showDelayed(delay);
this.showDelayedScheduler.schedule(delay);
} else {
this.element.show();
show(this.element);
}
}
hide(): void {
this.element.hide();
hide(this.element);
this.showDelayedScheduler.cancel();
}
style(styles: IProgressBarStyles): void {
......
src/vs/base/test/browser/builder.test.ts
浏览文件 @ ad972a1d
......@@ -5,7 +5,7 @@
'use strict';
import * as assert from 'assert';
import { Builder, MultiBuilder, $, bindElement, withElement, setPropertyOnElement, getPropertyFromElement } from 'vs/base/browser/builder';
import { Builder, MultiBuilder, $, _bindElement, _withElement, _setPropertyOnElement, _getPropertyFromElement } from 'vs/base/browser/builder';
import * as Types from 'vs/base/common/types';
import * as DomUtils from 'vs/base/browser/dom';
import { IDisposable } from 'vs/base/common/lifecycle';
......@@ -48,7 +48,7 @@ function select(builder: Builder, selector: string, offdom?: boolean): MultiBuil
let builders: Builder[] = [];
for (let i = 0; i < elements.length; i++) {
builders.push(withElement(<HTMLElement>elements.item(i), offdom));
builders.push(_withElement(<HTMLElement>elements.item(i), offdom));
}
return new MultiBuilder(builders);
......@@ -75,17 +75,17 @@ suite('Builder', () => {
assert(element);
// Properties
setPropertyOnElement(element, 'foo', 'bar');
assert.strictEqual(getPropertyFromElement(element, 'foo'), 'bar');
_setPropertyOnElement(element, 'foo', 'bar');
assert.strictEqual(_getPropertyFromElement(element, 'foo'), 'bar');
setPropertyOnElement(element, 'foo', { foo: 'bar' });
assert.deepEqual(getPropertyFromElement(element, 'foo'), { foo: 'bar' });
_setPropertyOnElement(element, 'foo', { foo: 'bar' });
assert.deepEqual(_getPropertyFromElement(element, 'foo'), { foo: 'bar' });
setPropertyOnElement(element, 'bar', 'bar');
assert.strictEqual(getPropertyFromElement(element, 'bar'), 'bar');
_setPropertyOnElement(element, 'bar', 'bar');
assert.strictEqual(_getPropertyFromElement(element, 'bar'), 'bar');
setPropertyOnElement(element, 'bar', { foo: 'bar' });
assert.deepEqual(getPropertyFromElement(element, 'bar'), { foo: 'bar' });
_setPropertyOnElement(element, 'bar', { foo: 'bar' });
assert.deepEqual(_getPropertyFromElement(element, 'bar'), { foo: 'bar' });
});
test('Select', function () {
......@@ -801,7 +801,7 @@ suite('Builder', () => {
let counter7 = 0;
b.div(function (div: Builder) {
bindElement(div.getHTMLElement(), 'Foo Bar');
_bindElement(div.getHTMLElement(), 'Foo Bar');
div.setProperty('Foo', 'Bar');
bindings.push(div.clone());
......@@ -814,7 +814,7 @@ suite('Builder', () => {
inputs.push(div.clone());
div.p(function (p: Builder) {
bindElement(p.getHTMLElement(), 'Foo Bar');
_bindElement(p.getHTMLElement(), 'Foo Bar');
p.setProperty('Foo', 'Bar');
bindings.push(p.clone());
......@@ -827,7 +827,7 @@ suite('Builder', () => {
inputs.push(p.clone());
p.ul(function (ul: Builder) {
bindElement(ul.getHTMLElement(), 'Foo Bar');
_bindElement(ul.getHTMLElement(), 'Foo Bar');
ul.setProperty('Foo', 'Bar');
bindings.push(ul.clone());
......@@ -840,7 +840,7 @@ suite('Builder', () => {
inputs.push(ul.clone());
ul.li(function (li: Builder) {
bindElement(li.getHTMLElement(), 'Foo Bar');
_bindElement(li.getHTMLElement(), 'Foo Bar');
li.setProperty('Foo', 'Bar');
bindings.push(li.clone());
......@@ -856,7 +856,7 @@ suite('Builder', () => {
id: 'builderspan',
innerHtml: 'Foo Bar'
}, function (span) {
bindElement(span.getHTMLElement(), 'Foo Bar');
_bindElement(span.getHTMLElement(), 'Foo Bar');
span.setProperty('Foo', 'Bar');
bindings.push(span.clone());
......@@ -873,7 +873,7 @@ suite('Builder', () => {
id: 'builderimg',
src: '#'
}, function (img) {
bindElement(img.getHTMLElement(), 'Foo Bar');
_bindElement(img.getHTMLElement(), 'Foo Bar');
img.setProperty('Foo', 'Bar');
bindings.push(img.clone());
......@@ -891,7 +891,7 @@ suite('Builder', () => {
href: '#',
innerHtml: 'Link'
}, function (a) {
bindElement(a.getHTMLElement(), 'Foo Bar');
_bindElement(a.getHTMLElement(), 'Foo Bar');
a.setProperty('Foo', 'Bar');
bindings.push(a.clone());
......@@ -986,7 +986,7 @@ suite('Builder', () => {
let counter7 = 0;
b.div(function (div: Builder) {
bindElement(div.getHTMLElement(), 'Foo Bar');
_bindElement(div.getHTMLElement(), 'Foo Bar');
div.setProperty('Foo', 'Bar');
bindings.push(div.clone());
......@@ -999,7 +999,7 @@ suite('Builder', () => {
inputs.push(div.clone());
div.p(function (p: Builder) {
bindElement(p.getHTMLElement(), 'Foo Bar');
_bindElement(p.getHTMLElement(), 'Foo Bar');
p.setProperty('Foo', 'Bar');
bindings.push(p.clone());
......@@ -1012,7 +1012,7 @@ suite('Builder', () => {
inputs.push(p.clone());
p.ul(function (ul: Builder) {
bindElement(ul.getHTMLElement(), 'Foo Bar');
_bindElement(ul.getHTMLElement(), 'Foo Bar');
ul.setProperty('Foo', 'Bar');
bindings.push(ul.clone());
......@@ -1025,7 +1025,7 @@ suite('Builder', () => {
inputs.push(ul.clone());
ul.li(function (li: Builder) {
bindElement(li.getHTMLElement(), 'Foo Bar');
_bindElement(li.getHTMLElement(), 'Foo Bar');
li.setProperty('Foo', 'Bar');
bindings.push(li.clone());
......@@ -1041,7 +1041,7 @@ suite('Builder', () => {
id: 'builderspan',
innerHtml: 'Foo Bar'
}, function (span) {
bindElement(span.getHTMLElement(), 'Foo Bar');
_bindElement(span.getHTMLElement(), 'Foo Bar');
span.setProperty('Foo', 'Bar');
bindings.push(span.clone());
......@@ -1058,7 +1058,7 @@ suite('Builder', () => {
id: 'builderimg',
src: '#'
}, function (img) {
bindElement(img.getHTMLElement(), 'Foo Bar');
_bindElement(img.getHTMLElement(), 'Foo Bar');
img.setProperty('Foo', 'Bar');
bindings.push(img.clone());
......@@ -1076,7 +1076,7 @@ suite('Builder', () => {
href: '#',
innerHtml: 'Link'
}, function (a) {
bindElement(a.getHTMLElement(), 'Foo Bar');
_bindElement(a.getHTMLElement(), 'Foo Bar');
a.setProperty('Foo', 'Bar');
bindings.push(a.clone());
......
src/vs/platform/contextview/browser/contextMenuHandler.ts
浏览文件 @ ad972a1d
......@@ -6,8 +6,7 @@
'use strict';
import 'vs/css!./contextMenuHandler';
import { $, Builder } from 'vs/base/browser/builder';
import { combinedDisposable, IDisposable } from 'vs/base/common/lifecycle';
import { combinedDisposable, IDisposable, dispose } from 'vs/base/common/lifecycle';
import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
import { ActionRunner, IAction, IRunEvent } from 'vs/base/common/actions';
import { Menu } from 'vs/base/browser/ui/menu/menu';
......@@ -16,6 +15,7 @@ import { IContextViewService } from 'vs/platform/contextview/browser/contextView
import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
import { INotificationService } from 'vs/platform/notification/common/notification';
import { IContextMenuDelegate } from 'vs/base/browser/contextmenu';
import { addDisposableListener } from 'vs/base/browser/dom';
export class ContextMenuHandler {
......@@ -23,7 +23,8 @@ export class ContextMenuHandler {
private notificationService: INotificationService;
private telemetryService: ITelemetryService;
private $el: Builder;
private $el: HTMLElement;
private $elDisposable: IDisposable;
private menuContainerElement: HTMLElement;
private focusToReturn: HTMLElement;
......@@ -39,12 +40,12 @@ export class ContextMenuHandler {
public setContainer(container: HTMLElement): void {
if (this.$el) {
this.$el.off(['click', 'mousedown']);
this.$elDisposable = dispose(this.$elDisposable);
this.$el = null;
}
if (container) {
this.$el = $(container);
this.$el.on('mousedown', (e: Event) => this.onMouseDown(e as MouseEvent));
this.$el = container;
this.$elDisposable = addDisposableListener(this.$el, 'mousedown', (e) => this.onMouseDown(e as MouseEvent));
}
}
......
src/vs/workbench/parts/comments/electron-browser/commentsEditorContribution.ts
浏览文件 @ ad972a1d
......@@ -6,7 +6,7 @@
import 'vs/css!./media/review';
import * as nls from 'vs/nls';
import { $ } from 'vs/base/browser/builder';
import { $ } from 'vs/base/browser/dom';
import { findFirstInSorted } from 'vs/base/common/arrays';
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
import { IDisposable, dispose } from 'vs/base/common/lifecycle';
......@@ -48,7 +48,7 @@ export class ReviewViewZone implements IViewZone {
this.afterLineNumber = afterLineNumber;
this.callback = onDomNodeTop;
this.domNode = $('.review-viewzone').getHTMLElement();
this.domNode = $('.review-viewzone');
}
onDomNodeTop(top: number): void {
......
src/vs/workbench/parts/feedback/electron-browser/feedbackStatusbarItem.ts
浏览文件 @ ad972a1d
......@@ -16,8 +16,7 @@ import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector }
import { IWorkspaceContextService, WorkbenchState } from 'vs/platform/workspace/common/workspace';
import { IWorkspaceConfigurationService } from 'vs/workbench/services/configuration/common/configuration';
import { IConfigurationChangeEvent } from 'vs/platform/configuration/common/configuration';
import { clearNode, EventHelper, addClass, removeClass } from 'vs/base/browser/dom';
import { $ } from 'vs/base/browser/builder';
import { clearNode, EventHelper, addClass, removeClass, addDisposableListener } from 'vs/base/browser/dom';
import { localize } from 'vs/nls';
import { TPromise } from 'vs/base/common/winjs.base';
import { Action } from 'vs/base/common/actions';
......@@ -94,7 +93,7 @@ export class FeedbackStatusbarItem extends Themable implements IStatusbarItem {
super.updateStyles();
if (this.dropdown) {
$(this.dropdown.label).style('background-color', this.getColor(this.contextService.getWorkbenchState() !== WorkbenchState.EMPTY ? STATUS_BAR_FOREGROUND : STATUS_BAR_NO_FOLDER_FOREGROUND));
this.dropdown.label.style.backgroundColor = (this.getColor(this.contextService.getWorkbenchState() !== WorkbenchState.EMPTY ? STATUS_BAR_FOREGROUND : STATUS_BAR_NO_FOLDER_FOREGROUND));
}
}
......@@ -102,21 +101,21 @@ export class FeedbackStatusbarItem extends Themable implements IStatusbarItem {
this.container = element;
// Prevent showing dropdown on anything but left click
$(this.container).on('mousedown', (e: MouseEvent) => {
this.toDispose.push(addDisposableListener(this.container, 'mousedown', (e: MouseEvent) => {
if (e.button !== 0) {
EventHelper.stop(e, true);
}
}, this.toDispose, true);
}, true));
// Offer context menu to hide status bar entry
$(this.container).on('contextmenu', e => {
this.toDispose.push(addDisposableListener(this.container, 'contextmenu', e => {
EventHelper.stop(e, true);
this.contextMenuService.showContextMenu({
getAnchor: () => this.container,
getActions: () => TPromise.as([this.hideAction])
});
}, this.toDispose);
}));
return this.update();
}
......
src/vs/workbench/parts/files/electron-browser/views/emptyView.ts
浏览文件 @ ad972a1d
......@@ -11,7 +11,6 @@ import * as DOM from 'vs/base/browser/dom';
import { TPromise } from 'vs/base/common/winjs.base';
import { IAction } from 'vs/base/common/actions';
import { Button } from 'vs/base/browser/ui/button/button';
import { $, Builder } from 'vs/base/browser/builder';
import { IActionItem } from 'vs/base/browser/ui/actionbar/actionbar';
import { IViewletViewOptions } from 'vs/workbench/browser/parts/views/viewsViewlet';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
......@@ -33,8 +32,8 @@ export class EmptyView extends ViewletPanel {
public static readonly NAME = nls.localize('noWorkspace', "No Folder Opened");
private button: Button;
private messageDiv: Builder;
private titleDiv: Builder;
private messageElement: HTMLElement;
private titleElement: HTMLElement;
constructor(
options: IViewletViewOptions,
......@@ -50,17 +49,26 @@ export class EmptyView extends ViewletPanel {
}
public renderHeader(container: HTMLElement): void {
this.titleDiv = $('span').text(name).appendTo($('div.title').appendTo(container));
const titleContainer = document.createElement('div');
DOM.addClass(titleContainer, 'title');
container.appendChild(titleContainer);
this.titleElement = document.createElement('span');
this.titleElement.textContent = name;
titleContainer.appendChild(this.titleElement);
}
protected renderBody(container: HTMLElement): void {
DOM.addClass(container, 'explorer-empty-view');
this.messageDiv = $('p').appendTo($('div.section').appendTo(container));
const messageContainer = document.createElement('div');
DOM.addClass(messageContainer, 'section');
container.appendChild(messageContainer);
const section = $('div.section').appendTo(container);
this.messageElement = document.createElement('p');
messageContainer.appendChild(this.messageElement);
this.button = new Button(section.getHTMLElement());
this.button = new Button(messageContainer);
attachButtonStyler(this.button, this.themeService);
this.disposables.push(this.button.onDidClick(() => {
......@@ -99,17 +107,17 @@ export class EmptyView extends ViewletPanel {
private setLabels(): void {
if (this.contextService.getWorkbenchState() === WorkbenchState.WORKSPACE) {
this.messageDiv.text(nls.localize('noWorkspaceHelp', "You have not yet added a folder to the workspace."));
this.messageElement.textContent = nls.localize('noWorkspaceHelp', "You have not yet added a folder to the workspace.");
if (this.button) {
this.button.label = nls.localize('addFolder', "Add Folder");
}
this.titleDiv.text(EmptyView.NAME);
this.titleElement.textContent = EmptyView.NAME;
} else {
this.messageDiv.text(nls.localize('noFolderHelp', "You have not yet opened a folder."));
this.messageElement.textContent = nls.localize('noFolderHelp', "You have not yet opened a folder.");
if (this.button) {
this.button.label = nls.localize('openFolder', "Open Folder");
}
this.titleDiv.text(this.title);
this.titleElement.textContent = this.title;
}
}
......
src/vs/workbench/parts/search/browser/searchView.ts
浏览文件 @ ad972a1d
......@@ -343,7 +343,7 @@ export class SearchView extends Viewlet implements IViewlet, IPanel {
let searchHistory = history.search || this.viewletSettings['query.searchHistory'] || [];
let replaceHistory = history.replace || this.viewletSettings['query.replaceHistory'] || [];
this.searchWidget = this._register(this.instantiationService.createInstance(SearchWidget, builder, <ISearchWidgetOptions>{
this.searchWidget = this._register(this.instantiationService.createInstance(SearchWidget, builder.getHTMLElement(), <ISearchWidgetOptions>{
value: contentPattern,
isRegex: isRegex,
isCaseSensitive: isCaseSensitive,
......
src/vs/workbench/parts/search/browser/searchWidget.ts
浏览文件 @ ad972a1d
......@@ -20,7 +20,6 @@ import { ContextKeyExpr, IContextKeyService, IContextKey } from 'vs/platform/con
import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
import { Event, Emitter } from 'vs/base/common/event';
import { Builder } from 'vs/base/browser/builder';
import { IViewletService } from 'vs/workbench/services/viewlet/browser/viewlet';
import { isSearchViewFocused, appendKeyBindingLabel } from 'vs/workbench/parts/search/browser/searchActions';
import * as Constants from 'vs/workbench/parts/search/common/constants';
......@@ -122,7 +121,7 @@ export class SearchWidget extends Widget {
public readonly onBlur: Event<void> = this._onBlur.event;
constructor(
container: Builder,
container: HTMLElement,
options: ISearchWidgetOptions,
@IContextViewService private contextViewService: IContextViewService,
@IThemeService private themeService: IThemeService,
......@@ -228,8 +227,10 @@ export class SearchWidget extends Widget {
this.searchInput.focusOnRegex();
}
private render(container: Builder, options: ISearchWidgetOptions): void {
this.domNode = container.div({ 'class': 'search-widget' }).style({ position: 'relative' }).getHTMLElement();
private render(container: HTMLElement, options: ISearchWidgetOptions): void {
this.domNode = dom.append(container, dom.$('.search-widget'));
this.domNode.style.position = 'relative';
this.renderToggleReplaceButton(this.domNode);
this.renderSearchInput(this.domNode, options);
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或