constructor(container: any) {
super();
this.$el = $('a.monaco-button').attr({
'tabIndex': '0',
'role': 'button'
}).appendTo(container);
this.$el.on(DOM.EventType.CLICK, (e) => {
if (!this.enabled) {
DOM.EventHelper.stop(e);
return;
}
this.emit(DOM.EventType.CLICK, e);
});
this.$el.on(DOM.EventType.KEY_DOWN, (e: KeyboardEvent) => {
let event = new StandardKeyboardEvent(e);
let eventHandled = false;
if (this.enabled && event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
this.emit(DOM.EventType.CLICK, e);
eventHandled = true;
} else if (event.equals(KeyCode.Escape)) {
this.$el.domBlur();
eventHandled = true;
}
if (eventHandled) {
DOM.EventHelper.stop(event, true);
}
});
}
this.$el.on(DOM.EventType.MOUSE_OVER, (e: MouseEvent) => {
if (!this.$el.hasClass('disabled')) {
const hoverBackground = this.buttonHoverBackground ? this.buttonHoverBackground.toString() : null;
if (hoverBackground) {
this.$el.style('background-color', hoverBackground);
}
}
});
private applyStyles(): void {
if (this.$el) {
const background = this.buttonBackground ? this.buttonBackground.toString() : null;
const foreground = this.buttonForeground ? this.buttonForeground.toString() : null;
this.$el.style('color', foreground);
this.$el.style('background-color', background);
}
}
constructor(container: any, options?: IButtonOptions) {
super();
this.options = options || Object.create(null);
mixin(this.options, defaultOptions, false);
this.buttonBackground = this.options.buttonBackground;
this.buttonHoverBackground = this.options.buttonHoverBackground;
this.buttonForeground = this.options.buttonForeground;
this.buttonBorder = this.options.buttonBorder;
this.$el = $('a.monaco-button').attr({
'tabIndex': '0',
'role': 'button'
}).appendTo(container);
this.$el.on(DOM.EventType.CLICK, (e) => {
if (!this.enabled) {
DOM.EventHelper.stop(e);
return;
}
this.emit(DOM.EventType.CLICK, e);
});
this.$el.on(DOM.EventType.KEY_DOWN, (e: KeyboardEvent) => {
let event = new StandardKeyboardEvent(e);
let eventHandled = false;
if (this.enabled && event.equals(KeyCode.Enter) || event.equals(KeyCode.Space)) {
this.emit(DOM.EventType.CLICK, e);
eventHandled = true;
} else if (event.equals(KeyCode.Escape)) {
this.$el.domBlur();
eventHandled = true;
}
if (eventHandled) {
DOM.EventHelper.stop(event, true);
}
});
this.$el.on(DOM.EventType.MOUSE_OVER, (e: MouseEvent) => {
if (!this.$el.hasClass('disabled')) {
const hoverBackground = this.buttonHoverBackground ? this.buttonHoverBackground.toString() : null;
if (hoverBackground) {
this.$el.style('background-color', hoverBackground);
}
}
});
this.$el.on(DOM.EventType.MOUSE_OUT, (e: MouseEvent) => {
this.applyStyles(); // restore standard styles
});
this.applyStyles();
}
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);
this.workedVal = 0;
this.totalWork = undefined;
}
test('Part Layout with Content only', function () {
let b = new Builder(document.getElementById(fixtureId));
b.div().hide();
let part = new MyPart3();
part.create(b.getHTMLElement());
assert(!document.getElementById('myPart.title'));
assert(document.getElementById('myPart.content'));
});
public setContainer(container: HTMLElement): void {
if (this.$el) {
this.$el.off(['click', 'mousedown']);
this.$el = null;
}
if (container) {
this.$el = $(container);
this.$el.on('mousedown', (e: Event) => this.onMouseDown(e as MouseEvent));
}
}
/**
* Use this mode to indicate progress that has no total number of work units.
*/
public infinite(): ProgressBar {
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);
return this;
}
export function findElement(container: Builder, className: string): HTMLElement {
var elementBuilder: Builder = container;
while (elementBuilder.getHTMLElement()) {
var htmlElement = elementBuilder.getHTMLElement();
if (htmlElement.className.startsWith(className)) {
break;
}
elementBuilder = elementBuilder.child(0);
}
return elementBuilder.getHTMLElement();
}
constructor(container: HTMLElement, options: IBaseDropdownOptions) {
super();
this.toDispose = [];
this.$el = $('.dropdown').appendTo(container);
this.$label = $('.dropdown-label');
if (options.tick || options.action) {
this.$label.addClass('tick');
}
let labelRenderer = options.labelRenderer;
if (!labelRenderer && options.action) {
this.$action = $('.dropdown-action').appendTo(this.$el);
let item = new ActionItem(null, options.action, {
icon: true,
label: true
});
item.actionRunner = this;
item.render(this.$action.getHTMLElement());
labelRenderer = (container: HTMLElement): IDisposable => {
container.innerText = '';
return item;
};
}
if (!labelRenderer) {
labelRenderer = (container: HTMLElement): IDisposable => {
$(container).text(options.label || '');
return null;
};
}
this.$label.on(['mousedown', EventType.Tap], (e: Event) => {
e.preventDefault();
e.stopPropagation();
this.toggleDropdown();
}).appendTo(this.$el);
let cleanupFn = labelRenderer(this.$label.getHTMLElement());
if (cleanupFn) {
this.toDispose.push(cleanupFn);
}
this.toDispose.push(new Gesture(this.$label.getHTMLElement()));
}
