fix colors.

README.md

@@ -4,6 +4,10 @@ A curses-like library for node.js.
 
 ![blessed](https://raw.github.com/chjj/blessed/master/img/screenshot.png)
 
+`` bash
+$ npm install blessed
+``
+
 ## Example
 
 This will render a box with ascii borders containing the text `'Hello world!'`,

lib/colors.js

@@ -5,44 +5,48 @@
 // Try to match a hex code to a terminal color as best as possible.
 // This entire function assumes the terminal user is using the
 // default xterm colors.
-exports.matchColor = function(col) {
-  if (col[0] !== '#') {
-    return col;
+exports.matchColor = function(hex) {
+  if (hex[0] !== '#') {
+    return hex;
   }
 
-  if (col.length === 4) {
-    col = col[0]
-      + col[1] + col[1]
-      + col[2] + col[2]
-      + col[3] + col[3];
+  if (hex.length === 4) {
+    hex = hex[0]
+      + hex[1] + hex[1]
+      + hex[2] + hex[2]
+      + hex[3] + hex[3];
   }
 
-  if (exports._cache[col] != null) {
-    return exports._cache[col];
+  if (exports._cache[hex] != null) {
+    return exports._cache[hex];
   }
 
-  var col_ = parseInt(col.substring(1), 16)
-    , r = (col_ >> 16) & 0xff
-    , g = (col_ >> 8) & 0xff
-    , b = col_ & 0xff
+  var col = parseInt(hex.substring(1), 16)
+    , r1 = (col >> 16) & 0xff
+    , g1 = (col >> 8) & 0xff
+    , b1 = col & 0xff
     , ldiff = Infinity
     , li = -1
     , i = 0
     , c
-    , tr
-    , tg
-    , tb
+    , r2
+    , g2
+    , b2
     , diff;
 
   for (; i < exports.vcolors.length; i++) {
     c = exports.vcolors[i];
-    tr = c[0];
-    tg = c[1];
-    tb = c[2];
+    r2 = c[0];
+    g2 = c[1];
+    b2 = c[2];
 
-    diff = Math.abs(r - tr)
-      + Math.abs(g - tg)
-      + Math.abs(b - tb);
+    if (r1 === r2 && g1 === g2 && b1 === b2) {
+      diff = 0;
+    } else {
+      // diff = colorDistance3d(r1, g1, b1, r2, g2, b2);
+      diff = colorDistance3dWeight(r1, g1, b1, r2, g2, b2);
+      // diff = colorDistance3dWeightSqrt(r1, g1, b1, r2, g2, b2);
+    }
 
     if (diff === 0) {
       li = i;
@@ -55,9 +59,54 @@ exports.matchColor = function(col) {
     }
   }
 
-  return exports._cache[col] = li;
+  return exports._cache[hex] = li;
 };
 
+// As it happens, comparing how similar two colors are is really hard. Here is
+// one of the simplest solutions, which doesn't require conversion to another
+// color space, posted on stackoverflow. Maybe someone better at math can
+// propose a superior solution.
+
+// http://stackoverflow.com/questions/9018016
+function colorDistance3d(r1, g1, b1, r2, g2, b2) {
+  var d;
+
+  d = Math.sqrt(
+    Math.pow(r2 - r1, 2)
+    + Math.pow(g2 - g1, 2)
+    + Math.pow(b2 - b1, 2));
+
+  d /= Math.sqrt(
+    Math.pow(255, 2)
+    + Math.pow(255, 2)
+    + Math.pow(255, 2));
+
+  return d;
+}
+
+// http://stackoverflow.com/questions/1633828
+function colorDistance3dWeight(r1, g1, b1, r2, g2, b2) {
+  return Math.pow(30 * (r1 - r2), 2)
+    + Math.pow(59 * (g1 - g2), 2)
+    + Math.pow(11 * (b1 - b2), 2);
+}
+
+function colorDistance3dWeightSqrt(r1, g1, b1, r2, g2, b2) {
+  var d;
+
+  d = Math.sqrt(
+    Math.pow(30 * (r2 - r1), 2)
+    + Math.pow(59 * (g2 - g1), 2)
+    + Math.pow(11 * (b2 - b1), 2));
+
+  d /= Math.sqrt(
+    Math.pow(255, 2)
+    + Math.pow(255, 2)
+    + Math.pow(255, 2));
+
+  return d;
+}
+
 exports._cache = {};
 
 // XTerm Colors

lib/program.js

@@ -1761,7 +1761,7 @@ Program.prototype._attr = function(param, val) {
 
       m = /^(\d+) (fg|bg)$/.exec(param);
       if (m) {
-        color = +m[1] - 1;
+        color = +m[1];
 
         if (val === false) {
           return this._attr('default ' + m[2]);

lib/widget.js

@@ -1513,7 +1513,7 @@ Element.prototype.parseContent = function() {
 Element.prototype._parseTags = function(text) {
   if (!this.parseTags) return text;
   var program = this.screen.program;
-  return text.replace(/{(\/?)([\w\-,;!]*)}/g, function(tag, slash, color) {
+  return text.replace(/{(\/?)([\w\-,;!#]*)}/g, function(tag, slash, color) {
     if (!color) return slash ? '\x1b[m' : tag;
 
     color = color.replace(/-/g, ' ');