Open programmin1 opened 9 years ago
It also turns 8B0E04 into 8B0D04, (a color which is probably indistinguishable to most users).
This bug still exists, #00b9b4 can never be entered into the color picker for example.
Yes, its a problem. Think how to solve it...
Checked, color clear may be lost with conversion hex to hsb.
So, we have approximate backward clear
Here is a fixed version of this component that fixes the translation issues from RGB to HSB etc.
/**
*
* Color picker
* Author: Stefan Petre www.eyecon.ro
*
* Dual licensed under the MIT and GPL licenses
*
*/
(function($) {
var ColorPicker = function() {
var
ids = {},
inAction,
charMin = 65,
visible,
tpl = '<div class="ui-colorpicker-container"><div class="ui-colorpicker_color"><div><div></div></div></div><div class="ui-colorpicker_hue"><div></div></div><div class="ui-colorpicker_new_color"></div><div class="ui-colorpicker_hex"><input type="text" maxlength="6" size="6" /></div><div class="ui-colorpicker_rgb_r ui-colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="ui-colorpicker_rgb_g ui-colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="ui-colorpicker_rgb_b ui-colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="ui-colorpicker_hsb_h ui-colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="ui-colorpicker_hsb_s ui-colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="ui-colorpicker_hsb_b ui-colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div></div>',
defaults = {
eventName: 'click',
onShow: function() {},
onBeforeShow: function() {},
onHide: function() {},
onChange: function() {},
onSubmit: function() {},
color: 'ff0000',
livePreview: true,
flat: false
},
fillRGBFields = function(hsb, cal) {
var rgb = HSBToRGB(hsb);
$(cal).data('colorpicker').fields
.eq(1).val(rgb.r).end()
.eq(2).val(rgb.g).end()
.eq(3).val(rgb.b).end();
},
fillHSBFields = function(hsb, cal) {
$(cal).data('colorpicker').fields
.eq(4).val(hsb.h).end()
.eq(5).val(hsb.s).end()
.eq(6).val(hsb.b).end();
},
fillHexFields = function(hsb, cal) {
$(cal).data('colorpicker').fields
.eq(0).val(HSBToHex(hsb)).end();
},
setSelector = function(hsb, cal) {
$(cal).data('colorpicker').selector.css('backgroundColor', '#' + HSBToHex({
h: hsb.h,
s: 100,
b: 100
}));
$(cal).data('colorpicker').selectorIndic.css({
left: String(parseInt(150 * hsb.s / 100, 10)),
top: String(parseInt(150 * (100 - hsb.b) / 100, 10))
});
},
setHue = function(hsb, cal) {
$(cal).data('colorpicker').hue.css('top', String(parseInt(150 - 150 * hsb.h / 360, 10)));
},
setCurrentColor = function(hsb, cal) {
$(cal).data('colorpicker').currentColor.css('backgroundColor', '#' + HSBToHex(hsb));
},
setNewColor = function(hsb, cal) {
$(cal).data('colorpicker').newColor.css('backgroundColor', '#' + HSBToHex(hsb));
},
keyDown = function(ev) {
var pressedKey = ev.charCode || ev.keyCode || -1;
if ((pressedKey > charMin && pressedKey <= 90) || pressedKey == 32) {
return false;
}
var cal = $(this).parent().parent();
if (cal.data('colorpicker').livePreview === true) {
change.apply(this);
}
},
change = function(ev) {
var cal = $(this).parent().parent(),
col;
if (this.parentNode.className.indexOf('_hex') > 0) {
cal.data('colorpicker').color = col = HexToHSB(fixHex(this.value));
} else if (this.parentNode.className.indexOf('_hsb') > 0) {
cal.data('colorpicker').color = col = fixHSB({
h: parseInt(cal.data('colorpicker').fields.eq(4).val(), 10),
s: parseInt(cal.data('colorpicker').fields.eq(5).val(), 10),
b: parseInt(cal.data('colorpicker').fields.eq(6).val(), 10)
});
} else {
cal.data('colorpicker').color = col = RGBToHSB(fixRGB({
r: parseInt(cal.data('colorpicker').fields.eq(1).val(), 10),
g: parseInt(cal.data('colorpicker').fields.eq(2).val(), 10),
b: parseInt(cal.data('colorpicker').fields.eq(3).val(), 10)
}));
}
if (ev) {
fillRGBFields(col, cal.get(0));
fillHexFields(col, cal.get(0));
fillHSBFields(col, cal.get(0));
}
setSelector(col, cal.get(0));
setHue(col, cal.get(0));
setNewColor(col, cal.get(0));
cal.data('colorpicker').onChange.apply(cal, [col, HSBToHex(col), HSBToRGB(col)]);
},
blur = function(ev) {
var cal = $(this).parent().parent();
cal.data('colorpicker').fields.parent().removeClass('colorpicker_focus');
},
focus = function() {
charMin = this.parentNode.className.indexOf('_hex') > 0 ? 70 : 65;
$(this).parent().parent().data('colorpicker').fields.parent().removeClass('colorpicker_focus');
$(this).parent().addClass('colorpicker_focus');
},
downIncrement = function(ev) {
var field = $(this).parent().find('input').trigger('focus');
var current = {
el: $(this).parent().addClass('colorpicker_slider'),
max: this.parentNode.className.indexOf('_hsb_h') > 0 ? 360 : (this.parentNode.className.indexOf('_hsb') > 0 ? 100 : 255),
y: ev.pageY,
field: field,
val: parseInt(field.val(), 10),
preview: $(this).parent().parent().data('colorpicker').livePreview
};
$(document).on('mouseup', current, upIncrement);
$(document).on('mousemove', current, moveIncrement);
},
moveIncrement = function(ev) {
ev.data.field.val(Math.max(0, Math.min(ev.data.max, parseInt(ev.data.val + ev.pageY - ev.data.y, 10))));
if (ev.data.preview) {
change.apply(ev.data.field.get(0), [true]);
}
return false;
},
upIncrement = function(ev) {
change.apply(ev.data.field.get(0), [true]);
ev.data.el.removeClass('ui-colorpicker_slider').find('input').trigger('focus');
$(document).off('mouseup', upIncrement);
$(document).off('mousemove', moveIncrement);
return false;
},
downHue = function(ev) {
var current = {
cal: $(this).parent(),
y: $(this).offset().top
};
current.preview = current.cal.data('colorpicker').livePreview;
$(document).on('mouseup', current, upHue);
$(document).on('mousemove', current, moveHue);
ev.data = current;
moveHue(ev);
},
moveHue = function(ev) {
change.apply(
ev.data.cal.data('colorpicker')
.fields
.eq(4)
.val(parseInt(360 * (150 - Math.max(0, Math.min(150, (ev.pageY - ev.data.y)))) / 150, 10))
.get(0),
[ev.data.preview]
);
return false;
},
upHue = function(ev) {
fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
$(document).off('mouseup', upHue);
$(document).off('mousemove', moveHue);
return false;
},
downSelector = function(ev) {
var current = {
cal: $(this).parent(),
pos: $(this).offset()
};
current.preview = current.cal.data('colorpicker').livePreview;
$(document).on('mouseup', current, upSelector);
$(document).on('mousemove', current, moveSelector);
ev.data = current;
moveSelector(ev);
},
moveSelector = function(ev) {
change.apply(
ev.data.cal.data('colorpicker')
.fields
.eq(6)
.val(parseInt(100 * (150 - Math.max(0, Math.min(150, (ev.pageY - ev.data.pos.top)))) / 150, 10))
.end()
.eq(5)
.val(parseInt(100 * (Math.max(0, Math.min(150, (ev.pageX - ev.data.pos.left)))) / 150, 10))
.get(0),
[ev.data.preview]
);
return false;
},
upSelector = function(ev) {
fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
$(document).off('mouseup', upSelector);
$(document).off('mousemove', moveSelector);
return false;
},
enterSubmit = function(ev) {
$(this).addClass('ui-colorpicker_focus');
},
leaveSubmit = function(ev) {
$(this).removeClass('ui-colorpicker_focus');
},
clickSubmit = function(ev) {
var cal = $(this).parent();
var col = cal.data('colorpicker').color;
cal.data('colorpicker').origColor = col;
setCurrentColor(col, cal.get(0));
cal.data('colorpicker').onSubmit(col, HSBToHex(col), HSBToRGB(col), cal.data('colorpicker').el);
},
show = function(ev) {
var cal = $('#' + $(this).data('colorpickerId'));
cal.data('colorpicker').onBeforeShow.apply(this, [cal.get(0)]);
var pos = $(this).offset();
var viewPort = getViewport();
var top = pos.top + this.offsetHeight;
var left = pos.left;
if (top + 176 > viewPort.t + viewPort.h) {
top -= this.offsetHeight + 176;
}
if (left + 356 > viewPort.l + viewPort.w) {
left -= 356;
}
cal.css({
left: left + 'px',
top: top + 'px'
});
if (cal.data('colorpicker').onShow.apply(this, [cal.get(0)]) != false) {
cal.show();
}
$(document).on('mousedown', {
cal: cal
}, hide);
return false;
},
hide = function(ev) {
if (!isChildOf(ev.data.cal.get(0), ev.target, ev.data.cal.get(0))) {
if (ev.data.cal.data('colorpicker').onHide.apply(this, [ev.data.cal.get(0)]) != false) {
ev.data.cal.hide();
}
$(document).off('mousedown', hide);
}
},
isChildOf = function(parentEl, el, container) {
if (parentEl == el) {
return true;
}
if (parentEl.contains) {
return parentEl.contains(el);
}
if (parentEl.compareDocumentPosition) {
return !!(parentEl.compareDocumentPosition(el) & 16);
}
var prEl = el.parentNode;
while (prEl && prEl != container) {
if (prEl == parentEl)
return true;
prEl = prEl.parentNode;
}
return false;
},
getViewport = function() {
var m = document.compatMode == 'CSS1Compat';
return {
l: window.pageXOffset || (m ? document.documentElement.scrollLeft : document.body.scrollLeft),
t: window.pageYOffset || (m ? document.documentElement.scrollTop : document.body.scrollTop),
w: window.innerWidth || (m ? document.documentElement.clientWidth : document.body.clientWidth),
h: window.innerHeight || (m ? document.documentElement.clientHeight : document.body.clientHeight)
};
},
fixHSB = function(hsb) {
return {
h: Math.min(360, Math.max(0, hsb.h)),
s: Math.min(100, Math.max(0, hsb.s)),
b: Math.min(100, Math.max(0, hsb.b))
};
},
fixRGB = function(rgb) {
return {
r: Math.min(255, Math.max(0, rgb.r)),
g: Math.min(255, Math.max(0, rgb.g)),
b: Math.min(255, Math.max(0, rgb.b))
};
},
fixHex = function(hex) {
var len = 6 - hex.length;
if (len > 0) {
var o = [];
for (var i = 0; i < len; i++) {
o.push('0');
}
o.push(hex);
hex = o.join('');
}
return hex;
},
HexToRGB = function(hex) {
// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
hex = hex.replace(shorthandRegex, function(m, r, g, b) {
return r + r + g + g + b + b;
});
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
},
HexToHSB = function(hex) {
return RGBToHSB(HexToRGB(hex));
},
RGBToHSB = function(r, g, b) {
if (arguments.length === 1) {
g = r.g, b = r.b, r = r.r;
}
var max = Math.max(r, g, b),
min = Math.min(r, g, b),
d = max - min,
h,
s = (max === 0 ? 0 : d / max),
v = max / 255;
switch (max) {
case min:
h = 0;
break;
case r:
h = (g - b) + d * (g < b ? 6 : 0);
h /= 6 * d;
break;
case g:
h = (b - r) + d * 2;
h /= 6 * d;
break;
case b:
h = (r - g) + d * 4;
h /= 6 * d;
break;
}
return {
h: h,
s: s,
b: v
};
},
HSBToRGB = function(h, s, v) {
var r, g, b, i, f, p, q, t;
if (arguments.length === 1) {
s = h.s, v = h.b, h = h.h;
}
i = Math.floor(h * 6);
f = h * 6 - i;
p = v * (1 - s);
q = v * (1 - f * s);
t = v * (1 - (1 - f) * s);
switch (i % 6) {
case 0:
r = v, g = t, b = p;
break;
case 1:
r = q, g = v, b = p;
break;
case 2:
r = p, g = v, b = t;
break;
case 3:
r = p, g = q, b = v;
break;
case 4:
r = t, g = p, b = v;
break;
case 5:
r = v, g = p, b = q;
break;
}
return {
r: Math.round(r * 255),
g: Math.round(g * 255),
b: Math.round(b * 255)
};
},
RGBToHex = function(rgb) {
var hex = [
rgb.r.toString(16),
rgb.g.toString(16),
rgb.b.toString(16)
];
$.each(hex, function(nr, val) {
hex[nr] = val.length == 1 ? "0" + val : val;
});
return hex.join('');
},
HSBToHex = function(hsb) {
return RGBToHex(HSBToRGB(hsb));
},
restoreOriginal = function() {
var cal = $(this).parent();
var col = cal.data('colorpicker').origColor;
cal.data('colorpicker').color = col;
fillRGBFields(col, cal.get(0));
fillHexFields(col, cal.get(0));
fillHSBFields(col, cal.get(0));
setSelector(col, cal.get(0));
setHue(col, cal.get(0));
setNewColor(col, cal.get(0));
};
return {
init: function(opt) {
opt = $.extend({}, defaults, opt || {});
if (typeof opt.color == 'string') {
opt.color = HexToHSB(opt.color);
} else if (opt.color.r != undefined && opt.color.g != undefined && opt.color.b != undefined) {
opt.color = RGBToHSB(opt.color);
} else if (opt.color.h != undefined && opt.color.s != undefined && opt.color.b != undefined) {
opt.color = fixHSB(opt.color);
} else {
return this;
}
return this.each(function() {
if (!$(this).data('colorpickerId')) {
var options = $.extend({}, opt);
options.origColor = opt.color;
var id = 'collorpicker_' + parseInt(Math.random() * 1000);
$(this).data('colorpickerId', id);
var cal = $(tpl).attr('id', id);
if (options.flat) {
cal.appendTo(this).show();
} else {
cal.appendTo(document.body);
}
options.fields = cal
.find('input')
.on('keyup', keyDown)
.on('change', change)
.on('blur', blur)
.on('focus', focus);
cal
.find('span').on('mousedown', downIncrement).end()
.find('>div.ui-colorpicker_current_color').on('click', restoreOriginal);
options.selector = cal.find('div.ui-colorpicker_color').on('mousedown', downSelector);
options.selectorIndic = options.selector.find('div div');
options.el = this;
options.hue = cal.find('div.ui-colorpicker_hue div');
cal.find('div.ui-colorpicker_hue').on('mousedown', downHue);
options.newColor = cal.find('div.ui-colorpicker_new_color');
options.currentColor = cal.find('div.ui-colorpicker_current_color');
cal.data('colorpicker', options);
cal.find('div.ui-colorpicker_submit')
.on('mouseenter', enterSubmit)
.on('mouseleave', leaveSubmit)
.on('click', clickSubmit);
fillRGBFields(options.color, cal.get(0));
fillHSBFields(options.color, cal.get(0));
fillHexFields(options.color, cal.get(0));
setHue(options.color, cal.get(0));
setSelector(options.color, cal.get(0));
setCurrentColor(options.color, cal.get(0));
setNewColor(options.color, cal.get(0));
if (options.flat) {
cal.css({
position: 'relative',
display: 'block'
});
} else {
$(this).on(options.eventName, show);
}
}
});
},
showPicker: function() {
return this.each(function() {
if ($(this).data('colorpickerId')) {
show.apply(this);
}
});
},
hidePicker: function() {
return this.each(function() {
if ($(this).data('colorpickerId')) {
$('#' + $(this).data('colorpickerId')).hide();
}
});
},
setColor: function(col) {
if (typeof col == 'string') {
col = HexToHSB(col);
} else if (col.r != undefined && col.g != undefined && col.b != undefined) {
col = RGBToHSB(col);
} else if (col.h != undefined && col.s != undefined && col.b != undefined) {
col = fixHSB(col);
} else {
return this;
}
return this.each(function() {
if ($(this).data('colorpickerId')) {
var cal = $('#' + $(this).data('colorpickerId'));
cal.data('colorpicker').color = col;
cal.data('colorpicker').origColor = col;
fillRGBFields(col, cal.get(0));
fillHSBFields(col, cal.get(0));
fillHexFields(col, cal.get(0));
setHue(col, cal.get(0));
setSelector(col, cal.get(0));
setCurrentColor(col, cal.get(0));
setNewColor(col, cal.get(0));
}
});
}
};
}();
$.fn.extend({
ColorPicker: ColorPicker.init,
ColorPickerHide: ColorPicker.hidePicker,
ColorPickerShow: ColorPicker.showPicker,
ColorPickerSetColor: ColorPicker.setColor
});
})(jQuery);
/**
*
* Zoomimage
* Author: Stefan Petre www.eyecon.ro
*
*/
(function($) {
var EYE = window.EYE = function() {
var _registered = {
init: []
};
return {
init: function() {
$.each(_registered.init, function(nr, fn) {
fn.call();
});
},
extend: function(prop) {
for (var i in prop) {
if (prop[i] != undefined) {
this[i] = prop[i];
}
}
},
register: function(fn, type) {
if (!_registered[type]) {
_registered[type] = [];
}
_registered[type].push(fn);
}
};
}();
$(EYE.init);
})(jQuery);
/**
*
* Utilities
* Author: Stefan Petre www.eyecon.ro
*
*/
(function($) {
EYE.extend({
getPosition: function(e, forceIt) {
var x = 0;
var y = 0;
var es = e.style;
var restoreStyles = false;
if (forceIt && jQuery.curCSS(e, 'display') == 'none') {
var oldVisibility = es.visibility;
var oldPosition = es.position;
restoreStyles = true;
es.visibility = 'hidden';
es.display = 'block';
es.position = 'absolute';
}
var el = e;
if (el.getBoundingClientRect) { // IE
var box = el.getBoundingClientRect();
x = box.left + Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) - 2;
y = box.top + Math.max(document.documentElement.scrollTop, document.body.scrollTop) - 2;
} else {
x = el.offsetLeft;
y = el.offsetTop;
el = el.offsetParent;
if (e != el) {
while (el) {
x += el.offsetLeft;
y += el.offsetTop;
el = el.offsetParent;
}
}
if (jQuery.browser.safari && jQuery.curCSS(e, 'position') == 'absolute') {
x -= document.body.offsetLeft;
y -= document.body.offsetTop;
}
el = e.parentNode;
while (el && el.tagName.toUpperCase() != 'BODY' && el.tagName.toUpperCase() != 'HTML') {
if (jQuery.curCSS(el, 'display') != 'inline') {
x -= el.scrollLeft;
y -= el.scrollTop;
}
el = el.parentNode;
}
}
if (restoreStyles == true) {
es.display = 'none';
es.position = oldPosition;
es.visibility = oldVisibility;
}
return {
x: x,
y: y
};
},
getSize: function(e) {
var w = parseInt(jQuery.curCSS(e, 'width'), 10);
var h = parseInt(jQuery.curCSS(e, 'height'), 10);
var wb = 0;
var hb = 0;
if (jQuery.curCSS(e, 'display') != 'none') {
wb = e.offsetWidth;
hb = e.offsetHeight;
} else {
var es = e.style;
var oldVisibility = es.visibility;
var oldPosition = es.position;
es.visibility = 'hidden';
es.display = 'block';
es.position = 'absolute';
wb = e.offsetWidth;
hb = e.offsetHeight;
es.display = 'none';
es.position = oldPosition;
es.visibility = oldVisibility;
}
return {
w: w,
h: h,
wb: wb,
hb: hb
};
},
getClient: function(e) {
var h, w;
if (e) {
w = e.clientWidth;
h = e.clientHeight;
} else {
var de = document.documentElement;
w = window.innerWidth || self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
h = window.innerHeight || self.innerHeight || (de && de.clientHeight) || document.body.clientHeight;
}
return {
w: w,
h: h
};
},
getScroll: function(e) {
var t = 0,
l = 0,
w = 0,
h = 0,
iw = 0,
ih = 0;
if (e && e.nodeName.toLowerCase() != 'body') {
t = e.scrollTop;
l = e.scrollLeft;
w = e.scrollWidth;
h = e.scrollHeight;
} else {
if (document.documentElement) {
t = document.documentElement.scrollTop;
l = document.documentElement.scrollLeft;
w = document.documentElement.scrollWidth;
h = document.documentElement.scrollHeight;
} else if (document.body) {
t = document.body.scrollTop;
l = document.body.scrollLeft;
w = document.body.scrollWidth;
h = document.body.scrollHeight;
}
if (typeof pageYOffset != 'undefined') {
t = pageYOffset;
l = pageXOffset;
}
iw = self.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || 0;
ih = self.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0;
}
return {
t: t,
l: l,
w: w,
h: h,
iw: iw,
ih: ih
};
},
getMargins: function(e, toInteger) {
var t = jQuery.curCSS(e, 'marginTop') || '';
var r = jQuery.curCSS(e, 'marginRight') || '';
var b = jQuery.curCSS(e, 'marginBottom') || '';
var l = jQuery.curCSS(e, 'marginLeft') || '';
if (toInteger)
return {
t: parseInt(t, 10) || 0,
r: parseInt(r, 10) || 0,
b: parseInt(b, 10) || 0,
l: parseInt(l, 10)
};
else
return {
t: t,
r: r,
b: b,
l: l
};
},
getPadding: function(e, toInteger) {
var t = jQuery.curCSS(e, 'paddingTop') || '';
var r = jQuery.curCSS(e, 'paddingRight') || '';
var b = jQuery.curCSS(e, 'paddingBottom') || '';
var l = jQuery.curCSS(e, 'paddingLeft') || '';
if (toInteger)
return {
t: parseInt(t, 10) || 0,
r: parseInt(r, 10) || 0,
b: parseInt(b, 10) || 0,
l: parseInt(l, 10)
};
else
return {
t: t,
r: r,
b: b,
l: l
};
},
getBorder: function(e, toInteger) {
var t = jQuery.curCSS(e, 'borderTopWidth') || '';
var r = jQuery.curCSS(e, 'borderRightWidth') || '';
var b = jQuery.curCSS(e, 'borderBottomWidth') || '';
var l = jQuery.curCSS(e, 'borderLeftWidth') || '';
if (toInteger)
return {
t: parseInt(t, 10) || 0,
r: parseInt(r, 10) || 0,
b: parseInt(b, 10) || 0,
l: parseInt(l, 10) || 0
};
else
return {
t: t,
r: r,
b: b,
l: l
};
},
traverseDOM: function(nodeEl, func) {
func(nodeEl);
nodeEl = nodeEl.firstChild;
while (nodeEl) {
EYE.traverseDOM(nodeEl, func);
nodeEl = nodeEl.nextSibling;
}
},
getInnerWidth: function(el, scroll) {
var offsetW = el.offsetWidth;
return scroll ? Math.max(el.scrollWidth, offsetW) - offsetW + el.clientWidth : el.clientWidth;
},
getInnerHeight: function(el, scroll) {
var offsetH = el.offsetHeight;
return scroll ? Math.max(el.scrollHeight, offsetH) - offsetH + el.clientHeight : el.clientHeight;
},
getExtraWidth: function(el) {
if ($.boxModel)
return (parseInt($.curCSS(el, 'paddingLeft')) || 0) +
(parseInt($.curCSS(el, 'paddingRight')) || 0) +
(parseInt($.curCSS(el, 'borderLeftWidth')) || 0) +
(parseInt($.curCSS(el, 'borderRightWidth')) || 0);
return 0;
},
getExtraHeight: function(el) {
if ($.boxModel)
return (parseInt($.curCSS(el, 'paddingTop')) || 0) +
(parseInt($.curCSS(el, 'paddingBottom')) || 0) +
(parseInt($.curCSS(el, 'borderTopWidth')) || 0) +
(parseInt($.curCSS(el, 'borderBottomWidth')) || 0);
return 0;
},
isChildOf: function(parentEl, el, container) {
if (parentEl == el) {
return true;
}
if (!el || !el.nodeType || el.nodeType != 1) {
return false;
}
if (parentEl.contains && !$.browser.safari) {
return parentEl.contains(el);
}
if (parentEl.compareDocumentPosition) {
return !!(parentEl.compareDocumentPosition(el) & 16);
}
var prEl = el.parentNode;
while (prEl && prEl != container) {
if (prEl == parentEl)
return true;
prEl = prEl.parentNode;
}
return false;
},
centerEl: function(el, axis) {
var clientScroll = EYE.getScroll();
var size = EYE.getSize(el);
if (!axis || axis == 'vertically')
$(el).css({
top: clientScroll.t + ((Math.min(clientScroll.h, clientScroll.ih) - size.hb) / 2) + 'px'
});
if (!axis || axis == 'horizontally')
$(el).css({
left: clientScroll.l + ((Math.min(clientScroll.w, clientScroll.iw) - size.wb) / 2) + 'px'
});
}
});
if (!$.easing.easeout) {
$.easing.easeout = function(p, n, firstNum, delta, duration) {
return -delta * ((n = n / duration - 1) * n * n * n - 1) + firstNum;
};
}
})(jQuery);
This colorpicker seems to always have this bug with certain colors. For example, enter the color "fff000". Rather than use that color, it decides to use ffee00.
While fixhex() seems to output the proper 240 (=f0 hex), when it converts to hsb and back it changes it. I'm not sure what's wrong with the hsb code or why it stores it in that format?