Subversion Repositories SmartDukaan

/* Plugin for jQuery for working with colors.

 * 

 * Version 1.1.

 * 

 * Inspiration from jQuery color animation plugin by John Resig.

 *

 * Released under the MIT license by Ole Laursen, October 2009.

 *

 * Examples:

 *

 *   $.color.parse("#fff").scale('rgb', 0.25).add('a', -0.5).toString()

 *   var c = $.color.extract($("#mydiv"), 'background-color');

 *   console.log(c.r, c.g, c.b, c.a);

 *   $.color.make(100, 50, 25, 0.4).toString() // returns "rgba(100,50,25,0.4)"

 *

 * Note that .scale() and .add() return the same modified object

 * instead of making a new one.

 *

 * V. 1.1: Fix error handling so e.g. parsing an empty string does

 * produce a color rather than just crashing.

 */ 

(function($) {

    $.color = {};

    // construct color object with some convenient chainable helpers

    $.color.make = function (r, g, b, a) {

        var o = {};

        o.r = r || 0;

        o.g = g || 0;

        o.b = b || 0;

        o.a = a != null ? a : 1;

        o.add = function (c, d) {

            for (var i = 0; i < c.length; ++i)

                o[c.charAt(i)] += d;

            return o.normalize();

        };

        o.scale = function (c, f) {

            for (var i = 0; i < c.length; ++i)

                o[c.charAt(i)] *= f;

            return o.normalize();

        };

        o.toString = function () {

            if (o.a >= 1.0) {

                return "rgb("+[o.r, o.g, o.b].join(",")+")";

            } else {

                return "rgba("+[o.r, o.g, o.b, o.a].join(",")+")";

            }

        };

        o.normalize = function () {

            function clamp(min, value, max) {

                return value < min ? min: (value > max ? max: value);

            }

            o.r = clamp(0, parseInt(o.r), 255);

            o.g = clamp(0, parseInt(o.g), 255);

            o.b = clamp(0, parseInt(o.b), 255);

            o.a = clamp(0, o.a, 1);

            return o;

        };

        o.clone = function () {

            return $.color.make(o.r, o.b, o.g, o.a);

        };

        return o.normalize();

    }

    // extract CSS color property from element, going up in the DOM

    // if it's "transparent"

    $.color.extract = function (elem, css) {

        var c;

        do {

            c = elem.css(css).toLowerCase();

            // keep going until we find an element that has color, or

            // we hit the body

            if (c != '' && c != 'transparent')

                break;

            elem = elem.parent();

        } while (!$.nodeName(elem.get(0), "body"));

        // catch Safari's way of signalling transparent

        if (c == "rgba(0, 0, 0, 0)")

            c = "transparent";

        return $.color.parse(c);

    }

    // parse CSS color string (like "rgb(10, 32, 43)" or "#fff"),

    // returns color object, if parsing failed, you get black (0, 0,

    // 0) out

    $.color.parse = function (str) {

        var res, m = $.color.make;

        // Look for rgb(num,num,num)

        if (res = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(str))

            return m(parseInt(res[1], 10), parseInt(res[2], 10), parseInt(res[3], 10));

        // Look for rgba(num,num,num,num)

        if (res = /rgba\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(str))

            return m(parseInt(res[1], 10), parseInt(res[2], 10), parseInt(res[3], 10), parseFloat(res[4]));

        // Look for rgb(num%,num%,num%)

        if (res = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(str))

            return m(parseFloat(res[1])*2.55, parseFloat(res[2])*2.55, parseFloat(res[3])*2.55);

        // Look for rgba(num%,num%,num%,num)

        if (res = /rgba\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\s*\)/.exec(str))

            return m(parseFloat(res[1])*2.55, parseFloat(res[2])*2.55, parseFloat(res[3])*2.55, parseFloat(res[4]));

        // Look for #a0b1c2

        if (res = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(str))

            return m(parseInt(res[1], 16), parseInt(res[2], 16), parseInt(res[3], 16));

        // Look for #fff

        if (res = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(str))

            return m(parseInt(res[1]+res[1], 16), parseInt(res[2]+res[2], 16), parseInt(res[3]+res[3], 16));

        // Otherwise, we're most likely dealing with a named color

        var name = $.trim(str).toLowerCase();

        if (name == "transparent")

            return m(255, 255, 255, 0);

        else {

            // default to black

            res = lookupColors[name] || [0, 0, 0];

            return m(res[0], res[1], res[2]);

        }

    }

    var lookupColors = {

        aqua:[0,255,255],

        azure:[240,255,255],

        beige:[245,245,220],

        black:[0,0,0],

        blue:[0,0,255],

        brown:[165,42,42],

        cyan:[0,255,255],

        darkblue:[0,0,139],

        darkcyan:[0,139,139],

        darkgrey:[169,169,169],

        darkgreen:[0,100,0],

        darkkhaki:[189,183,107],

        darkmagenta:[139,0,139],

        darkolivegreen:[85,107,47],

        darkorange:[255,140,0],

        darkorchid:[153,50,204],

        darkred:[139,0,0],

        darksalmon:[233,150,122],

        darkviolet:[148,0,211],

        fuchsia:[255,0,255],

        gold:[255,215,0],

        green:[0,128,0],

        indigo:[75,0,130],

        khaki:[240,230,140],

        lightblue:[173,216,230],

        lightcyan:[224,255,255],

        lightgreen:[144,238,144],

        lightgrey:[211,211,211],

        lightpink:[255,182,193],

        lightyellow:[255,255,224],

        lime:[0,255,0],

        magenta:[255,0,255],

        maroon:[128,0,0],

        navy:[0,0,128],

        olive:[128,128,0],

        orange:[255,165,0],

        pink:[255,192,203],

        purple:[128,0,128],

        violet:[128,0,128],

        red:[255,0,0],

        silver:[192,192,192],

        white:[255,255,255],

        yellow:[255,255,0]

    };

})(jQuery);