bumped version and changelog

CHANGELOG

@@ -1,3 +1,7 @@
+# 1.3.1
+
+* added color.clipped 
+
 # 1.3.0
 
 * added chroma.distance

chroma.js

@@ -82,9 +82,14 @@
   };
 
   clip_rgb = function(rgb) {
-    var i;
-    for (i in rgb) {
+    var i, o;
+    rgb._clipped = false;
+    rgb._unclipped = rgb.slice(0);
+    for (i = o = 0; o < 3; i = ++o) {
       if (i < 3) {
+        if (rgb[i] < 0 || rgb[i] > 255) {
+          rgb._clipped = true;
+        }
         if (rgb[i] < 0) {
           rgb[i] = 0;
         }
@@ -100,6 +105,9 @@
         }
       }
     }
+    if (!rgb._clipped) {
+      delete rgb._unclipped;
+    }
     return rgb;
   };
 
@@ -448,9 +456,6 @@
     r = xyz_rgb(3.2404542 * x - 1.5371385 * y - 0.4985314 * z);
     g = xyz_rgb(-0.9692660 * x + 1.8760108 * y + 0.0415560 * z);
     b = xyz_rgb(0.0556434 * x - 0.2040259 * y + 1.0572252 * z);
-    r = limit(r, 0, 255);
-    g = limit(g, 0, 255);
-    b = limit(b, 0, 255);
     return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
@@ -854,7 +859,7 @@
       round = true;
     }
     if (!round) {
-      return this._rgb;
+      return this._rgb.slice(0);
     }
     return [Math.round(this._rgb[0]), Math.round(this._rgb[1]), Math.round(this._rgb[2]), this._rgb[3]];
   };
@@ -1089,9 +1094,6 @@
           ref5 = [v, p, q], r = ref5[0], g = ref5[1], b = ref5[2];
       }
     }
-    r = round(r);
-    g = round(g);
-    b = round(b);
     return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
@@ -1224,9 +1226,6 @@
           ref5 = [v, p, q], r = ref5[0], g = ref5[1], b = ref5[2];
       }
     }
-    r = round(r);
-    g = round(g);
-    b = round(b);
     return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
@@ -1420,7 +1419,7 @@
     l = args[0], c = args[1], h = args[2];
     ref = lch2lab(l, c, h), L = ref[0], a = ref[1], b = ref[2];
     ref1 = lab2rgb(L, a, b), r = ref1[0], g = ref1[1], b = ref1[2];
-    return [limit(r, 0, 255), limit(g, 0, 255), limit(b, 0, 255), args.length > 3 ? args[3] : 1];
+    return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
   lab2lch = function() {
@@ -1665,7 +1664,7 @@
       g = 325.4494125711974 + 0.07943456536662342 * (g = temp - 50) - 28.0852963507957 * log(g);
       b = 255;
     }
-    return clip_rgb([r, g, b]);
+    return [r, g, b];
   };
 
   rgb2temperature = function() {
@@ -1836,12 +1835,13 @@
     return chroma(src, mode).alpha(me.alpha());
   };
 
+  Color.prototype.clipped = function() {
+    return this._rgb._clipped || false;
+  };
+
   Color.prototype.alpha = function(a) {
-    var rgba;
     if (arguments.length) {
-      rgba = this._rgb.slice(0, 3);
-      rgba.push(a);
-      return chroma.rgb(rgba);
+      return chroma.rgb([this._rgb[0], this._rgb[1], this._rgb[2], a]);
     }
     return this._rgb[3];
   };

docs/index.html

@@ -306,7 +306,7 @@ <h3 id="color-lch">color.lch</h3>
 <pre><code class="lang-js">chroma(&#39;skyblue&#39;).lch()
 </code></pre>
 <h3 id="color-hcl">color.hcl</h3>
-<p>Essentially an alias of <a href="#color-lch">lch</a>, but with the components in reverse order.</p>
+<p>Alias of <a href="#color-lch">lch</a>, but with the components in reverse order.</p>
 <pre><code class="lang-js">chroma(&#39;skyblue&#39;).hcl()
 </code></pre>
 <h3 id="color-temperature">color.temperature</h3>
@@ -318,8 +318,20 @@ <h3 id="color-temperature">color.temperature</h3>
 chroma(&#39;#b3ccff&#39;).temperature();
 </code></pre>
 <h3 id="color-gl">color.gl</h3>
+<p>Like RGB, but in the channel range of <code>[0..1]</code> instead of <code>[0..255]</code></p>
 <pre><code class="lang-js">chroma(&#39;33cc00&#39;).gl();
 </code></pre>
+<h3 id="color-clipped">color.clipped</h3>
+<p>When converting colors from CIELab color spaces to RGB the color channels get clipped to the range of <code>[0..255]</code>. Colors outside that range may exist in nature but are not displayable on RGB monitors (such as ultraviolet). you can use color.clipped to test if a color has been clipped or not.</p>
+<pre><code class="lang-js">[c = chroma.hcl(50, 40, 20), c.clipped()];
+[c = chroma.hcl(50, 40, 40), c.clipped()];
+[c = chroma.hcl(50, 40, 60), c.clipped()];
+[c = chroma.hcl(50, 40, 80), c.clipped()];
+[c = chroma.hcl(50, 40, 100), c.clipped()];
+</code></pre>
+<p>As a bonus feature you can access the unclipped RGB components using <code>_unclipped</code>.</p>
+<pre><code class="lang-js">[c = chroma.hcl(50, 40, 100), c._unclipped];
+</code></pre>
 <h2 id="color-scales">color scales</h2>
 <h3 id="chroma-scale">chroma.scale</h3>
 <h4 id="-colors-white-black-">(colors=[&#39;white&#39;,&#39;black&#39;])</h4>
@@ -539,7 +551,10 @@ <h3 id="cubehelix-scale">cubehelix.scale</h3>
                 return resLong(d);
 
                 function resLong(d) {
-                    if (typeof d == 'string') {
+                    if (typeof d == 'boolean') {
+                        return '<span class="cm-number">'+(d ? 'true' : 'false')+'</span>';
+
+                    } else if (typeof d == 'string') {
                         // string color, e.g. hex value
                         return '<span class="cm-string">"'+d+'"</span>';
                     } else if (typeof d == 'object' && d._rgb) {

docs/libs/chroma.js

@@ -82,9 +82,14 @@
   };
 
   clip_rgb = function(rgb) {
-    var i;
-    for (i in rgb) {
+    var i, o;
+    rgb._clipped = false;
+    rgb._unclipped = rgb.slice(0);
+    for (i = o = 0; o < 3; i = ++o) {
       if (i < 3) {
+        if (rgb[i] < 0 || rgb[i] > 255) {
+          rgb._clipped = true;
+        }
         if (rgb[i] < 0) {
           rgb[i] = 0;
         }
@@ -100,6 +105,9 @@
         }
       }
     }
+    if (!rgb._clipped) {
+      delete rgb._unclipped;
+    }
     return rgb;
   };
 
@@ -448,9 +456,6 @@
     r = xyz_rgb(3.2404542 * x - 1.5371385 * y - 0.4985314 * z);
     g = xyz_rgb(-0.9692660 * x + 1.8760108 * y + 0.0415560 * z);
     b = xyz_rgb(0.0556434 * x - 0.2040259 * y + 1.0572252 * z);
-    r = limit(r, 0, 255);
-    g = limit(g, 0, 255);
-    b = limit(b, 0, 255);
     return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
@@ -854,7 +859,7 @@
       round = true;
     }
     if (!round) {
-      return this._rgb;
+      return this._rgb.slice(0);
     }
     return [Math.round(this._rgb[0]), Math.round(this._rgb[1]), Math.round(this._rgb[2]), this._rgb[3]];
   };
@@ -1089,9 +1094,6 @@
           ref5 = [v, p, q], r = ref5[0], g = ref5[1], b = ref5[2];
       }
     }
-    r = round(r);
-    g = round(g);
-    b = round(b);
     return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
@@ -1224,9 +1226,6 @@
           ref5 = [v, p, q], r = ref5[0], g = ref5[1], b = ref5[2];
       }
     }
-    r = round(r);
-    g = round(g);
-    b = round(b);
     return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
@@ -1420,7 +1419,7 @@
     l = args[0], c = args[1], h = args[2];
     ref = lch2lab(l, c, h), L = ref[0], a = ref[1], b = ref[2];
     ref1 = lab2rgb(L, a, b), r = ref1[0], g = ref1[1], b = ref1[2];
-    return [limit(r, 0, 255), limit(g, 0, 255), limit(b, 0, 255), args.length > 3 ? args[3] : 1];
+    return [r, g, b, args.length > 3 ? args[3] : 1];
   };
 
   lab2lch = function() {
@@ -1665,7 +1664,7 @@
       g = 325.4494125711974 + 0.07943456536662342 * (g = temp - 50) - 28.0852963507957 * log(g);
       b = 255;
     }
-    return clip_rgb([r, g, b]);
+    return [r, g, b];
   };
 
   rgb2temperature = function() {
@@ -1836,12 +1835,13 @@
     return chroma(src, mode).alpha(me.alpha());
   };
 
+  Color.prototype.clipped = function() {
+    return this._rgb._clipped || false;
+  };
+
   Color.prototype.alpha = function(a) {
-    var rgba;
     if (arguments.length) {
-      rgba = this._rgb.slice(0, 3);
-      rgba.push(a);
-      return chroma.rgb(rgba);
+      return chroma.rgb([this._rgb[0], this._rgb[1], this._rgb[2], a]);
     }
     return this._rgb[3];
   };

docs/src/footer.inc.html

@@ -55,7 +55,10 @@
                 return resLong(d);
 
                 function resLong(d) {
-                    if (typeof d == 'string') {
+                    if (typeof d == 'boolean') {
+                        return '<span class="cm-number">'+(d ? 'true' : 'false')+'</span>';
+
+                    } else if (typeof d == 'string') {
                         // string color, e.g. hex value
                         return '<span class="cm-string">"'+d+'"</span>';
                     } else if (typeof d == 'object' && d._rgb) {

docs/src/index.css

@@ -147,17 +147,18 @@ pre .CodeMirror:hover, pre .CodeMirror:focus {
 }
 
 .result-display .cm-string {
-    padding: 2px 4px;
+    padding: 0px 4px;
     display: inline-block;
     min-width: 9px;
-    min-height: 13px;
+    min-height: 12px;
     border-radius: 3px;
+    box-sizing: border-box;
+    position: relative;
     vertical-align: bottom;
     margin-left: 2px;
     margin-bottom: 2px;
     position: relative;
-    top: 2px;
-    /**/
+    top: 1px;
 }
 
 .result-display .cm-string:before {

package.json

@@ -1,7 +1,7 @@
 {
   "name": "chroma-js",
   "description": "JavaScript library for color conversions",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "author": "Gregor Aisch",
   "homepage": "https://github.com/gka/chroma.js",
   "keywords": [