vanderlee/colorpicker — Issue #20: Support for ARGB format
Author: jasonatepaint
Created: 2012-03-07 23:32:11+00:00
State: open

I recently updated your code to handle the ARGB format inbound, since most of the content I deal with is in that format. I updated Color._parseHex() to look like this:

_parseHex: function (color) {
var name = $.trim(color).toLowerCase(),
c,
m;

if (_colors[name]) {
c = _colors[name];
return [c[0] / 255, c[1] / 255, c[2] / 255];
}

//Handle Alpha
var alpha = 255;
if (color.length >= 8) {
if (color.substring(0, 1) == "#")
color = color.substring(1, color.length - 1);
alpha = parseInt(color.substring(0, 2), 16);
color = color.substring(2, 8);
}

// {#}rrggbb
m = /^#?([a-fA-F0-9]{0,6})/.exec(color);
if (m) {
c = parseInt(m[1], 16);
return [((c >> 16) & 0xFF) / 255,
((c >> 8) & 0xFF) / 255,
(c & 0xFF) / 255,
alpha / 255];
}
}

It wasn't too difficult to get this to work, but wanted to make you aware of your method Color.toHexAlpha() is not correct.

Basically the Alpha hex was always wrong because the value was being calculated against 100 instead of 255. I grabbed your _intToHex() method and applied it inside of toHexAlpha() and everything is happy again.

this.toHexAlpha = function () {
var dec = this.a * 255;
var result = Math.round(dec).toString(16);
if (result.length === 1) {
result = ('0' + result);
}
return result.toLowerCase();
};

Additionally, I modified the following line in the _change function:

} else if (!this.color.equals(this._parseHex(this.element.val()))) {
this.element.val(this.color.toHexAlpha() + this.color.toHex());
}

This is obviously "ARGB" specific, but it seems like the widget could ask for a specific output format, that way any of your parse-supported methods could be the output value.