css color formats

This commit is contained in:
Joao Moreno
2017-07-27 17:23:50 +02:00
parent be836877ee
commit 3e62cf16fa

View File

@@ -7,7 +7,7 @@
import * as path from 'path';
import * as parse from 'parse-color';
import { languages, window, commands, workspace, ExtensionContext, DocumentColorProvider, Color, CancellationToken, TextDocument, ColorInfo } from 'vscode';
import { languages, window, commands, workspace, ExtensionContext, DocumentColorProvider, Color, IColorFormat, CancellationToken, TextDocument, ColorInfo } from 'vscode';
import { LanguageClient, LanguageClientOptions, ServerOptions, TransportKind, RequestType, Range, TextEdit } from 'vscode-languageclient';
import { activateColorDecorations } from './colorDecorators';
@@ -18,6 +18,28 @@ 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}, {green}, {blue})',
transparent: 'rgba({red}, {green}, {blue}, {alpha:2f[0-1]})'
},
HSL: {
opaque: 'hsl({hue:d[0-360]}, {saturation:d[0-100]}%, {luminosity:d[0-100]}%)',
transparent: 'hsla({hue:d[0-360]}, {saturation:d[0-100]}%, {luminosity:d[0-100]}%, {alpha:2f[0-1]})'
}
};
function detectFormat(value: string): IColorFormat {
if (/^rgb/i.test(value)) {
return CSSColorFormats.RGB;
} else if (/^hsl/i.test(value)) {
return CSSColorFormats.HSL;
} else {
return CSSColorFormats.Hex;
}
}
class ColorProvider implements DocumentColorProvider {
constructor(private client: LanguageClient) { }
@@ -36,11 +58,9 @@ class ColorProvider implements DocumentColorProvider {
const [red, green, blue, alpha] = parsedColor.rgba;
const color = new Color(red, green, blue, alpha);
const format = '#{red:X}{green:X}{blue:X}';
const availableFormats = [format];
const format = detectFormat(value);
result.push(new ColorInfo(range, color, format, availableFormats));
return result;
return [...result, new ColorInfo(range, color, format, [CSSColorFormats.Hex, CSSColorFormats.RGB, CSSColorFormats.HSL])];
}, []);
}
}