Permalink
Browse files

added color name translations

  • Loading branch information...
matthewmueller committed Nov 13, 2012
1 parent 56660b2 commit 574051b566ae37f647ddb833019886cebf5ae5ea
Showing with 182 additions and 13 deletions.
  1. +1 −1 Makefile
  2. +3 −3 Readme.md
  3. +3 −2 component.json
  4. +24 −5 index.js
  5. +149 −0 names.js
  6. +2 −2 test.html
View
@@ -1,5 +1,5 @@
-build: components index.js
+build: components index.js names.js
@component build --dev
components: component.json
View
@@ -11,10 +11,10 @@
```js
var color = require('color'),
- c = '#C8272B';
+ c = 'red';
-color.darken(c, .5) // '#643d39'
-color.lighten(c, .5) // '#fa595d'
+color.darken(c, .5) // '#ff3232'
+color.lighten(c, .5) // '#cd3232'
```
## API
View
@@ -8,6 +8,7 @@
"development": {},
"license": "MIT",
"scripts": [
- "index.js"
+ "index.js",
+ "names.js"
]
-}
+}
View
@@ -1,12 +1,19 @@
+/**
+ * Module dependencies
+ */
+
+var names = require('./names');
+
/**
* Lighten the given color
* @param {String} color hex value
* @param {Number} value
* @return {String}
*/
-exports.lighten = function(color, value) {
- return tint(color, value);
+exports.lighten = function(color, v) {
+ v = (v <= 1) ? v*100 : v;
+ return tint(color, v);
};
/**
@@ -16,8 +23,9 @@ exports.lighten = function(color, value) {
* @return {String}
*/
-exports.darken = function(color, value) {
- return tint(color, -value);
+exports.darken = function(color, v) {
+ v = (v <= 1) ? v*100 : v;
+ return tint(color, -v);
};
@@ -32,8 +40,9 @@ exports.darken = function(color, value) {
*/
function tint(color, v) {
+ color = names[color] ? names[color] : color;
color = color.replace(/^#/, '');
- v = (v <= 1) ? v*100 : v;
+ color = (color.length == 3) ? hex3tohex6(color) : color;
var rgb = parseInt(color, 16);
var r = Math.abs(((rgb >> 16) & 0xFF)+v); if (r>255) r=r-(r-255);
var g = Math.abs(((rgb >> 8) & 0xFF)+v); if (g>255) g=g-(g-255);
@@ -46,3 +55,13 @@ function tint(color, v) {
if (b.length == 1) b = '0' + b;
return "#" + r + g + b;
}
+
+/**
+ * Hex3 to Hex6
+ */
+
+function hex3tohex6(h) {
+ return h[0] + h[0]
+ + h[1] + h[1]
+ + h[2] + h[2];
+}
View
149 names.js
@@ -0,0 +1,149 @@
+module.exports = {
+ aliceblue: 'f0f8ff',
+ antiquewhite: 'faebd7',
+ aqua: '0ff',
+ aquamarine: '7fffd4',
+ azure: 'f0ffff',
+ beige: 'f5f5dc',
+ bisque: 'ffe4c4',
+ black: '000',
+ blanchedalmond: 'ffebcd',
+ blue: '00f',
+ blueviolet: '8a2be2',
+ brown: 'a52a2a',
+ burlywood: 'deb887',
+ cadetblue: '5f9ea0',
+ chartreuse: '7fff00',
+ chocolate: 'd2691e',
+ coral: 'ff7f50',
+ cornflowerblue: '6495ed',
+ cornsilk: 'fff8dc',
+ crimson: 'dc143c',
+ cyan: '0ff',
+ darkblue: '00008b',
+ darkcyan: '008b8b',
+ darkgoldenrod: 'b8860b',
+ darkgray: 'a9a9a9',
+ darkgrey: 'a9a9a9',
+ darkgreen: '006400',
+ darkkhaki: 'bdb76b',
+ darkmagenta: '8b008b',
+ darkolivegreen: '556b2f',
+ darkorange: 'ff8c00',
+ darkorchid: '9932cc',
+ darkred: '8b0000',
+ darksalmon: 'e9967a',
+ darkseagreen: '8fbc8f',
+ darkslateblue: '483d8b',
+ darkslategray: '2f4f4f',
+ darkslategrey: '2f4f4f',
+ darkturquoise: '00ced1',
+ darkviolet: '9400d3',
+ deeppink: 'ff1493',
+ deepskyblue: '00bfff',
+ dimgray: '696969',
+ dimgrey: '696969',
+ dodgerblue: '1e90ff',
+ firebrick: 'b22222',
+ floralwhite: 'fffaf0',
+ forestgreen: '228b22',
+ fuchsia: 'f0f',
+ gainsboro: 'dcdcdc',
+ ghostwhite: 'f8f8ff',
+ gold: 'ffd700',
+ goldenrod: 'daa520',
+ gray: '808080',
+ grey: '808080',
+ green: '008000',
+ greenyellow: 'adff2f',
+ honeydew: 'f0fff0',
+ hotpink: 'ff69b4',
+ indianred: 'cd5c5c',
+ indigo: '4b0082',
+ ivory: 'fffff0',
+ khaki: 'f0e68c',
+ lavender: 'e6e6fa',
+ lavenderblush: 'fff0f5',
+ lawngreen: '7cfc00',
+ lemonchiffon: 'fffacd',
+ lightblue: 'add8e6',
+ lightcoral: 'f08080',
+ lightcyan: 'e0ffff',
+ lightgoldenrodyellow: 'fafad2',
+ lightgray: 'd3d3d3',
+ lightgrey: 'd3d3d3',
+ lightgreen: '90ee90',
+ lightpink: 'ffb6c1',
+ lightsalmon: 'ffa07a',
+ lightseagreen: '20b2aa',
+ lightskyblue: '87cefa',
+ lightslategray: '789',
+ lightslategrey: '789',
+ lightsteelblue: 'b0c4de',
+ lightyellow: 'ffffe0',
+ lime: '0f0',
+ limegreen: '32cd32',
+ linen: 'faf0e6',
+ magenta: 'f0f',
+ maroon: '800000',
+ mediumaquamarine: '66cdaa',
+ mediumblue: '0000cd',
+ mediumorchid: 'ba55d3',
+ mediumpurple: '9370d8',
+ mediumseagreen: '3cb371',
+ mediumslateblue: '7b68ee',
+ mediumspringgreen: '00fa9a',
+ mediumturquoise: '48d1cc',
+ mediumvioletred: 'c71585',
+ midnightblue: '191970',
+ mintcream: 'f5fffa',
+ mistyrose: 'ffe4e1',
+ moccasin: 'ffe4b5',
+ navajowhite: 'ffdead',
+ navy: '000080',
+ oldlace: 'fdf5e6',
+ olive: '808000',
+ olivedrab: '6b8e23',
+ orange: 'ffa500',
+ orangered: 'ff4500',
+ orchid: 'da70d6',
+ palegoldenrod: 'eee8aa',
+ palegreen: '98fb98',
+ paleturquoise: 'afeeee',
+ palevioletred: 'd87093',
+ papayawhip: 'ffefd5',
+ peachpuff: 'ffdab9',
+ peru: 'cd853f',
+ pink: 'ffc0cb',
+ plum: 'dda0dd',
+ powderblue: 'b0e0e6',
+ purple: '800080',
+ red: 'f00',
+ rosybrown: 'bc8f8f',
+ royalblue: '4169e1',
+ saddlebrown: '8b4513',
+ salmon: 'fa8072',
+ sandybrown: 'f4a460',
+ seagreen: '2e8b57',
+ seashell: 'fff5ee',
+ sienna: 'a0522d',
+ silver: 'c0c0c0',
+ skyblue: '87ceeb',
+ slateblue: '6a5acd',
+ slategray: '708090',
+ slategrey: '708090',
+ snow: 'fffafa',
+ springgreen: '00ff7f',
+ steelblue: '4682b4',
+ tan: 'd2b48c',
+ teal: '008080',
+ thistle: 'd8bfd8',
+ tomato: 'ff6347',
+ turquoise: '40e0d0',
+ violet: 'ee82ee',
+ wheat: 'f5deb3',
+ white: 'fff',
+ whitesmoke: 'f5f5f5',
+ yellow: 'ff0',
+ yellowgreen: '9acd32'
+};
View
@@ -21,8 +21,8 @@ <h1>color component</h1>
nuetral = document.getElementById('nuetral'),
dark = document.getElementById('dark');
- var col = '#C8272B',
- darken = color.darken(col, 1);
+ var col = 'red',
+ darken = color.darken(col, .5);
lighten = color.lighten(col, .5);
console.log(darken, col, lighten);
light.style.backgroundColor = lighten;

0 comments on commit 574051b

Please sign in to comment.