/*jshint evil:true, onevar:false*/ /*global define*/ var installedColorSpaces = [], namedColors = {}, undef = function (obj) { return typeof obj === 'undefined'; }, channelRegExp = /\s*(\.\d+|\d+(?:\.\d+)?)(%)?\s*/, alphaChannelRegExp = /\s*(\.\d+|\d+(?:\.\d+)?)\s*/, cssColorRegExp = new RegExp( "^(rgb|hsl|hsv)a?" + "\\(" + channelRegExp.source + "," + channelRegExp.source + "," + channelRegExp.source + "(?:," + alphaChannelRegExp.source + ")?" + "\\)$", "i"); function ONECOLOR(obj) { if (Object.prototype.toString.apply(obj) === '[object Array]') { if (typeof obj[0] === 'string' && typeof ONECOLOR[obj[0]] === 'function') { // Assumed array from .toJSON() return new ONECOLOR[obj[0]](obj.slice(1, obj.length)); } else if (obj.length === 4) { // Assumed 4 element int RGB array from canvas with all channels [0;255] return new ONECOLOR.RGB(obj[0] / 255, obj[1] / 255, obj[2] / 255, obj[3] / 255); } } else if (typeof obj === 'string') { var lowerCased = obj.toLowerCase(); if (namedColors[lowerCased]) { obj = '#' + namedColors[lowerCased]; } if (lowerCased === 'transparent') { obj = 'rgba(0,0,0,0)'; } // Test for CSS rgb(....) string var matchCssSyntax = obj.match(cssColorRegExp); if (matchCssSyntax) { var colorSpaceName = matchCssSyntax[1].toUpperCase(), alpha = undef(matchCssSyntax[8]) ? matchCssSyntax[8] : parseFloat(matchCssSyntax[8]), hasHue = colorSpaceName[0] === 'H', firstChannelDivisor = matchCssSyntax[3] ? 100 : (hasHue ? 360 : 255), secondChannelDivisor = (matchCssSyntax[5] || hasHue) ? 100 : 255, thirdChannelDivisor = (matchCssSyntax[7] || hasHue) ? 100 : 255; if (undef(ONECOLOR[colorSpaceName])) { throw new Error("one.color." + colorSpaceName + " is not installed."); } return new ONECOLOR[colorSpaceName]( parseFloat(matchCssSyntax[2]) / firstChannelDivisor, parseFloat(matchCssSyntax[4]) / secondChannelDivisor, parseFloat(matchCssSyntax[6]) / thirdChannelDivisor, alpha ); } // Assume hex syntax if (obj.length < 6) { // Allow CSS shorthand obj = obj.replace(/^#?([0-9a-f])([0-9a-f])([0-9a-f])$/i, '$1$1$2$2$3$3'); } // Split obj into red, green, and blue components var hexMatch = obj.match(/^#?([0-9a-f][0-9a-f])([0-9a-f][0-9a-f])([0-9a-f][0-9a-f])$/i); if (hexMatch) { return new ONECOLOR.RGB( parseInt(hexMatch[1], 16) / 255, parseInt(hexMatch[2], 16) / 255, parseInt(hexMatch[3], 16) / 255 ); } } else if (typeof obj === 'object' && obj.isColor) { return obj; } return false; } function installColorSpace(colorSpaceName, propertyNames, config) { ONECOLOR[colorSpaceName] = new Function(propertyNames.join(","), // Allow passing an array to the constructor: "if (Object.prototype.toString.apply(" + propertyNames[0] + ") === '[object Array]') {" + propertyNames.map(function (propertyName, i) { return propertyName + "=" + propertyNames[0] + "[" + i + "];"; }).reverse().join("") + "}" + "if (" + propertyNames.filter(function (propertyName) { return propertyName !== 'alpha'; }).map(function (propertyName) { return "isNaN(" + propertyName + ")"; }).join("||") + "){" + "throw new Error(\"[" + colorSpaceName + "]: Invalid color: (\"+" + propertyNames.join("+\",\"+") + "+\")\");}" + propertyNames.map(function (propertyName) { if (propertyName === 'hue') { return "this._hue=hue<0?hue-Math.floor(hue):hue%1"; // Wrap } else if (propertyName === 'alpha') { return "this._alpha=(isNaN(alpha)||alpha>1)?1:(alpha<0?0:alpha);"; } else { return "this._" + propertyName + "=" + propertyName + "<0?0:(" + propertyName + ">1?1:" + propertyName + ")"; } }).join(";") + ";" ); ONECOLOR[colorSpaceName].propertyNames = propertyNames; var prototype = ONECOLOR[colorSpaceName].prototype; ['valueOf', 'hex', 'hexa', 'css', 'cssa'].forEach(function (methodName) { prototype[methodName] = prototype[methodName] || (colorSpaceName === 'RGB' ? prototype.hex : new Function("return this.rgb()." + methodName + "();")); }); prototype.isColor = true; prototype.equals = function (otherColor, epsilon) { if (undef(epsilon)) { epsilon = 1e-10; } otherColor = otherColor[colorSpaceName.toLowerCase()](); for (var i = 0; i < propertyNames.length; i = i + 1) { if (Math.abs(this['_' + propertyNames[i]] - otherColor['_' + propertyNames[i]]) > epsilon) { return false; } } return true; }; prototype.toJSON = new Function( "return ['" + colorSpaceName + "', " + propertyNames.map(function (propertyName) { return "this._" + propertyName; }, this).join(", ") + "];" ); for (var propertyName in config) { if (config.hasOwnProperty(propertyName)) { var matchFromColorSpace = propertyName.match(/^from(.*)$/); if (matchFromColorSpace) { ONECOLOR[matchFromColorSpace[1].toUpperCase()].prototype[colorSpaceName.toLowerCase()] = config[propertyName]; } else { prototype[propertyName] = config[propertyName]; } } } // It is pretty easy to implement the conversion to the same color space: prototype[colorSpaceName.toLowerCase()] = function () { return this; }; prototype.toString = new Function("return \"[one.color." + colorSpaceName + ":\"+" + propertyNames.map(function (propertyName, i) { return "\" " + propertyNames[i] + "=\"+this._" + propertyName; }).join("+") + "+\"]\";"); // Generate getters and setters propertyNames.forEach(function (propertyName, i) { prototype[propertyName] = prototype[propertyName === 'black' ? 'k' : propertyName[0]] = new Function("value", "isDelta", // Simple getter mode: color.red() "if (typeof value === 'undefined') {" + "return this._" + propertyName + ";" + "}" + // Adjuster: color.red(+.2, true) "if (isDelta) {" + "return new this.constructor(" + propertyNames.map(function (otherPropertyName, i) { return "this._" + otherPropertyName + (propertyName === otherPropertyName ? "+value" : ""); }).join(", ") + ");" + "}" + // Setter: color.red(.2); "return new this.constructor(" + propertyNames.map(function (otherPropertyName, i) { return propertyName === otherPropertyName ? "value" : "this._" + otherPropertyName; }).join(", ") + ");"); }); function installForeignMethods(targetColorSpaceName, sourceColorSpaceName) { var obj = {}; obj[sourceColorSpaceName.toLowerCase()] = new Function("return this.rgb()." + sourceColorSpaceName.toLowerCase() + "();"); // Fallback ONECOLOR[sourceColorSpaceName].propertyNames.forEach(function (propertyName, i) { obj[propertyName] = obj[propertyName === 'black' ? 'k' : propertyName[0]] = new Function("value", "isDelta", "return this." + sourceColorSpaceName.toLowerCase() + "()." + propertyName + "(value, isDelta);"); }); for (var prop in obj) { if (obj.hasOwnProperty(prop) && ONECOLOR[targetColorSpaceName].prototype[prop] === undefined) { ONECOLOR[targetColorSpaceName].prototype[prop] = obj[prop]; } } } installedColorSpaces.forEach(function (otherColorSpaceName) { installForeignMethods(colorSpaceName, otherColorSpaceName); installForeignMethods(otherColorSpaceName, colorSpaceName); }); installedColorSpaces.push(colorSpaceName); } ONECOLOR.installMethod = function (name, fn) { installedColorSpaces.forEach(function (colorSpace) { ONECOLOR[colorSpace].prototype[name] = fn; }); }; installColorSpace('RGB', ['red', 'green', 'blue', 'alpha'], { hex: function () { var hexString = (Math.round(255 * this._red) * 0x10000 + Math.round(255 * this._green) * 0x100 + Math.round(255 * this._blue)).toString(16); return '#' + ('00000'.substr(0, 6 - hexString.length)) + hexString; }, hexa: function () { var alphaString = Math.round(this._alpha * 255).toString(16); return '#' + '00'.substr(0, 2 - alphaString.length) + alphaString + this.hex().substr(1, 6); }, css: function () { return "rgb(" + Math.round(255 * this._red) + "," + Math.round(255 * this._green) + "," + Math.round(255 * this._blue) + ")"; }, cssa: function () { return "rgba(" + Math.round(255 * this._red) + "," + Math.round(255 * this._green) + "," + Math.round(255 * this._blue) + "," + this._alpha + ")"; } }); if (typeof module !== 'undefined') { // Node module export module.exports = ONECOLOR; } else if (typeof define === 'function' && !undef(define.amd)) { define([], function () { return ONECOLOR; }); } else if (typeof jQuery !== 'undefined' && undef(jQuery.color)) { jQuery.color = ONECOLOR; } else { one = window.one || {}; one.color = ONECOLOR; } /*global one*/ installColorSpace('HSV', ['hue', 'saturation', 'value', 'alpha'], { rgb: function () { var hue = this._hue, saturation = this._saturation, value = this._value, i = Math.min(5, Math.floor(hue * 6)), f = hue * 6 - i, p = value * (1 - saturation), q = value * (1 - f * saturation), t = value * (1 - (1 - f) * saturation), red, green, blue; switch (i) { case 0: red = value; green = t; blue = p; break; case 1: red = q; green = value; blue = p; break; case 2: red = p; green = value; blue = t; break; case 3: red = p; green = q; blue = value; break; case 4: red = t; green = p; blue = value; break; case 5: red = value; green = p; blue = q; break; } return new ONECOLOR.RGB(red, green, blue, this._alpha); }, hsl: function () { var l = (2 - this._saturation) * this._value, sv = this._saturation * this._value, svDivisor = l <= 1 ? l : (2 - l), saturation; // Avoid division by zero when lightness approaches zero: if (svDivisor < 1e-9) { saturation = 0; } else { saturation = sv / svDivisor; } return new ONECOLOR.HSL(this._hue, saturation, l / 2, this._alpha); }, fromRgb: function () { // Becomes one.color.RGB.prototype.hsv var red = this._red, green = this._green, blue = this._blue, max = Math.max(red, green, blue), min = Math.min(red, green, blue), delta = max - min, hue, saturation = (max === 0) ? 0 : (delta / max), value = max; if (delta === 0) { hue = 0; } else { switch (max) { case red: hue = (green - blue) / delta / 6 + (green < blue ? 1 : 0); break; case green: hue = (blue - red) / delta / 6 + 1 / 3; break; case blue: hue = (red - green) / delta / 6 + 2 / 3; break; } } return new ONECOLOR.HSV(hue, saturation, value, this._alpha); } }); /*global one*/ installColorSpace('HSL', ['hue', 'saturation', 'lightness', 'alpha'], { hsv: function () { // Algorithm adapted from http://wiki.secondlife.com/wiki/Color_conversion_scripts var l = this._lightness * 2, s = this._saturation * ((l <= 1) ? l : 2 - l), saturation; // Avoid division by zero when l + s is very small (approaching black): if (l + s < 1e-9) { saturation = 0; } else { saturation = (2 * s) / (l + s); } return new ONECOLOR.HSV(this._hue, saturation, (l + s) / 2, this._alpha); }, rgb: function () { return this.hsv().rgb(); }, fromRgb: function () { // Becomes one.color.RGB.prototype.hsv return this.hsv().hsl(); } }); /*global one*/ // This file is purely for the build system