[css] move to extension

extensions/css/client/src/colorDecorators.ts

@@ -0,0 +1,83 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+'use strict';
+
+import {window, workspace, DecorationOptions, DecorationRenderOptions, Disposable, Range} from 'vscode';
+
+let decorationType: DecorationRenderOptions = {
+	before: {
+		contentText: ' ',
+		border: 'solid 0.1em #000',
+		margin: '0.1em 0.2em 0 0.2em',
+		width: '0.8em',
+		height: '0.8em'
+	},
+	dark: {
+		before: {
+			border: 'solid 0.1em #eee'
+		}
+	}
+};
+
+export function activateColorDecorations(decoratorProvider: (uri: string) => Thenable<Range[]>, supportedLanguages: { [id: string]: boolean }): Disposable {
+
+	let disposables: Disposable[] = [];
+
+	let colorsDecorationType = window.createTextEditorDecorationType(decorationType);
+	disposables.push(colorsDecorationType);
+
+	let activeEditor = window.activeTextEditor;
+	if (activeEditor) {
+		triggerUpdateDecorations();
+	}
+
+	window.onDidChangeActiveTextEditor(editor => {
+		activeEditor = editor;
+		if (editor && supportedLanguages[activeEditor.document.languageId]) {
+			triggerUpdateDecorations();
+		}
+	}, null, disposables);
+
+	workspace.onDidChangeTextDocument(event => {
+		if (activeEditor && event.document === activeEditor.document && supportedLanguages[activeEditor.document.languageId]) {
+			triggerUpdateDecorations();
+		}
+	}, null, disposables);
+
+	let timeout = null;
+	function triggerUpdateDecorations() {
+		if (timeout) {
+			clearTimeout(timeout);
+		}
+		timeout = setTimeout(updateDecorations, 500);
+	}
+
+	function updateDecorations() {
+		if (!activeEditor) {
+			return;
+		}
+		let document = activeEditor.document;
+		if (!supportedLanguages[document.languageId]) {
+			return;
+		}
+		let uri = activeEditor.document.uri.toString();
+		decoratorProvider(uri).then(ranges => {
+
+			let decorations = ranges.map(range => {
+				let color = document.getText(range);
+				return <DecorationOptions>{
+					range: range,
+					renderOptions: {
+						before: {
+							backgroundColor: color
+						}
+					}
+				};
+			});
+			activeEditor.setDecorations(colorsDecorationType, decorations);
+		});
+	}
+	return Disposable.from(...disposables);
+}

extensions/css/client/src/cssMain.ts

@@ -0,0 +1,125 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+'use strict';
+
+import * as path from 'path';
+
+import {languages, window, commands, ExtensionContext} from 'vscode';
+import {LanguageClient, LanguageClientOptions, ServerOptions, TransportKind, RequestType, Range, TextEdit, Protocol2Code} from 'vscode-languageclient';
+import {activateColorDecorations} from './colorDecorators';
+
+namespace ColorSymbolRequest {
+	export const type: RequestType<string, Range[], any> = { get method() { return 'css/colorSymbols'; } };
+}
+
+// this method is called when vs code is activated
+export function activate(context: ExtensionContext) {
+
+	// The server is implemented in node
+	let serverModule = context.asAbsolutePath(path.join('server', 'out', 'cssServerMain.js'));
+	// The debug options for the server
+	let debugOptions = { execArgv: ['--nolazy', '--debug=6004'] };
+
+	// If the extension is launch in debug mode the debug server options are use
+	// Otherwise the run options are used
+	let serverOptions: ServerOptions = {
+		run: { module: serverModule, transport: TransportKind.ipc },
+		debug: { module: serverModule, transport: TransportKind.ipc, options: debugOptions }
+	};
+
+	// Options to control the language client
+	let clientOptions: LanguageClientOptions = {
+		documentSelector: ['css', 'less', 'scss'],
+		synchronize: {
+			configurationSection: ['css', 'scss', 'less']
+		},
+		initializationOptions: {
+		}
+	};
+
+	// Create the language client and start the client.
+	let client = new LanguageClient('css', serverOptions, clientOptions);
+
+	let disposable = client.start();
+	// Push the disposable to the context's subscriptions so that the
+	// client can be deactivated on extension deactivation
+	context.subscriptions.push(disposable);
+
+	let colorRequestor = (uri: string) => {
+		return client.sendRequest(ColorSymbolRequest.type, uri).then(ranges => ranges.map(Protocol2Code.asRange));
+	};
+	disposable = activateColorDecorations(colorRequestor, { css: true, scss: true, less: true });
+	context.subscriptions.push(disposable);
+
+	languages.setLanguageConfiguration('css', {
+		wordPattern: /(#?-?\d*\.\d\w*%?)|((::|[@#.!:])?[\w-?]+%?)|::|[@#.!:]/g,
+		comments: {
+			blockComment: ['/*', '*/']
+		},
+		brackets: [['{', '}'], ['[', ']'], ['(', ')']],
+		autoClosingPairs: [
+			{ open: '{', close: '}' },
+			{ open: '[', close: ']' },
+			{ open: '(', close: ')' },
+			{ open: '"', close: '"', notIn: ['string'] },
+			{ open: '\'', close: '\'', notIn: ['string'] }
+		]
+	});
+
+	languages.setLanguageConfiguration('less', {
+		wordPattern: /(#?-?\d*\.\d\w*%?)|([@#!.:]?[\w-?]+%?)|[@#!.]/g,
+		comments: {
+			blockComment: ['/*', '*/'],
+			lineComment: '//'
+		},
+		brackets: [['{', '}'], ['[', ']'], ['(', ')'], ['<', '>']],
+		autoClosingPairs: [
+			{ open: '"', close: '"', notIn: ['string', 'comment'] },
+			{ open: '\'', close: '\'', notIn: ['string', 'comment'] },
+			{ open: '{', close: '}', notIn: ['string', 'comment'] },
+			{ open: '[', close: ']', notIn: ['string', 'comment'] },
+			{ open: '(', close: ')', notIn: ['string', 'comment'] },
+			{ open: '<', close: '>', notIn: ['string', 'comment'] },
+		]
+	});
+
+	languages.setLanguageConfiguration('scss', {
+		wordPattern: /(#?-?\d*\.\d\w*%?)|([@#!.:]?[\w-?]+%?)|[@#!.]/g,
+		comments: {
+			blockComment: ['/*', '*/'],
+			lineComment: '//'
+		},
+		brackets: [['{', '}'], ['[', ']'], ['(', ')'], ['<', '>']],
+		autoClosingPairs: [
+			{ open: '"', close: '"', notIn: ['string', 'comment'] },
+			{ open: '\'', close: '\'', notIn: ['string', 'comment'] },
+			{ open: '{', close: '}', notIn: ['string', 'comment'] },
+			{ open: '[', close: ']', notIn: ['string', 'comment'] },
+			{ open: '(', close: ')', notIn: ['string', 'comment'] },
+			{ open: '<', close: '>', notIn: ['string', 'comment'] },
+		]
+	});
+
+	commands.registerCommand('_css.applyCodeAction', applyCodeAction);
+}
+
+function applyCodeAction(uri: string, documentVersion: number, edits: TextEdit[]) {
+	let textEditor = window.activeTextEditor;
+	if (textEditor && textEditor.document.uri.toString() === uri) {
+		if (textEditor.document.version !== documentVersion) {
+			window.showInformationMessage(`CSS fix is outdated and can't be applied to the document.`);
+		}
+		textEditor.edit(mutator => {
+			for (let edit of edits) {
+				mutator.replace(Protocol2Code.asRange(edit.range), edit.newText);
+			}
+		}).then(success => {
+			if (!success) {
+				window.showErrorMessage('Failed to apply CSS fix to the document. Please consider opening an issue with steps to reproduce.');
+			}
+		});
+	}
+}
+

extensions/css/client/src/typings/ref.d.ts

@@ -0,0 +1,11 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (c) Microsoft Corporation. All rights reserved.
+ *  Licensed under the MIT License. See License.txt in the project root for license information.
+ *--------------------------------------------------------------------------------------------*/
+
+/// <reference path='../../../../../src/vs/vscode.d.ts'/>
+/// <reference path='../../../../../src/typings/mocha.d.ts'/>
+/// <reference path='../../../../../extensions/node.d.ts'/>
+/// <reference path='../../../../../extensions/lib.core.d.ts'/>
+/// <reference path='../../../../../extensions/declares.d.ts'/>
+/// <reference path='../../../node_modules/vscode-languageclient/lib/main.d.ts'/>