PreferencesWidgets: Implement Define preference widget

src/vs/workbench/parts/preferences/browser/media/preferences.css

@@ -21,3 +21,15 @@
 .monaco-editor.hc-black .copy-preferences-light-bulb {
 	background: url('lightbulb-dark.svg') center center no-repeat;
 }
+
+.monaco-editor .define-preference-widget {
+	background: rgb(179,255,179);
+	padding: 10px;
+	border-radius: 5px;
+	cursor: pointer;
+}
+
+.monaco-editor.vs-dark .define-preference-widget,
+.monaco-editor.hc-black .define-preference-widget {
+	background: rgb(21,97,21);
+}
\ No newline at end of file

src/vs/workbench/parts/preferences/browser/preferencesWidgets.ts

@@ -3,9 +3,11 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+import * as DOM from 'vs/base/browser/dom';
 import { Widget } from 'vs/base/browser/ui/widget';
-import { ICodeEditor, IOverlayWidget, IOverlayWidgetPosition } from 'vs/editor/browser/editorBrowser';
+import { ICodeEditor, IOverlayWidget, IOverlayWidgetPosition, OverlayWidgetPositionPreference } from 'vs/editor/browser/editorBrowser';
 import Event, { Emitter } from 'vs/base/common/event';
+import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 
 export class CopyPreferenceWidget<T> extends Widget implements IOverlayWidget {
 
@@ -88,3 +90,49 @@ export class CopyPreferenceWidget<T> extends Widget implements IOverlayWidget {
 		}
 	}
 }
+
+export class DefinePreferenceWidget extends Widget implements IOverlayWidget {
+
+	private _domNode: HTMLElement;
+
+	private _onDefineValue: Emitter<void> = new Emitter<void>();
+	public onDefineValue: Event<void> = this._onDefineValue.event;
+
+	constructor(private editor: ICodeEditor, private label: string, private keyBindingAction: string,
+		@IKeybindingService keybindingService: IKeybindingService
+	) {
+		super();
+		if (keyBindingAction) {
+			let keybinding = keybindingService.lookupKeybindings(keyBindingAction);
+			if (keybinding.length > 0) {
+				this.label += ' (' + keybindingService.getLabelFor(keybinding[0]) + ')';
+			}
+		}
+	}
+
+	public render() {
+		this._domNode = DOM.$('.define-preference-widget');
+		DOM.append(this._domNode, DOM.$('')).textContent = this.label;
+		this.onclick(this._domNode, e => this._onDefineValue.fire());
+		this.editor.addOverlayWidget(this);
+	}
+
+	public dispose(): void {
+		this.editor.removeOverlayWidget(this);
+		super.dispose();
+	}
+
+	public getId(): string {
+		return 'editor.overlayWidget.definePreferenceWidget';
+	}
+
+	public getDomNode(): HTMLElement {
+		return this._domNode;
+	}
+
+	public getPosition(): IOverlayWidgetPosition {
+		return {
+			preference: OverlayWidgetPositionPreference.BOTTOM_RIGHT_CORNER
+		};
+	}
+}
\ No newline at end of file