mirror of
https://github.com/Microsoft/vscode
synced 2024-08-28 05:19:39 +00:00
[css] adopt languageserver colorProvider.proposed protocol
This commit is contained in:
parent
d5ac84dd0c
commit
aae74ede39
|
@ -6,32 +6,4 @@
|
|||
"repositoryURL": "https://github.com/atom/language-css",
|
||||
"description": "The file syntaxes/css.tmLanguage.json was derived from the Atom package https://github.com/atom/language-css which was originally converted from the TextMate bundle https://github.com/textmate/css.tmbundle."
|
||||
|
||||
},
|
||||
{
|
||||
"isLicense": true,
|
||||
"name": "color-convert",
|
||||
"repositoryURL": "https+ssh://git@github.com/harthur/color-convert",
|
||||
"license": "MIT",
|
||||
"licenseDetail": [
|
||||
"Copyright (c) 2011-2016 Heather Arthur <fayearthur@gmail.com>",
|
||||
"",
|
||||
"Permission is hereby granted, free of charge, to any person obtaining",
|
||||
"a copy of this software and associated documentation files (the \"Software\"), to deal in the Software without restriction, including",
|
||||
"without limitation the rights to use, copy, modify, merge, publish,",
|
||||
"distribute, sublicense, and/or sell copies of the Software, and to",
|
||||
"permit persons to whom the Software is furnished to do so, subject to",
|
||||
"the following conditions:",
|
||||
"",
|
||||
"The above copyright notice and this permission notice shall be",
|
||||
"included in all copies or substantial portions of the Software.",
|
||||
"",
|
||||
"THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND,",
|
||||
"EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF",
|
||||
"MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND",
|
||||
"NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE",
|
||||
"LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION",
|
||||
"OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION",
|
||||
"WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE."
|
||||
]
|
||||
}
|
||||
]
|
||||
}]
|
||||
|
|
|
@ -1,43 +0,0 @@
|
|||
/*---------------------------------------------------------------------------------------------
|
||||
* 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 parse from 'parse-color';
|
||||
import { Range, TextDocument, DocumentColorProvider, Color, ColorRange } from 'vscode';
|
||||
|
||||
const CSSColorFormats = {
|
||||
Hex: '#{red:X}{green:X}{blue:X}',
|
||||
RGB: {
|
||||
opaque: 'rgb({red:d[0-255]}, {green:d[0-255]}, {blue:d[0-255]})',
|
||||
transparent: 'rgba({red:d[0-255]}, {green:d[0-255]}, {blue:d[0-255]}, {alpha})'
|
||||
},
|
||||
HSL: {
|
||||
opaque: 'hsl({hue:d[0-360]}, {saturation:d[0-100]}%, {luminance:d[0-100]}%)',
|
||||
transparent: 'hsla({hue:d[0-360]}, {saturation:d[0-100]}%, {luminance:d[0-100]}%, {alpha})'
|
||||
}
|
||||
};
|
||||
|
||||
export class ColorProvider implements DocumentColorProvider {
|
||||
constructor(private decoratorProvider: (uri: string) => Thenable<Range[]>) { }
|
||||
|
||||
async provideDocumentColors(document: TextDocument): Promise<ColorRange[]> {
|
||||
const ranges = await this.decoratorProvider(document.uri.toString());
|
||||
const result = [];
|
||||
for (let range of ranges) {
|
||||
let color;
|
||||
const value = document.getText(range);
|
||||
const parsedColor = parse(value);
|
||||
if (parsedColor && parsedColor.rgba) {
|
||||
const [red, green, blue, alpha] = parsedColor.rgba;
|
||||
color = new Color(red, green, blue, alpha);
|
||||
}
|
||||
|
||||
if (color) {
|
||||
result.push(new ColorRange(range, color, [CSSColorFormats.Hex, CSSColorFormats.RGB, CSSColorFormats.HSL]));
|
||||
}
|
||||
}
|
||||
return result;
|
||||
}
|
||||
}
|
|
@ -6,17 +6,26 @@
|
|||
|
||||
import * as path from 'path';
|
||||
|
||||
import { languages, window, commands, ExtensionContext } from 'vscode';
|
||||
import { LanguageClient, LanguageClientOptions, ServerOptions, TransportKind, RequestType, Range, TextEdit } from 'vscode-languageclient';
|
||||
import { languages, window, commands, ExtensionContext, TextDocument, ColorRange, Color } from 'vscode';
|
||||
import { LanguageClient, LanguageClientOptions, ServerOptions, TransportKind, TextEdit } from 'vscode-languageclient';
|
||||
|
||||
import { ConfigurationFeature } from 'vscode-languageclient/lib/proposed';
|
||||
import { ColorProvider } from './colorDecorators';
|
||||
import { DocumentColorRequest } from 'vscode-languageserver-protocol/lib/protocol.colorProvider.proposed';
|
||||
|
||||
import * as nls from 'vscode-nls';
|
||||
let localize = nls.loadMessageBundle();
|
||||
|
||||
namespace ColorSymbolRequest {
|
||||
export const type: RequestType<string, Range[], any, any> = new RequestType('css/colorSymbols');
|
||||
}
|
||||
const CSSColorFormats = {
|
||||
Hex: '#{red:X}{green:X}{blue:X}',
|
||||
RGB: {
|
||||
opaque: 'rgb({red:d[0-255]}, {green:d[0-255]}, {blue:d[0-255]})',
|
||||
transparent: 'rgba({red:d[0-255]}, {green:d[0-255]}, {blue:d[0-255]}, {alpha})'
|
||||
},
|
||||
HSL: {
|
||||
opaque: 'hsl({hue:d[0-360]}, {saturation:d[0-100]}%, {luminance:d[0-100]}%)',
|
||||
transparent: 'hsla({hue:d[0-360]}, {saturation:d[0-100]}%, {luminance:d[0-100]}%, {alpha})'
|
||||
}
|
||||
};
|
||||
|
||||
// this method is called when vs code is activated
|
||||
export function activate(context: ExtensionContext) {
|
||||
|
@ -33,9 +42,11 @@ export function activate(context: ExtensionContext) {
|
|||
debug: { module: serverModule, transport: TransportKind.ipc, options: debugOptions }
|
||||
};
|
||||
|
||||
let documentSelector = ['css', 'scss', 'less'];
|
||||
|
||||
// Options to control the language client
|
||||
let clientOptions: LanguageClientOptions = {
|
||||
documentSelector: ['css', 'scss', 'less'],
|
||||
documentSelector,
|
||||
synchronize: {
|
||||
configurationSection: ['css', 'scss', 'less']
|
||||
},
|
||||
|
@ -53,11 +64,19 @@ export function activate(context: ExtensionContext) {
|
|||
context.subscriptions.push(disposable);
|
||||
|
||||
client.onReady().then(_ => {
|
||||
let colorRequestor = (uri: string) => {
|
||||
return client.sendRequest(ColorSymbolRequest.type, uri).then(ranges => ranges.map(client.protocol2CodeConverter.asRange));
|
||||
};
|
||||
|
||||
context.subscriptions.push(languages.registerColorProvider(['css', 'scss', 'less'], new ColorProvider(colorRequestor)));
|
||||
// register color provider
|
||||
context.subscriptions.push(languages.registerColorProvider(documentSelector, {
|
||||
provideDocumentColors(document: TextDocument): Thenable<ColorRange[]> {
|
||||
let params = client.code2ProtocolConverter.asDocumentSymbolParams(document);
|
||||
return client.sendRequest(DocumentColorRequest.type, params).then(symbols => {
|
||||
return symbols.map(symbol => {
|
||||
let range = client.protocol2CodeConverter.asRange(symbol.range);
|
||||
let color = new Color(symbol.color.red * 255, symbol.color.green * 255, symbol.color.blue * 255, symbol.color.alpha);
|
||||
return new ColorRange(range, color, [CSSColorFormats.Hex, CSSColorFormats.RGB, CSSColorFormats.HSL]);
|
||||
});
|
||||
});
|
||||
}
|
||||
}));
|
||||
});
|
||||
|
||||
let indentationRules = {
|
||||
|
|
|
@ -1,21 +0,0 @@
|
|||
declare module "parse-color" {
|
||||
|
||||
interface Color {
|
||||
rgb: [number, number, number],
|
||||
hsl: [number, number, number],
|
||||
hsv: [number, number, number],
|
||||
cmyk: [number, number, number, number],
|
||||
keyword: string,
|
||||
hex: string,
|
||||
rgba: [number, number, number, number],
|
||||
hsla: [number, number, number, number],
|
||||
hsva: [number, number, number, number],
|
||||
cmyka: [number, number, number, number, number]
|
||||
}
|
||||
|
||||
function parse(value: string): Color;
|
||||
|
||||
module parse { }
|
||||
|
||||
export = parse;
|
||||
}
|
16
extensions/css/npm-shrinkwrap.json
generated
16
extensions/css/npm-shrinkwrap.json
generated
|
@ -2,16 +2,6 @@
|
|||
"name": "css",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"color-convert": {
|
||||
"version": "0.5.3",
|
||||
"from": "color-convert@>=0.5.0 <0.6.0",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-0.5.3.tgz"
|
||||
},
|
||||
"parse-color": {
|
||||
"version": "1.0.0",
|
||||
"from": "parse-color@latest",
|
||||
"resolved": "https://registry.npmjs.org/parse-color/-/parse-color-1.0.0.tgz"
|
||||
},
|
||||
"vscode-jsonrpc": {
|
||||
"version": "3.3.1",
|
||||
"from": "vscode-jsonrpc@>=3.3.0 <4.0.0",
|
||||
|
@ -23,9 +13,9 @@
|
|||
"resolved": "https://registry.npmjs.org/vscode-languageclient/-/vscode-languageclient-3.4.0-next.17.tgz"
|
||||
},
|
||||
"vscode-languageserver-protocol": {
|
||||
"version": "3.1.0",
|
||||
"from": "vscode-languageserver-protocol@>=3.1.0 <4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.1.0.tgz"
|
||||
"version": "3.1.1",
|
||||
"from": "vscode-languageserver-protocol@>=3.1.1 <4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.1.1.tgz"
|
||||
},
|
||||
"vscode-languageserver-types": {
|
||||
"version": "3.3.0",
|
||||
|
|
|
@ -70,8 +70,8 @@
|
|||
"type": "boolean",
|
||||
"scope": "window",
|
||||
"default": true,
|
||||
"description": "%css.colorDecorators.enable.desc%",
|
||||
"deprecationMessage": "%css.colorDecorators.enable.deprecationMessage%"
|
||||
"description": "%css.colorDecorators.enable.desc%",
|
||||
"deprecationMessage": "%css.colorDecorators.enable.deprecationMessage%"
|
||||
},
|
||||
"css.lint.compatibleVendorPrefixes": {
|
||||
"type": "string",
|
||||
|
@ -304,8 +304,8 @@
|
|||
"type": "boolean",
|
||||
"scope": "window",
|
||||
"default": true,
|
||||
"description": "%scss.colorDecorators.enable.desc%",
|
||||
"deprecationMessage": "%scss.colorDecorators.enable.deprecationMessage%"
|
||||
"description": "%scss.colorDecorators.enable.desc%",
|
||||
"deprecationMessage": "%scss.colorDecorators.enable.deprecationMessage%"
|
||||
},
|
||||
"scss.lint.compatibleVendorPrefixes": {
|
||||
"type": "string",
|
||||
|
@ -737,8 +737,8 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"parse-color": "^1.0.0",
|
||||
"vscode-languageclient": "3.4.0-next.17",
|
||||
"vscode-languageserver-protocol": "^3.1.1",
|
||||
"vscode-nls": "^2.0.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
|
10
extensions/css/server/npm-shrinkwrap.json
generated
10
extensions/css/server/npm-shrinkwrap.json
generated
|
@ -3,9 +3,9 @@
|
|||
"version": "1.0.0",
|
||||
"dependencies": {
|
||||
"vscode-css-languageservice": {
|
||||
"version": "2.1.3",
|
||||
"version": "2.1.4",
|
||||
"from": "vscode-css-languageservice@next",
|
||||
"resolved": "https://registry.npmjs.org/vscode-css-languageservice/-/vscode-css-languageservice-2.1.3.tgz"
|
||||
"resolved": "https://registry.npmjs.org/vscode-css-languageservice/-/vscode-css-languageservice-2.1.4.tgz"
|
||||
},
|
||||
"vscode-jsonrpc": {
|
||||
"version": "3.3.1",
|
||||
|
@ -18,9 +18,9 @@
|
|||
"resolved": "https://registry.npmjs.org/vscode-languageserver/-/vscode-languageserver-3.4.0-next.6.tgz"
|
||||
},
|
||||
"vscode-languageserver-protocol": {
|
||||
"version": "3.1.0",
|
||||
"from": "vscode-languageserver-protocol@>=3.1.0 <4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.1.0.tgz"
|
||||
"version": "3.1.1",
|
||||
"from": "vscode-languageserver-protocol@>=3.1.1 <4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.1.1.tgz"
|
||||
},
|
||||
"vscode-languageserver-types": {
|
||||
"version": "3.3.0",
|
||||
|
|
|
@ -8,8 +8,9 @@
|
|||
"node": "*"
|
||||
},
|
||||
"dependencies": {
|
||||
"vscode-css-languageservice": "^2.1.3",
|
||||
"vscode-languageserver": "3.4.0-next.6"
|
||||
"vscode-css-languageservice": "^2.1.4",
|
||||
"vscode-languageserver": "3.4.0-next.6",
|
||||
"vscode-languageserver-protocol": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^6.0.51"
|
||||
|
|
|
@ -5,18 +5,15 @@
|
|||
'use strict';
|
||||
|
||||
import {
|
||||
createConnection, IConnection, Range,
|
||||
TextDocuments, TextDocument, InitializeParams, InitializeResult, RequestType
|
||||
createConnection, IConnection, TextDocuments, TextDocument, InitializeParams, InitializeResult, ServerCapabilities
|
||||
} from 'vscode-languageserver';
|
||||
|
||||
import { GetConfigurationRequest } from 'vscode-languageserver-protocol/lib/protocol.configuration.proposed';
|
||||
import { DocumentColorRequest, ServerCapabilities as CPServerCapabilities } from 'vscode-languageserver-protocol/lib/protocol.colorProvider.proposed';
|
||||
|
||||
import { getCSSLanguageService, getSCSSLanguageService, getLESSLanguageService, LanguageSettings, LanguageService, Stylesheet } from 'vscode-css-languageservice';
|
||||
import { getLanguageModelCache } from './languageModelCache';
|
||||
|
||||
namespace ColorSymbolRequest {
|
||||
export const type: RequestType<string, Range[], any, any> = new RequestType('css/colorSymbols');
|
||||
}
|
||||
|
||||
export interface Settings {
|
||||
css: LanguageSettings;
|
||||
less: LanguageSettings;
|
||||
|
@ -58,20 +55,20 @@ connection.onInitialize((params: InitializeParams): InitializeResult => {
|
|||
}
|
||||
let snippetSupport = hasClientCapability('textDocument.completion.completionItem.snippetSupport');
|
||||
scopedSettingsSupport = hasClientCapability('workspace.configuration');
|
||||
return {
|
||||
capabilities: {
|
||||
// Tell the client that the server works in FULL text document sync mode
|
||||
textDocumentSync: documents.syncKind,
|
||||
completionProvider: snippetSupport ? { resolveProvider: false } : null,
|
||||
hoverProvider: true,
|
||||
documentSymbolProvider: true,
|
||||
referencesProvider: true,
|
||||
definitionProvider: true,
|
||||
documentHighlightProvider: true,
|
||||
codeActionProvider: true,
|
||||
renameProvider: true
|
||||
}
|
||||
let capabilities: ServerCapabilities & CPServerCapabilities = {
|
||||
// Tell the client that the server works in FULL text document sync mode
|
||||
textDocumentSync: documents.syncKind,
|
||||
completionProvider: snippetSupport ? { resolveProvider: false } : null,
|
||||
hoverProvider: true,
|
||||
documentSymbolProvider: true,
|
||||
referencesProvider: true,
|
||||
definitionProvider: true,
|
||||
documentHighlightProvider: true,
|
||||
codeActionProvider: true,
|
||||
renameProvider: true,
|
||||
colorProvider: true
|
||||
};
|
||||
return { capabilities };
|
||||
});
|
||||
|
||||
let languageServices: { [id: string]: LanguageService } = {
|
||||
|
@ -205,11 +202,11 @@ connection.onCodeAction(codeActionParams => {
|
|||
return getLanguageService(document).doCodeActions(document, codeActionParams.range, codeActionParams.context, stylesheet);
|
||||
});
|
||||
|
||||
connection.onRequest(ColorSymbolRequest.type, uri => {
|
||||
let document = documents.get(uri);
|
||||
connection.onRequest(DocumentColorRequest.type, params => {
|
||||
let document = documents.get(params.textDocument.uri);
|
||||
if (document) {
|
||||
let stylesheet = stylesheets.get(document);
|
||||
return getLanguageService(document).findColorSymbols(document, stylesheet);
|
||||
return getLanguageService(document).findDocumentColors(document, stylesheet);
|
||||
}
|
||||
return [];
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue