add parse-color to css extension

joaomoreno · joaomoreno · commit 3cda4727100f · 2017-07-27T00:03:54.000+02:00
diff --git a/extensions/css/client/src/cssMain.ts b/extensions/css/client/src/cssMain.ts
@@ -5,6 +5,7 @@
 'use strict';
 
 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 { LanguageClient, LanguageClientOptions, ServerOptions, TransportKind, RequestType, Range, TextEdit } from 'vscode-languageclient';
@@ -24,14 +25,23 @@ class ColorProvider implements DocumentColorProvider {
 	async provideDocumentColors(document: TextDocument, token: CancellationToken): Promise<ColorInfo[]> {
 		const ranges = await this.client.sendRequest(ColorSymbolRequest.type, document.uri.toString());
 
-		return ranges.map(r => {
+		return ranges.reduce((result, r) => {
 			const range = this.client.protocol2CodeConverter.asRange(r);
-			const color = Color.fromHex('#000000');
+			const value = document.getText(range);
+			const parsedColor = parse(value);
+
+			if (!parsedColor || !parsedColor.rgba) {
+				return result;
+			}
+
+			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];
 
-			return new ColorInfo(range, color, format, availableFormats);
-		});
+			result.push(new ColorInfo(range, color, format, availableFormats));
+			return result;
+		}, []);
 	}
 }
 
diff --git a/extensions/css/client/src/typings/parse-color.d.ts b/extensions/css/client/src/typings/parse-color.d.ts
@@ -0,0 +1,21 @@
+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;
+}
diff --git a/extensions/css/npm-shrinkwrap.json b/extensions/css/npm-shrinkwrap.json
diff --git a/extensions/css/package.json b/extensions/css/package.json
@@ -673,6 +673,7 @@
     }
   },
   "dependencies": {
+    "parse-color": "^1.0.0",
     "vscode-languageclient": "^3.2.0",
     "vscode-nls": "^2.0.2"
   },

Original file line number	Diff line number	Diff line change
`@@ -673,6 +673,7 @@`
`673`	`673`	`}`
`674`	`674`	`},`
`675`	`675`	`"dependencies": {`
	`676`	`+ "parse-color": "^1.0.0",`
`676`	`677`	`"vscode-languageclient": "^3.2.0",`
`677`	`678`	`"vscode-nls": "^2.0.2"`
`678`	`679`	`},`