mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-10-05 01:44:18 +00:00
Set svn:eol-style to native for new plugins.
This commit is contained in:
parent
66a947c0e7
commit
939448c756
@ -1,472 +1,472 @@
|
||||
/*
|
||||
* jQuery UI Color Picker @VERSION
|
||||
*
|
||||
* Copyright (c) 2008 Stefan Petre, Paul Bakaus
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/ColorPicker
|
||||
*
|
||||
* Depends:
|
||||
* ui.core.js
|
||||
*/
|
||||
(function ($) {
|
||||
|
||||
$.widget("ui.colorpicker", {
|
||||
|
||||
_init: function() {
|
||||
|
||||
this.charMin = 65;
|
||||
var o = this.options, self = this,
|
||||
tpl = '<div class="ui-colorpicker clearfix"><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-current-color"></div><div class="ui-colorpicker-hex"><label for="ui-colorpicker-hex" title="hex"></label><input type="text" maxlength="6" size="6" /></div><div class="ui-colorpicker-rgb-r ui-colorpicker-field"><label for="ui-colorpicker-rgb-r"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-rgb-g ui-colorpicker-field"><label for="ui-colorpicker-rgb-g"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-rgb-b ui-colorpicker-field"><label for="ui-colorpicker-rgb-b"</label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-hsb-h ui-colorpicker-field"><label for="ui-colorpicker-hsb-h"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-hsb-s ui-colorpicker-field"><label for="ui-colorpicker-hsb-s"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-hsb-b ui-colorpicker-field"><label for="ui-colorpicker-hsb-b"></label><input type="text" maxlength="3" size="2" /><span></span></div><button class="ui-colorpicker-submit ui-default-state" name="submit" type="button">Done</button></div>';
|
||||
|
||||
if (typeof o.color == 'string') {
|
||||
this.color = this._HexToHSB(o.color);
|
||||
} else if (o.color.r != undefined && o.color.g != undefined && o.color.b != undefined) {
|
||||
this.color = this._RGBToHSB(o.color);
|
||||
} else if (o.color.h != undefined && o.color.s != undefined && o.color.b != undefined) {
|
||||
this.color = this._fixHSB(o.color);
|
||||
} else {
|
||||
return this;
|
||||
}
|
||||
|
||||
this.origColor = this.color;
|
||||
this.picker = $(tpl);
|
||||
|
||||
if (o.flat) {
|
||||
this.picker.appendTo(this.element).show();
|
||||
} else {
|
||||
this.picker.appendTo(document.body);
|
||||
}
|
||||
|
||||
this.fields = this.picker.find('input')
|
||||
.bind('keydown', function(e) { return self._keyDown.call(self, e); })
|
||||
.bind('change', function(e) { return self._change.call(self, e); })
|
||||
.bind('blur', function(e) { return self._blur.call(self, e); })
|
||||
.bind('focus', function(e) { return self._focus.call(self, e); });
|
||||
|
||||
this.picker.find('span').bind('mousedown', function(e) { return self._downIncrement.call(self, e); });
|
||||
|
||||
this.selector = this.picker.find('div.ui-colorpicker-color').bind('mousedown', function(e) { return self._downSelector.call(self, e); });
|
||||
this.selectorIndic = this.selector.find('div div');
|
||||
this.hue = this.picker.find('div.ui-colorpicker-hue div');
|
||||
this.picker.find('div.ui-colorpicker-hue').bind('mousedown', function(e) { return self._downHue.call(self, e); });
|
||||
|
||||
this.newColor = this.picker.find('div.ui-colorpicker-new-color');
|
||||
this.currentColor = this.picker.find('div.ui-colorpicker-current-color');
|
||||
|
||||
this.picker.find('.ui-colorpicker-submit')
|
||||
.bind('mouseenter', function(e) { return self._enterSubmit.call(self, e); })
|
||||
.bind('mouseleave', function(e) { return self._leaveSubmit.call(self, e); })
|
||||
.bind('click', function(e) { return self._clickSubmit.call(self, e); });
|
||||
|
||||
this._fillRGBFields(this.color);
|
||||
this._fillHSBFields(this.color);
|
||||
this._fillHexFields(this.color);
|
||||
this._setHue(this.color);
|
||||
this._setSelector(this.color);
|
||||
this._setCurrentColor(this.color);
|
||||
this._setNewColor(this.color);
|
||||
|
||||
if (o.flat) {
|
||||
this.picker.css({
|
||||
position: 'relative',
|
||||
display: 'block'
|
||||
});
|
||||
} else {
|
||||
$(this.element).bind(o.eventName+".colorpicker", function(e) { return self._show.call(self, e); });
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
destroy: function() {
|
||||
|
||||
this.picker.remove();
|
||||
this.element.removeData("colorpicker").unbind(".colorpicker");
|
||||
|
||||
},
|
||||
|
||||
_fillRGBFields: function(hsb) {
|
||||
var rgb = this._HSBToRGB(hsb);
|
||||
this.fields
|
||||
.eq(1).val(rgb.r).end()
|
||||
.eq(2).val(rgb.g).end()
|
||||
.eq(3).val(rgb.b).end();
|
||||
},
|
||||
_fillHSBFields: function(hsb) {
|
||||
this.fields
|
||||
.eq(4).val(hsb.h).end()
|
||||
.eq(5).val(hsb.s).end()
|
||||
.eq(6).val(hsb.b).end();
|
||||
},
|
||||
_fillHexFields: function (hsb) {
|
||||
this.fields
|
||||
.eq(0).val(this._HSBToHex(hsb)).end();
|
||||
},
|
||||
_setSelector: function(hsb) {
|
||||
this.selector.css('backgroundColor', '#' + this._HSBToHex({h: hsb.h, s: 100, b: 100}));
|
||||
this.selectorIndic.css({
|
||||
left: parseInt(150 * hsb.s/100, 10),
|
||||
top: parseInt(150 * (100-hsb.b)/100, 10)
|
||||
});
|
||||
},
|
||||
_setHue: function(hsb) {
|
||||
this.hue.css('top', parseInt(150 - 150 * hsb.h/360, 10));
|
||||
},
|
||||
_setCurrentColor: function(hsb) {
|
||||
this.currentColor.css('backgroundColor', '#' + this._HSBToHex(hsb));
|
||||
},
|
||||
_setNewColor: function(hsb) {
|
||||
this.newColor.css('backgroundColor', '#' + this._HSBToHex(hsb));
|
||||
},
|
||||
_keyDown: function(e) {
|
||||
var pressedKey = e.charCode || e.keyCode || -1;
|
||||
if ((pressedKey >= this.charMin && pressedKey <= 90) || pressedKey == 32) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
_change: function(e, target) {
|
||||
|
||||
var col;
|
||||
target = target || e.target;
|
||||
if (target.parentNode.className.indexOf('-hex') > 0) {
|
||||
this.color = col = this._HexToHSB(this.value);
|
||||
this._fillRGBFields(col.color);
|
||||
this._fillHSBFields(col);
|
||||
} else if (target.parentNode.className.indexOf('-hsb') > 0) {
|
||||
this.color = col = this._fixHSB({
|
||||
h: parseInt(this.fields.eq(4).val(), 10),
|
||||
s: parseInt(this.fields.eq(5).val(), 10),
|
||||
b: parseInt(this.fields.eq(6).val(), 10)
|
||||
});
|
||||
this._fillRGBFields(col);
|
||||
this._fillHexFields(col);
|
||||
} else {
|
||||
this.color = col = this._RGBToHSB(this._fixRGB({
|
||||
r: parseInt(this.fields.eq(1).val(), 10),
|
||||
g: parseInt(this.fields.eq(2).val(), 10),
|
||||
b: parseInt(this.fields.eq(3).val(), 10)
|
||||
}));
|
||||
this._fillHexFields(col);
|
||||
this._fillHSBFields(col);
|
||||
}
|
||||
this._setSelector(col);
|
||||
this._setHue(col);
|
||||
this._setNewColor(col);
|
||||
|
||||
this._trigger('change', e, { options: this.options, hsb: col, hex: this._HSBToHex(col), rgb: this._HSBToRGB(col) });
|
||||
},
|
||||
_blur: function(e) {
|
||||
|
||||
var col = this.color;
|
||||
this._fillRGBFields(col);
|
||||
this._fillHSBFields(col);
|
||||
this._fillHexFields(col);
|
||||
this._setHue(col);
|
||||
this._setSelector(col);
|
||||
this._setNewColor(col);
|
||||
this.fields.parent().removeClass('ui-colorpicker-focus');
|
||||
|
||||
},
|
||||
_focus: function(e) {
|
||||
|
||||
this.charMin = e.target.parentNode.className.indexOf('-hex') > 0 ? 70 : 65;
|
||||
this.fields.parent().removeClass('ui-colorpicker-focus');
|
||||
$(e.target.parentNode).addClass('ui-colorpicker-focus');
|
||||
|
||||
},
|
||||
_downIncrement: function(e) {
|
||||
|
||||
var field = $(e.target).parent().find('input').focus(), self = this;
|
||||
this.currentIncrement = {
|
||||
el: $(e.target).parent().addClass('ui-colorpicker-slider'),
|
||||
max: e.target.parentNode.className.indexOf('-hsb-h') > 0 ? 360 : (e.target.parentNode.className.indexOf('-hsb') > 0 ? 100 : 255),
|
||||
y: e.pageY,
|
||||
field: field,
|
||||
val: parseInt(field.val(), 10)
|
||||
};
|
||||
$(document).bind('mouseup.cpSlider', function(e) { return self._upIncrement.call(self, e); });
|
||||
$(document).bind('mousemove.cpSlider', function(e) { return self._moveIncrement.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_moveIncrement: function(e) {
|
||||
this.currentIncrement.field.val(Math.max(0, Math.min(this.currentIncrement.max, parseInt(this.currentIncrement.val + e.pageY - this.currentIncrement.y, 10))));
|
||||
this._change.apply(this, [e, this.currentIncrement.field.get(0)]);
|
||||
return false;
|
||||
},
|
||||
_upIncrement: function(e) {
|
||||
this.currentIncrement.el.removeClass('ui-colorpicker-slider').find('input').focus();
|
||||
this._change.apply(this, [e, this.currentIncrement.field.get(0)]);
|
||||
$(document).unbind('mouseup.cpSlider');
|
||||
$(document).unbind('mousemove.cpSlider');
|
||||
return false;
|
||||
},
|
||||
_downHue: function(e) {
|
||||
|
||||
this.currentHue = {
|
||||
y: this.picker.find('div.ui-colorpicker-hue').offset().top
|
||||
};
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(4)
|
||||
.val(parseInt(360*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentHue.y))))/150, 10))
|
||||
.get(0)]);
|
||||
|
||||
var self = this;
|
||||
$(document).bind('mouseup.cpSlider', function(e) { return self._upHue.call(self, e); });
|
||||
$(document).bind('mousemove.cpSlider', function(e) { return self._moveHue.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_moveHue: function(e) {
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(4)
|
||||
.val(parseInt(360*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentHue.y))))/150, 10))
|
||||
.get(0)]);
|
||||
|
||||
return false;
|
||||
|
||||
},
|
||||
_upHue: function(e) {
|
||||
$(document).unbind('mouseup.cpSlider');
|
||||
$(document).unbind('mousemove.cpSlider');
|
||||
return false;
|
||||
},
|
||||
_downSelector: function(e) {
|
||||
|
||||
var self = this;
|
||||
this.currentSelector = {
|
||||
pos: this.picker.find('div.ui-colorpicker-color').offset()
|
||||
};
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(6)
|
||||
.val(parseInt(100*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentSelector.pos.top))))/150, 10))
|
||||
.end()
|
||||
.eq(5)
|
||||
.val(parseInt(100*(Math.max(0,Math.min(150,(e.pageX - this.currentSelector.pos.left))))/150, 10))
|
||||
.get(0)
|
||||
]);
|
||||
$(document).bind('mouseup.cpSlider', function(e) { return self._upSelector.call(self, e); });
|
||||
$(document).bind('mousemove.cpSlider', function(e) { return self._moveSelector.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_moveSelector: function(e) {
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(6)
|
||||
.val(parseInt(100*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentSelector.pos.top))))/150, 10))
|
||||
.end()
|
||||
.eq(5)
|
||||
.val(parseInt(100*(Math.max(0,Math.min(150,(e.pageX - this.currentSelector.pos.left))))/150, 10))
|
||||
.get(0)
|
||||
]);
|
||||
return false;
|
||||
|
||||
},
|
||||
_upSelector: function(e) {
|
||||
$(document).unbind('mouseup.cpSlider');
|
||||
$(document).unbind('mousemove.cpSlider');
|
||||
return false;
|
||||
},
|
||||
_enterSubmit: function(e) {
|
||||
this.picker.find('.ui-colorpicker-submit').addClass('ui-colorpicker-focus');
|
||||
},
|
||||
_leaveSubmit: function(e) {
|
||||
this.picker.find('.ui-colorpicker-submit').removeClass('ui-colorpicker-focus');
|
||||
},
|
||||
_clickSubmit: function(e) {
|
||||
|
||||
var col = this.color;
|
||||
this.origColor = col;
|
||||
this._setCurrentColor(col);
|
||||
|
||||
this._trigger("submit", e, { options: this.options, hsb: col, hex: this._HSBToHex(col), rgb: this._HSBToRGB(col) });
|
||||
return false;
|
||||
|
||||
},
|
||||
_show: function(e) {
|
||||
|
||||
this._trigger("beforeShow", e, { options: this.options, hsb: this.color, hex: this._HSBToHex(this.color), rgb: this._HSBToRGB(this.color) });
|
||||
|
||||
var pos = this.element.offset();
|
||||
var viewPort = this._getScroll();
|
||||
var top = pos.top + this.element[0].offsetHeight;
|
||||
var left = pos.left;
|
||||
if (top + 176 > viewPort.t + Math.min(viewPort.h,viewPort.ih)) {
|
||||
top -= this.element[0].offsetHeight + 176;
|
||||
}
|
||||
if (left + 356 > viewPort.l + Math.min(viewPort.w,viewPort.iw)) {
|
||||
left -= 356;
|
||||
}
|
||||
this.picker.css({left: left + 'px', top: top + 'px'});
|
||||
if (this._trigger("show", e, { options: this.options, hsb: this.color, hex: this._HSBToHex(this.color), rgb: this._HSBToRGB(this.color) }) != false) {
|
||||
this.picker.show();
|
||||
}
|
||||
|
||||
var self = this;
|
||||
$(document).bind('mousedown.colorpicker', function(e) { return self._hide.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_hide: function(e) {
|
||||
|
||||
if (!this._isChildOf(this.picker[0], e.target, this.picker[0])) {
|
||||
if (this._trigger("hide", e, { options: this.options, hsb: this.color, hex: this._HSBToHex(this.color), rgb: this._HSBToRGB(this.color) }) != false) {
|
||||
this.picker.hide();
|
||||
}
|
||||
$(document).unbind('mousedown.colorpicker');
|
||||
}
|
||||
|
||||
},
|
||||
_isChildOf: function(parentEl, el, container) {
|
||||
if (parentEl == el) {
|
||||
return true;
|
||||
}
|
||||
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;
|
||||
},
|
||||
_getScroll: function() {
|
||||
var t,l,w,h,iw,ih;
|
||||
if (document.documentElement) {
|
||||
t = document.documentElement.scrollTop;
|
||||
l = document.documentElement.scrollLeft;
|
||||
w = document.documentElement.scrollWidth;
|
||||
h = document.documentElement.scrollHeight;
|
||||
} else {
|
||||
t = document.body.scrollTop;
|
||||
l = document.body.scrollLeft;
|
||||
w = document.body.scrollWidth;
|
||||
h = document.body.scrollHeight;
|
||||
}
|
||||
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 };
|
||||
},
|
||||
_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))
|
||||
};
|
||||
},
|
||||
_HexToRGB: function (hex) {
|
||||
var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
|
||||
return {r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF)};
|
||||
},
|
||||
_HexToHSB: function(hex) {
|
||||
return this._RGBToHSB(this._HexToRGB(hex));
|
||||
},
|
||||
_RGBToHSB: function(rgb) {
|
||||
var hsb = {};
|
||||
hsb.b = Math.max(Math.max(rgb.r,rgb.g),rgb.b);
|
||||
hsb.s = (hsb.b <= 0) ? 0 : Math.round(100*(hsb.b - Math.min(Math.min(rgb.r,rgb.g),rgb.b))/hsb.b);
|
||||
hsb.b = Math.round((hsb.b /255)*100);
|
||||
if((rgb.r==rgb.g) && (rgb.g==rgb.b)) hsb.h = 0;
|
||||
else if(rgb.r>=rgb.g && rgb.g>=rgb.b) hsb.h = 60*(rgb.g-rgb.b)/(rgb.r-rgb.b);
|
||||
else if(rgb.g>=rgb.r && rgb.r>=rgb.b) hsb.h = 60 + 60*(rgb.g-rgb.r)/(rgb.g-rgb.b);
|
||||
else if(rgb.g>=rgb.b && rgb.b>=rgb.r) hsb.h = 120 + 60*(rgb.b-rgb.r)/(rgb.g-rgb.r);
|
||||
else if(rgb.b>=rgb.g && rgb.g>=rgb.r) hsb.h = 180 + 60*(rgb.b-rgb.g)/(rgb.b-rgb.r);
|
||||
else if(rgb.b>=rgb.r && rgb.r>=rgb.g) hsb.h = 240 + 60*(rgb.r-rgb.g)/(rgb.b-rgb.g);
|
||||
else if(rgb.r>=rgb.b && rgb.b>=rgb.g) hsb.h = 300 + 60*(rgb.r-rgb.b)/(rgb.r-rgb.g);
|
||||
else hsb.h = 0;
|
||||
hsb.h = Math.round(hsb.h);
|
||||
return hsb;
|
||||
},
|
||||
_HSBToRGB: function(hsb) {
|
||||
var rgb = {};
|
||||
var h = Math.round(hsb.h);
|
||||
var s = Math.round(hsb.s*255/100);
|
||||
var v = Math.round(hsb.b*255/100);
|
||||
if(s == 0) {
|
||||
rgb.r = rgb.g = rgb.b = v;
|
||||
} else {
|
||||
var t1 = v;
|
||||
var t2 = (255-s)*v/255;
|
||||
var t3 = (t1-t2)*(h%60)/60;
|
||||
if(h==360) h = 0;
|
||||
if(h<60) {rgb.r=t1; rgb.b=t2; rgb.g=t2+t3;}
|
||||
else if(h<120) {rgb.g=t1; rgb.b=t2; rgb.r=t1-t3;}
|
||||
else if(h<180) {rgb.g=t1; rgb.r=t2; rgb.b=t2+t3;}
|
||||
else if(h<240) {rgb.b=t1; rgb.r=t2; rgb.g=t1-t3;}
|
||||
else if(h<300) {rgb.b=t1; rgb.g=t2; rgb.r=t2+t3;}
|
||||
else if(h<360) {rgb.r=t1; rgb.g=t2; rgb.b=t1-t3;}
|
||||
else {rgb.r=0; rgb.g=0; rgb.b=0;}
|
||||
}
|
||||
return {r:Math.round(rgb.r), g:Math.round(rgb.g), b:Math.round(rgb.b)};
|
||||
},
|
||||
_RGBToHex: function(rgb) {
|
||||
var hex = [
|
||||
rgb.r.toString(16),
|
||||
rgb.g.toString(16),
|
||||
rgb.b.toString(16)
|
||||
];
|
||||
$.each(hex, function (nr, val) {
|
||||
if (val.length == 1) {
|
||||
hex[nr] = '0' + val;
|
||||
}
|
||||
});
|
||||
return hex.join('');
|
||||
},
|
||||
_HSBToHex: function(hsb) {
|
||||
return this._RGBToHex(this._HSBToRGB(hsb));
|
||||
},
|
||||
setColor: function(col) {
|
||||
if (typeof col == 'string') {
|
||||
col = this._HexToHSB(col);
|
||||
} else if (col.r != undefined && col.g != undefined && col.b != undefined) {
|
||||
col = this._RGBToHSB(col);
|
||||
} else if (col.h != undefined && col.s != undefined && col.b != undefined) {
|
||||
col = this._fixHSB(col);
|
||||
} else {
|
||||
return this;
|
||||
}
|
||||
|
||||
this.color = col;
|
||||
this.origColor = col;
|
||||
this._fillRGBFields(col);
|
||||
this._fillHSBFields(col);
|
||||
this._fillHexFields(col);
|
||||
this._setHue(col);
|
||||
this._setSelector(col);
|
||||
this._setCurrentColor(col);
|
||||
this._setNewColor(col);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$.extend($.ui.colorpicker, {
|
||||
defaults: {
|
||||
eventName: 'click',
|
||||
color: 'ff0000',
|
||||
flat: false
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* jQuery UI Color Picker @VERSION
|
||||
*
|
||||
* Copyright (c) 2008 Stefan Petre, Paul Bakaus
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/ColorPicker
|
||||
*
|
||||
* Depends:
|
||||
* ui.core.js
|
||||
*/
|
||||
(function ($) {
|
||||
|
||||
$.widget("ui.colorpicker", {
|
||||
|
||||
_init: function() {
|
||||
|
||||
this.charMin = 65;
|
||||
var o = this.options, self = this,
|
||||
tpl = '<div class="ui-colorpicker clearfix"><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-current-color"></div><div class="ui-colorpicker-hex"><label for="ui-colorpicker-hex" title="hex"></label><input type="text" maxlength="6" size="6" /></div><div class="ui-colorpicker-rgb-r ui-colorpicker-field"><label for="ui-colorpicker-rgb-r"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-rgb-g ui-colorpicker-field"><label for="ui-colorpicker-rgb-g"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-rgb-b ui-colorpicker-field"><label for="ui-colorpicker-rgb-b"</label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-hsb-h ui-colorpicker-field"><label for="ui-colorpicker-hsb-h"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-hsb-s ui-colorpicker-field"><label for="ui-colorpicker-hsb-s"></label><input type="text" maxlength="3" size="2" /><span></span></div><div class="ui-colorpicker-hsb-b ui-colorpicker-field"><label for="ui-colorpicker-hsb-b"></label><input type="text" maxlength="3" size="2" /><span></span></div><button class="ui-colorpicker-submit ui-default-state" name="submit" type="button">Done</button></div>';
|
||||
|
||||
if (typeof o.color == 'string') {
|
||||
this.color = this._HexToHSB(o.color);
|
||||
} else if (o.color.r != undefined && o.color.g != undefined && o.color.b != undefined) {
|
||||
this.color = this._RGBToHSB(o.color);
|
||||
} else if (o.color.h != undefined && o.color.s != undefined && o.color.b != undefined) {
|
||||
this.color = this._fixHSB(o.color);
|
||||
} else {
|
||||
return this;
|
||||
}
|
||||
|
||||
this.origColor = this.color;
|
||||
this.picker = $(tpl);
|
||||
|
||||
if (o.flat) {
|
||||
this.picker.appendTo(this.element).show();
|
||||
} else {
|
||||
this.picker.appendTo(document.body);
|
||||
}
|
||||
|
||||
this.fields = this.picker.find('input')
|
||||
.bind('keydown', function(e) { return self._keyDown.call(self, e); })
|
||||
.bind('change', function(e) { return self._change.call(self, e); })
|
||||
.bind('blur', function(e) { return self._blur.call(self, e); })
|
||||
.bind('focus', function(e) { return self._focus.call(self, e); });
|
||||
|
||||
this.picker.find('span').bind('mousedown', function(e) { return self._downIncrement.call(self, e); });
|
||||
|
||||
this.selector = this.picker.find('div.ui-colorpicker-color').bind('mousedown', function(e) { return self._downSelector.call(self, e); });
|
||||
this.selectorIndic = this.selector.find('div div');
|
||||
this.hue = this.picker.find('div.ui-colorpicker-hue div');
|
||||
this.picker.find('div.ui-colorpicker-hue').bind('mousedown', function(e) { return self._downHue.call(self, e); });
|
||||
|
||||
this.newColor = this.picker.find('div.ui-colorpicker-new-color');
|
||||
this.currentColor = this.picker.find('div.ui-colorpicker-current-color');
|
||||
|
||||
this.picker.find('.ui-colorpicker-submit')
|
||||
.bind('mouseenter', function(e) { return self._enterSubmit.call(self, e); })
|
||||
.bind('mouseleave', function(e) { return self._leaveSubmit.call(self, e); })
|
||||
.bind('click', function(e) { return self._clickSubmit.call(self, e); });
|
||||
|
||||
this._fillRGBFields(this.color);
|
||||
this._fillHSBFields(this.color);
|
||||
this._fillHexFields(this.color);
|
||||
this._setHue(this.color);
|
||||
this._setSelector(this.color);
|
||||
this._setCurrentColor(this.color);
|
||||
this._setNewColor(this.color);
|
||||
|
||||
if (o.flat) {
|
||||
this.picker.css({
|
||||
position: 'relative',
|
||||
display: 'block'
|
||||
});
|
||||
} else {
|
||||
$(this.element).bind(o.eventName+".colorpicker", function(e) { return self._show.call(self, e); });
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
destroy: function() {
|
||||
|
||||
this.picker.remove();
|
||||
this.element.removeData("colorpicker").unbind(".colorpicker");
|
||||
|
||||
},
|
||||
|
||||
_fillRGBFields: function(hsb) {
|
||||
var rgb = this._HSBToRGB(hsb);
|
||||
this.fields
|
||||
.eq(1).val(rgb.r).end()
|
||||
.eq(2).val(rgb.g).end()
|
||||
.eq(3).val(rgb.b).end();
|
||||
},
|
||||
_fillHSBFields: function(hsb) {
|
||||
this.fields
|
||||
.eq(4).val(hsb.h).end()
|
||||
.eq(5).val(hsb.s).end()
|
||||
.eq(6).val(hsb.b).end();
|
||||
},
|
||||
_fillHexFields: function (hsb) {
|
||||
this.fields
|
||||
.eq(0).val(this._HSBToHex(hsb)).end();
|
||||
},
|
||||
_setSelector: function(hsb) {
|
||||
this.selector.css('backgroundColor', '#' + this._HSBToHex({h: hsb.h, s: 100, b: 100}));
|
||||
this.selectorIndic.css({
|
||||
left: parseInt(150 * hsb.s/100, 10),
|
||||
top: parseInt(150 * (100-hsb.b)/100, 10)
|
||||
});
|
||||
},
|
||||
_setHue: function(hsb) {
|
||||
this.hue.css('top', parseInt(150 - 150 * hsb.h/360, 10));
|
||||
},
|
||||
_setCurrentColor: function(hsb) {
|
||||
this.currentColor.css('backgroundColor', '#' + this._HSBToHex(hsb));
|
||||
},
|
||||
_setNewColor: function(hsb) {
|
||||
this.newColor.css('backgroundColor', '#' + this._HSBToHex(hsb));
|
||||
},
|
||||
_keyDown: function(e) {
|
||||
var pressedKey = e.charCode || e.keyCode || -1;
|
||||
if ((pressedKey >= this.charMin && pressedKey <= 90) || pressedKey == 32) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
_change: function(e, target) {
|
||||
|
||||
var col;
|
||||
target = target || e.target;
|
||||
if (target.parentNode.className.indexOf('-hex') > 0) {
|
||||
this.color = col = this._HexToHSB(this.value);
|
||||
this._fillRGBFields(col.color);
|
||||
this._fillHSBFields(col);
|
||||
} else if (target.parentNode.className.indexOf('-hsb') > 0) {
|
||||
this.color = col = this._fixHSB({
|
||||
h: parseInt(this.fields.eq(4).val(), 10),
|
||||
s: parseInt(this.fields.eq(5).val(), 10),
|
||||
b: parseInt(this.fields.eq(6).val(), 10)
|
||||
});
|
||||
this._fillRGBFields(col);
|
||||
this._fillHexFields(col);
|
||||
} else {
|
||||
this.color = col = this._RGBToHSB(this._fixRGB({
|
||||
r: parseInt(this.fields.eq(1).val(), 10),
|
||||
g: parseInt(this.fields.eq(2).val(), 10),
|
||||
b: parseInt(this.fields.eq(3).val(), 10)
|
||||
}));
|
||||
this._fillHexFields(col);
|
||||
this._fillHSBFields(col);
|
||||
}
|
||||
this._setSelector(col);
|
||||
this._setHue(col);
|
||||
this._setNewColor(col);
|
||||
|
||||
this._trigger('change', e, { options: this.options, hsb: col, hex: this._HSBToHex(col), rgb: this._HSBToRGB(col) });
|
||||
},
|
||||
_blur: function(e) {
|
||||
|
||||
var col = this.color;
|
||||
this._fillRGBFields(col);
|
||||
this._fillHSBFields(col);
|
||||
this._fillHexFields(col);
|
||||
this._setHue(col);
|
||||
this._setSelector(col);
|
||||
this._setNewColor(col);
|
||||
this.fields.parent().removeClass('ui-colorpicker-focus');
|
||||
|
||||
},
|
||||
_focus: function(e) {
|
||||
|
||||
this.charMin = e.target.parentNode.className.indexOf('-hex') > 0 ? 70 : 65;
|
||||
this.fields.parent().removeClass('ui-colorpicker-focus');
|
||||
$(e.target.parentNode).addClass('ui-colorpicker-focus');
|
||||
|
||||
},
|
||||
_downIncrement: function(e) {
|
||||
|
||||
var field = $(e.target).parent().find('input').focus(), self = this;
|
||||
this.currentIncrement = {
|
||||
el: $(e.target).parent().addClass('ui-colorpicker-slider'),
|
||||
max: e.target.parentNode.className.indexOf('-hsb-h') > 0 ? 360 : (e.target.parentNode.className.indexOf('-hsb') > 0 ? 100 : 255),
|
||||
y: e.pageY,
|
||||
field: field,
|
||||
val: parseInt(field.val(), 10)
|
||||
};
|
||||
$(document).bind('mouseup.cpSlider', function(e) { return self._upIncrement.call(self, e); });
|
||||
$(document).bind('mousemove.cpSlider', function(e) { return self._moveIncrement.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_moveIncrement: function(e) {
|
||||
this.currentIncrement.field.val(Math.max(0, Math.min(this.currentIncrement.max, parseInt(this.currentIncrement.val + e.pageY - this.currentIncrement.y, 10))));
|
||||
this._change.apply(this, [e, this.currentIncrement.field.get(0)]);
|
||||
return false;
|
||||
},
|
||||
_upIncrement: function(e) {
|
||||
this.currentIncrement.el.removeClass('ui-colorpicker-slider').find('input').focus();
|
||||
this._change.apply(this, [e, this.currentIncrement.field.get(0)]);
|
||||
$(document).unbind('mouseup.cpSlider');
|
||||
$(document).unbind('mousemove.cpSlider');
|
||||
return false;
|
||||
},
|
||||
_downHue: function(e) {
|
||||
|
||||
this.currentHue = {
|
||||
y: this.picker.find('div.ui-colorpicker-hue').offset().top
|
||||
};
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(4)
|
||||
.val(parseInt(360*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentHue.y))))/150, 10))
|
||||
.get(0)]);
|
||||
|
||||
var self = this;
|
||||
$(document).bind('mouseup.cpSlider', function(e) { return self._upHue.call(self, e); });
|
||||
$(document).bind('mousemove.cpSlider', function(e) { return self._moveHue.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_moveHue: function(e) {
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(4)
|
||||
.val(parseInt(360*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentHue.y))))/150, 10))
|
||||
.get(0)]);
|
||||
|
||||
return false;
|
||||
|
||||
},
|
||||
_upHue: function(e) {
|
||||
$(document).unbind('mouseup.cpSlider');
|
||||
$(document).unbind('mousemove.cpSlider');
|
||||
return false;
|
||||
},
|
||||
_downSelector: function(e) {
|
||||
|
||||
var self = this;
|
||||
this.currentSelector = {
|
||||
pos: this.picker.find('div.ui-colorpicker-color').offset()
|
||||
};
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(6)
|
||||
.val(parseInt(100*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentSelector.pos.top))))/150, 10))
|
||||
.end()
|
||||
.eq(5)
|
||||
.val(parseInt(100*(Math.max(0,Math.min(150,(e.pageX - this.currentSelector.pos.left))))/150, 10))
|
||||
.get(0)
|
||||
]);
|
||||
$(document).bind('mouseup.cpSlider', function(e) { return self._upSelector.call(self, e); });
|
||||
$(document).bind('mousemove.cpSlider', function(e) { return self._moveSelector.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_moveSelector: function(e) {
|
||||
|
||||
this._change.apply(this, [e, this
|
||||
.fields
|
||||
.eq(6)
|
||||
.val(parseInt(100*(150 - Math.max(0,Math.min(150,(e.pageY - this.currentSelector.pos.top))))/150, 10))
|
||||
.end()
|
||||
.eq(5)
|
||||
.val(parseInt(100*(Math.max(0,Math.min(150,(e.pageX - this.currentSelector.pos.left))))/150, 10))
|
||||
.get(0)
|
||||
]);
|
||||
return false;
|
||||
|
||||
},
|
||||
_upSelector: function(e) {
|
||||
$(document).unbind('mouseup.cpSlider');
|
||||
$(document).unbind('mousemove.cpSlider');
|
||||
return false;
|
||||
},
|
||||
_enterSubmit: function(e) {
|
||||
this.picker.find('.ui-colorpicker-submit').addClass('ui-colorpicker-focus');
|
||||
},
|
||||
_leaveSubmit: function(e) {
|
||||
this.picker.find('.ui-colorpicker-submit').removeClass('ui-colorpicker-focus');
|
||||
},
|
||||
_clickSubmit: function(e) {
|
||||
|
||||
var col = this.color;
|
||||
this.origColor = col;
|
||||
this._setCurrentColor(col);
|
||||
|
||||
this._trigger("submit", e, { options: this.options, hsb: col, hex: this._HSBToHex(col), rgb: this._HSBToRGB(col) });
|
||||
return false;
|
||||
|
||||
},
|
||||
_show: function(e) {
|
||||
|
||||
this._trigger("beforeShow", e, { options: this.options, hsb: this.color, hex: this._HSBToHex(this.color), rgb: this._HSBToRGB(this.color) });
|
||||
|
||||
var pos = this.element.offset();
|
||||
var viewPort = this._getScroll();
|
||||
var top = pos.top + this.element[0].offsetHeight;
|
||||
var left = pos.left;
|
||||
if (top + 176 > viewPort.t + Math.min(viewPort.h,viewPort.ih)) {
|
||||
top -= this.element[0].offsetHeight + 176;
|
||||
}
|
||||
if (left + 356 > viewPort.l + Math.min(viewPort.w,viewPort.iw)) {
|
||||
left -= 356;
|
||||
}
|
||||
this.picker.css({left: left + 'px', top: top + 'px'});
|
||||
if (this._trigger("show", e, { options: this.options, hsb: this.color, hex: this._HSBToHex(this.color), rgb: this._HSBToRGB(this.color) }) != false) {
|
||||
this.picker.show();
|
||||
}
|
||||
|
||||
var self = this;
|
||||
$(document).bind('mousedown.colorpicker', function(e) { return self._hide.call(self, e); });
|
||||
return false;
|
||||
|
||||
},
|
||||
_hide: function(e) {
|
||||
|
||||
if (!this._isChildOf(this.picker[0], e.target, this.picker[0])) {
|
||||
if (this._trigger("hide", e, { options: this.options, hsb: this.color, hex: this._HSBToHex(this.color), rgb: this._HSBToRGB(this.color) }) != false) {
|
||||
this.picker.hide();
|
||||
}
|
||||
$(document).unbind('mousedown.colorpicker');
|
||||
}
|
||||
|
||||
},
|
||||
_isChildOf: function(parentEl, el, container) {
|
||||
if (parentEl == el) {
|
||||
return true;
|
||||
}
|
||||
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;
|
||||
},
|
||||
_getScroll: function() {
|
||||
var t,l,w,h,iw,ih;
|
||||
if (document.documentElement) {
|
||||
t = document.documentElement.scrollTop;
|
||||
l = document.documentElement.scrollLeft;
|
||||
w = document.documentElement.scrollWidth;
|
||||
h = document.documentElement.scrollHeight;
|
||||
} else {
|
||||
t = document.body.scrollTop;
|
||||
l = document.body.scrollLeft;
|
||||
w = document.body.scrollWidth;
|
||||
h = document.body.scrollHeight;
|
||||
}
|
||||
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 };
|
||||
},
|
||||
_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))
|
||||
};
|
||||
},
|
||||
_HexToRGB: function (hex) {
|
||||
var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
|
||||
return {r: hex >> 16, g: (hex & 0x00FF00) >> 8, b: (hex & 0x0000FF)};
|
||||
},
|
||||
_HexToHSB: function(hex) {
|
||||
return this._RGBToHSB(this._HexToRGB(hex));
|
||||
},
|
||||
_RGBToHSB: function(rgb) {
|
||||
var hsb = {};
|
||||
hsb.b = Math.max(Math.max(rgb.r,rgb.g),rgb.b);
|
||||
hsb.s = (hsb.b <= 0) ? 0 : Math.round(100*(hsb.b - Math.min(Math.min(rgb.r,rgb.g),rgb.b))/hsb.b);
|
||||
hsb.b = Math.round((hsb.b /255)*100);
|
||||
if((rgb.r==rgb.g) && (rgb.g==rgb.b)) hsb.h = 0;
|
||||
else if(rgb.r>=rgb.g && rgb.g>=rgb.b) hsb.h = 60*(rgb.g-rgb.b)/(rgb.r-rgb.b);
|
||||
else if(rgb.g>=rgb.r && rgb.r>=rgb.b) hsb.h = 60 + 60*(rgb.g-rgb.r)/(rgb.g-rgb.b);
|
||||
else if(rgb.g>=rgb.b && rgb.b>=rgb.r) hsb.h = 120 + 60*(rgb.b-rgb.r)/(rgb.g-rgb.r);
|
||||
else if(rgb.b>=rgb.g && rgb.g>=rgb.r) hsb.h = 180 + 60*(rgb.b-rgb.g)/(rgb.b-rgb.r);
|
||||
else if(rgb.b>=rgb.r && rgb.r>=rgb.g) hsb.h = 240 + 60*(rgb.r-rgb.g)/(rgb.b-rgb.g);
|
||||
else if(rgb.r>=rgb.b && rgb.b>=rgb.g) hsb.h = 300 + 60*(rgb.r-rgb.b)/(rgb.r-rgb.g);
|
||||
else hsb.h = 0;
|
||||
hsb.h = Math.round(hsb.h);
|
||||
return hsb;
|
||||
},
|
||||
_HSBToRGB: function(hsb) {
|
||||
var rgb = {};
|
||||
var h = Math.round(hsb.h);
|
||||
var s = Math.round(hsb.s*255/100);
|
||||
var v = Math.round(hsb.b*255/100);
|
||||
if(s == 0) {
|
||||
rgb.r = rgb.g = rgb.b = v;
|
||||
} else {
|
||||
var t1 = v;
|
||||
var t2 = (255-s)*v/255;
|
||||
var t3 = (t1-t2)*(h%60)/60;
|
||||
if(h==360) h = 0;
|
||||
if(h<60) {rgb.r=t1; rgb.b=t2; rgb.g=t2+t3;}
|
||||
else if(h<120) {rgb.g=t1; rgb.b=t2; rgb.r=t1-t3;}
|
||||
else if(h<180) {rgb.g=t1; rgb.r=t2; rgb.b=t2+t3;}
|
||||
else if(h<240) {rgb.b=t1; rgb.r=t2; rgb.g=t1-t3;}
|
||||
else if(h<300) {rgb.b=t1; rgb.g=t2; rgb.r=t2+t3;}
|
||||
else if(h<360) {rgb.r=t1; rgb.g=t2; rgb.b=t1-t3;}
|
||||
else {rgb.r=0; rgb.g=0; rgb.b=0;}
|
||||
}
|
||||
return {r:Math.round(rgb.r), g:Math.round(rgb.g), b:Math.round(rgb.b)};
|
||||
},
|
||||
_RGBToHex: function(rgb) {
|
||||
var hex = [
|
||||
rgb.r.toString(16),
|
||||
rgb.g.toString(16),
|
||||
rgb.b.toString(16)
|
||||
];
|
||||
$.each(hex, function (nr, val) {
|
||||
if (val.length == 1) {
|
||||
hex[nr] = '0' + val;
|
||||
}
|
||||
});
|
||||
return hex.join('');
|
||||
},
|
||||
_HSBToHex: function(hsb) {
|
||||
return this._RGBToHex(this._HSBToRGB(hsb));
|
||||
},
|
||||
setColor: function(col) {
|
||||
if (typeof col == 'string') {
|
||||
col = this._HexToHSB(col);
|
||||
} else if (col.r != undefined && col.g != undefined && col.b != undefined) {
|
||||
col = this._RGBToHSB(col);
|
||||
} else if (col.h != undefined && col.s != undefined && col.b != undefined) {
|
||||
col = this._fixHSB(col);
|
||||
} else {
|
||||
return this;
|
||||
}
|
||||
|
||||
this.color = col;
|
||||
this.origColor = col;
|
||||
this._fillRGBFields(col);
|
||||
this._fillHSBFields(col);
|
||||
this._fillHexFields(col);
|
||||
this._setHue(col);
|
||||
this._setSelector(col);
|
||||
this._setCurrentColor(col);
|
||||
this._setNewColor(col);
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$.extend($.ui.colorpicker, {
|
||||
defaults: {
|
||||
eventName: 'click',
|
||||
color: 'ff0000',
|
||||
flat: false
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
@ -1,175 +1,175 @@
|
||||
/*
|
||||
* jQuery UI Magnifier @VERSION
|
||||
*
|
||||
* Copyright (c) 2008 jQuery
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/Magnifier
|
||||
*
|
||||
* Depends:
|
||||
* ui.core.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
var counter = 0;
|
||||
|
||||
$.widget("ui.magnifier", {
|
||||
_init: function() {
|
||||
var self = this,
|
||||
o = this.options;
|
||||
|
||||
this.element
|
||||
.addClass("ui-magnifier")
|
||||
.bind('click.magnifier', function(e) {
|
||||
(!self.disabled && o.click && o.click.apply(this, [e, {
|
||||
options: self.options,
|
||||
current: self.current[0],
|
||||
currentOffset: self.current[1]
|
||||
}]));
|
||||
});
|
||||
|
||||
// the element must have relative or absolute positioning
|
||||
if (!(/^(r|a)/).test(this.element.css("position"))) {
|
||||
this.element.css("position", "relative");
|
||||
}
|
||||
|
||||
this.items = [];
|
||||
this.element.find(o.items).each(function() {
|
||||
var $this = $(this);
|
||||
// TODO: use a hash so references to this data is readable
|
||||
self.items.push([
|
||||
this,
|
||||
$this.offset(),
|
||||
[$this.width(),$this.height()],
|
||||
(o.overlap ? $this.position() : null)
|
||||
]);
|
||||
|
||||
(o.opacity && $this.css('opacity', o.opacity.min));
|
||||
});
|
||||
|
||||
// absolutize
|
||||
(o.overlap && $.each(this.items, function() {
|
||||
$(this[0]).css({
|
||||
position: "absolute",
|
||||
top: this[3].top,
|
||||
left: this[3].left
|
||||
});
|
||||
}));
|
||||
|
||||
this.identifier = ++counter;
|
||||
$(document).bind("mousemove.magnifier"+this.identifier, function(e) {
|
||||
(self.disabled || self._magnify.apply(self, [e]));
|
||||
});
|
||||
|
||||
this.pp = this.element.offset();
|
||||
},
|
||||
|
||||
destroy: function() {
|
||||
this.reset();
|
||||
this.element
|
||||
.removeClass("ui-magnifier ui-magnifier-disabled")
|
||||
.unbind(".magnifier");
|
||||
$(document).unbind("mousemove.magnifier"+this.identifier);
|
||||
},
|
||||
|
||||
disable: function() {
|
||||
this.reset();
|
||||
$.widget.prototype.disable.apply(this, arguments);
|
||||
},
|
||||
|
||||
reset: function(e) {
|
||||
var o = this.options;
|
||||
|
||||
$.each(this.items, function() {
|
||||
var item = this;
|
||||
$(item[0]).css({
|
||||
width: item[2][0],
|
||||
height: item[2][1],
|
||||
top: (item[3] ? item[3].top : 0),
|
||||
left: (item[3] ? item[3].left : 0)
|
||||
});
|
||||
|
||||
(o.opacity && $(item[0]).css('opacity', o.opacity.min));
|
||||
(o.zIndex && $(item[0]).css("z-index", ""));
|
||||
});
|
||||
},
|
||||
|
||||
_magnify: function(e) {
|
||||
var p = [e.pageX,e.pageY], o = this.options, c, distance = 1;
|
||||
this.current = this.items[0];
|
||||
|
||||
// Compute the parent's distance
|
||||
// we don't need to fire anything if we are not near the parent
|
||||
var overlap = ((p[0] > this.pp.left-o.distance) &&
|
||||
(p[0] < this.pp.left + this.element[0].offsetWidth + o.distance) &&
|
||||
(p[1] > this.pp.top-o.distance) &&
|
||||
(p[1] < this.pp.top + this.element[0].offsetHeight + o.distance));
|
||||
if (!overlap) { return false; }
|
||||
|
||||
for (var i=0; i<this.items.length; i++) {
|
||||
c = this.items[i];
|
||||
|
||||
var olddistance = distance;
|
||||
if (!o.axis) {
|
||||
distance = Math.sqrt(
|
||||
Math.pow(p[0] - ((c[3] ? this.pp.left : c[1].left) + parseInt(c[0].style.left,10)) - (c[0].offsetWidth/2), 2)
|
||||
+ Math.pow(p[1] - ((c[3] ? this.pp.top : c[1].top ) + parseInt(c[0].style.top,10)) - (c[0].offsetHeight/2), 2)
|
||||
);
|
||||
} else {
|
||||
if(o.axis == "y") {
|
||||
distance = Math.abs(p[1] - ((c[3] ? this.pp.top : c[1].top ) + parseInt(c[0].style.top,10)) - (c[0].offsetHeight/2));
|
||||
} else {
|
||||
distance = Math.abs(p[0] - ((c[3] ? this.pp.left : c[1].left) + parseInt(c[0].style.left,10)) - (c[0].offsetWidth/2));
|
||||
}
|
||||
}
|
||||
|
||||
if (distance < o.distance) {
|
||||
this.current = distance < olddistance ? c : this.current;
|
||||
|
||||
if (!o.axis || o.axis != "y") {
|
||||
$(c[0]).css({
|
||||
width: c[2][0]+ (c[2][0] * (o.magnification-1)) - (((distance/o.distance)*c[2][0]) * (o.magnification-1)),
|
||||
left: (c[3] ? (c[3].left + o.verticalLine * ((c[2][1] * (o.magnification-1)) - (((distance/o.distance)*c[2][1]) * (o.magnification-1)))) : 0)
|
||||
});
|
||||
}
|
||||
|
||||
if (!o.axis || o.axis != "x") {
|
||||
$(c[0]).css({
|
||||
height: c[2][1]+ (c[2][1] * (o.magnification-1)) - (((distance/o.distance)*c[2][1]) * (o.magnification-1)),
|
||||
top: (c[3] ? c[3].top : 0) + (o.baseline-0.5) * ((c[2][0] * (o.magnification-1)) - (((distance/o.distance)*c[2][0]) * (o.magnification-1)))
|
||||
});
|
||||
}
|
||||
|
||||
if (o.opacity) {
|
||||
$(c[0]).css('opacity', o.opacity.max-(distance/o.distance) < o.opacity.min ? o.opacity.min : o.opacity.max-(distance/o.distance));
|
||||
}
|
||||
} else {
|
||||
$(c[0]).css({
|
||||
width: c[2][0],
|
||||
height: c[2][1],
|
||||
top: (c[3] ? c[3].top : 0),
|
||||
left: (c[3] ? c[3].left : 0)
|
||||
});
|
||||
|
||||
(o.opacity && $(c[0]).css('opacity', o.opacity.min));
|
||||
}
|
||||
|
||||
(o.zIndex && $(c[0]).css("z-index", ""));
|
||||
}
|
||||
|
||||
(o.zIndex && $(this.current[0]).css("z-index", o.zIndex));
|
||||
}
|
||||
});
|
||||
|
||||
$.extend($.ui.magnifier, {
|
||||
defaults: {
|
||||
distance: 150,
|
||||
magnification: 2,
|
||||
baseline: 0,
|
||||
verticalLine: -0.5,
|
||||
items: "> *"
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
/*
|
||||
* jQuery UI Magnifier @VERSION
|
||||
*
|
||||
* Copyright (c) 2008 jQuery
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/Magnifier
|
||||
*
|
||||
* Depends:
|
||||
* ui.core.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
var counter = 0;
|
||||
|
||||
$.widget("ui.magnifier", {
|
||||
_init: function() {
|
||||
var self = this,
|
||||
o = this.options;
|
||||
|
||||
this.element
|
||||
.addClass("ui-magnifier")
|
||||
.bind('click.magnifier', function(e) {
|
||||
(!self.disabled && o.click && o.click.apply(this, [e, {
|
||||
options: self.options,
|
||||
current: self.current[0],
|
||||
currentOffset: self.current[1]
|
||||
}]));
|
||||
});
|
||||
|
||||
// the element must have relative or absolute positioning
|
||||
if (!(/^(r|a)/).test(this.element.css("position"))) {
|
||||
this.element.css("position", "relative");
|
||||
}
|
||||
|
||||
this.items = [];
|
||||
this.element.find(o.items).each(function() {
|
||||
var $this = $(this);
|
||||
// TODO: use a hash so references to this data is readable
|
||||
self.items.push([
|
||||
this,
|
||||
$this.offset(),
|
||||
[$this.width(),$this.height()],
|
||||
(o.overlap ? $this.position() : null)
|
||||
]);
|
||||
|
||||
(o.opacity && $this.css('opacity', o.opacity.min));
|
||||
});
|
||||
|
||||
// absolutize
|
||||
(o.overlap && $.each(this.items, function() {
|
||||
$(this[0]).css({
|
||||
position: "absolute",
|
||||
top: this[3].top,
|
||||
left: this[3].left
|
||||
});
|
||||
}));
|
||||
|
||||
this.identifier = ++counter;
|
||||
$(document).bind("mousemove.magnifier"+this.identifier, function(e) {
|
||||
(self.disabled || self._magnify.apply(self, [e]));
|
||||
});
|
||||
|
||||
this.pp = this.element.offset();
|
||||
},
|
||||
|
||||
destroy: function() {
|
||||
this.reset();
|
||||
this.element
|
||||
.removeClass("ui-magnifier ui-magnifier-disabled")
|
||||
.unbind(".magnifier");
|
||||
$(document).unbind("mousemove.magnifier"+this.identifier);
|
||||
},
|
||||
|
||||
disable: function() {
|
||||
this.reset();
|
||||
$.widget.prototype.disable.apply(this, arguments);
|
||||
},
|
||||
|
||||
reset: function(e) {
|
||||
var o = this.options;
|
||||
|
||||
$.each(this.items, function() {
|
||||
var item = this;
|
||||
$(item[0]).css({
|
||||
width: item[2][0],
|
||||
height: item[2][1],
|
||||
top: (item[3] ? item[3].top : 0),
|
||||
left: (item[3] ? item[3].left : 0)
|
||||
});
|
||||
|
||||
(o.opacity && $(item[0]).css('opacity', o.opacity.min));
|
||||
(o.zIndex && $(item[0]).css("z-index", ""));
|
||||
});
|
||||
},
|
||||
|
||||
_magnify: function(e) {
|
||||
var p = [e.pageX,e.pageY], o = this.options, c, distance = 1;
|
||||
this.current = this.items[0];
|
||||
|
||||
// Compute the parent's distance
|
||||
// we don't need to fire anything if we are not near the parent
|
||||
var overlap = ((p[0] > this.pp.left-o.distance) &&
|
||||
(p[0] < this.pp.left + this.element[0].offsetWidth + o.distance) &&
|
||||
(p[1] > this.pp.top-o.distance) &&
|
||||
(p[1] < this.pp.top + this.element[0].offsetHeight + o.distance));
|
||||
if (!overlap) { return false; }
|
||||
|
||||
for (var i=0; i<this.items.length; i++) {
|
||||
c = this.items[i];
|
||||
|
||||
var olddistance = distance;
|
||||
if (!o.axis) {
|
||||
distance = Math.sqrt(
|
||||
Math.pow(p[0] - ((c[3] ? this.pp.left : c[1].left) + parseInt(c[0].style.left,10)) - (c[0].offsetWidth/2), 2)
|
||||
+ Math.pow(p[1] - ((c[3] ? this.pp.top : c[1].top ) + parseInt(c[0].style.top,10)) - (c[0].offsetHeight/2), 2)
|
||||
);
|
||||
} else {
|
||||
if(o.axis == "y") {
|
||||
distance = Math.abs(p[1] - ((c[3] ? this.pp.top : c[1].top ) + parseInt(c[0].style.top,10)) - (c[0].offsetHeight/2));
|
||||
} else {
|
||||
distance = Math.abs(p[0] - ((c[3] ? this.pp.left : c[1].left) + parseInt(c[0].style.left,10)) - (c[0].offsetWidth/2));
|
||||
}
|
||||
}
|
||||
|
||||
if (distance < o.distance) {
|
||||
this.current = distance < olddistance ? c : this.current;
|
||||
|
||||
if (!o.axis || o.axis != "y") {
|
||||
$(c[0]).css({
|
||||
width: c[2][0]+ (c[2][0] * (o.magnification-1)) - (((distance/o.distance)*c[2][0]) * (o.magnification-1)),
|
||||
left: (c[3] ? (c[3].left + o.verticalLine * ((c[2][1] * (o.magnification-1)) - (((distance/o.distance)*c[2][1]) * (o.magnification-1)))) : 0)
|
||||
});
|
||||
}
|
||||
|
||||
if (!o.axis || o.axis != "x") {
|
||||
$(c[0]).css({
|
||||
height: c[2][1]+ (c[2][1] * (o.magnification-1)) - (((distance/o.distance)*c[2][1]) * (o.magnification-1)),
|
||||
top: (c[3] ? c[3].top : 0) + (o.baseline-0.5) * ((c[2][0] * (o.magnification-1)) - (((distance/o.distance)*c[2][0]) * (o.magnification-1)))
|
||||
});
|
||||
}
|
||||
|
||||
if (o.opacity) {
|
||||
$(c[0]).css('opacity', o.opacity.max-(distance/o.distance) < o.opacity.min ? o.opacity.min : o.opacity.max-(distance/o.distance));
|
||||
}
|
||||
} else {
|
||||
$(c[0]).css({
|
||||
width: c[2][0],
|
||||
height: c[2][1],
|
||||
top: (c[3] ? c[3].top : 0),
|
||||
left: (c[3] ? c[3].left : 0)
|
||||
});
|
||||
|
||||
(o.opacity && $(c[0]).css('opacity', o.opacity.min));
|
||||
}
|
||||
|
||||
(o.zIndex && $(c[0]).css("z-index", ""));
|
||||
}
|
||||
|
||||
(o.zIndex && $(this.current[0]).css("z-index", o.zIndex));
|
||||
}
|
||||
});
|
||||
|
||||
$.extend($.ui.magnifier, {
|
||||
defaults: {
|
||||
distance: 150,
|
||||
magnification: 2,
|
||||
baseline: 0,
|
||||
verticalLine: -0.5,
|
||||
items: "> *"
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
|
668
ui/ui.spinner.js
668
ui/ui.spinner.js
@ -1,334 +1,334 @@
|
||||
/*
|
||||
* jQuery UI Spinner @VERSION
|
||||
*
|
||||
* Copyright (c) 2008 jQuery
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/Spinner
|
||||
*
|
||||
* Depends:
|
||||
* ui.core.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
$.widget('ui.spinner', {
|
||||
_init: function() {
|
||||
// terminate initialization if spinner already applied to current element
|
||||
if($.data(this.element[0], 'spinner')) return;
|
||||
|
||||
// check for onInit callback
|
||||
if (this.options.init) {
|
||||
this.options.init(this.ui(null));
|
||||
}
|
||||
|
||||
// check for decimals in steppinng and set _decimals as internal (needs cleaning up)
|
||||
this._decimals = 0;
|
||||
if (this.options.stepping.toString().indexOf('.') != -1) {
|
||||
var s = this.options.stepping.toString();
|
||||
this._decimals = s.slice(s.indexOf('.')+1, s.length).length;
|
||||
}
|
||||
|
||||
//Initialize needed constants
|
||||
var self = this;
|
||||
this.element
|
||||
.addClass('ui-spinner-box')
|
||||
.attr('autocomplete', 'off'); // switch off autocomplete in opera
|
||||
|
||||
this._setValue( isNaN(this._getValue()) ? this.options.start : this._getValue() );
|
||||
|
||||
this.element
|
||||
.wrap('<div>')
|
||||
.parent()
|
||||
.addClass('ui-spinner')
|
||||
.append('<button class="ui-spinner-up" type="button">▲</button>')
|
||||
.find('.ui-spinner-up')
|
||||
.bind('mousedown', function(e) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._mousedown(100, '_up', e);
|
||||
})
|
||||
.bind('mouseup', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
if(self.counter == 1) self._up(e);
|
||||
self._mouseup(e);
|
||||
})
|
||||
.bind('mouseout', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._mouseup(e);
|
||||
})
|
||||
// mousedown/mouseup capture first click, now handle second click
|
||||
.bind('dblclick', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._up(e);
|
||||
})
|
||||
.bind('keydown.spinner', function(e) {
|
||||
var KEYS = $.keyCode;
|
||||
if (e.keyCode == KEYS.SPACE || e.keyCode == KEYS.ENTER) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._up.call(self, e);
|
||||
} else if (e.keyCode == KEYS.DOWN || e.keyCode == KEYS.RIGHT) {
|
||||
self.element.siblings('.ui-spinner-down').focus();
|
||||
} else if (e.keyCode == KEYS.LEFT) {
|
||||
self.element.focus();
|
||||
}
|
||||
})
|
||||
.bind('keyup.spinner', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self.counter = 0;
|
||||
self._propagate('change', e);
|
||||
})
|
||||
.end()
|
||||
.append('<button class="ui-spinner-down" type="button">▼</button>')
|
||||
.find('.ui-spinner-down')
|
||||
.bind('mousedown', function(e) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._mousedown(100, '_down', e);
|
||||
})
|
||||
.bind('mouseup', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
if(self.counter == 1) self._down();
|
||||
self._mouseup(e);
|
||||
})
|
||||
.bind('mouseout', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._mouseup(e);
|
||||
})
|
||||
// mousedown/mouseup capture first click, now handle second click
|
||||
.bind('dblclick', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._down(e);
|
||||
})
|
||||
.bind('keydown.spinner', function(e) {
|
||||
var KEYS = $.keyCode;
|
||||
if (e.keyCode == KEYS.SPACE || e.keyCode == KEYS.ENTER) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._down.call(self, e);
|
||||
} else if (e.keyCode == KEYS.UP || e.keyCode == KEYS.LEFT) {
|
||||
self.element.siblings('.ui-spinner-up').focus();
|
||||
}
|
||||
})
|
||||
.bind('keyup.spinner', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self.counter = 0;
|
||||
self._propagate('change', e);
|
||||
})
|
||||
.end();
|
||||
|
||||
|
||||
// DataList: Set contraints for object length and step size.
|
||||
// Manipulate height of spinner.
|
||||
this._items = this.element.children().length;
|
||||
if (this._items > 1) {
|
||||
this.element
|
||||
.addClass('ui-spinner-list')
|
||||
.css('height', this.element.outerHeight()/this._items)
|
||||
.children()
|
||||
.addClass('ui-spinner-listitem')
|
||||
.end()
|
||||
.parent()
|
||||
.css('height', this.element.outerHeight())
|
||||
.end();
|
||||
this.options.stepping = 1;
|
||||
this.options.min = 0;
|
||||
this.options.max = this._items-1;
|
||||
}
|
||||
|
||||
this.element
|
||||
.bind('keydown.spinner', function(e) {
|
||||
if(!self.counter) self.counter = 1;
|
||||
return self._keydown.call(self, e);
|
||||
})
|
||||
.bind('keyup.spinner', function(e) {
|
||||
self.counter = 0;
|
||||
self._propagate('change', e);
|
||||
})
|
||||
.bind('blur.spinner', function(e) {
|
||||
self._cleanUp();
|
||||
});
|
||||
|
||||
if ($.fn.mousewheel) {
|
||||
this.element.mousewheel(function(e, delta) {
|
||||
self._mousewheel(e, delta);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
_constrain: function() {
|
||||
if(this.options.min != undefined && this._getValue() < this.options.min) this._setValue(this.options.min);
|
||||
if(this.options.max != undefined && this._getValue() > this.options.max) this._setValue(this.options.max);
|
||||
},
|
||||
_cleanUp: function() {
|
||||
this._setValue(this._getValue());
|
||||
this._constrain();
|
||||
},
|
||||
_spin: function(d, e) {
|
||||
if (this.disabled) return;
|
||||
|
||||
if(isNaN(this._getValue())) this._setValue(this.options.start);
|
||||
this._setValue(this._getValue() + (d == 'up' ? 1:-1) * (this.options.incremental && this.counter > 100 ? (this.counter > 200 ? 100 : 10) : 1) * this.options.stepping);
|
||||
this._animate(d);
|
||||
this._constrain();
|
||||
if(this.counter) this.counter++;
|
||||
this._propagate('spin', e);
|
||||
},
|
||||
_down: function(e) {
|
||||
this._spin('down', e);
|
||||
this._propagate('down', e);
|
||||
},
|
||||
_up: function(e) {
|
||||
this._spin('up', e);
|
||||
this._propagate('up', e);
|
||||
},
|
||||
_mousedown: function(i, d, e) {
|
||||
var self = this;
|
||||
i = i || 100;
|
||||
if(this.timer) window.clearInterval(this.timer);
|
||||
this.timer = window.setInterval(function() {
|
||||
self[d](e);
|
||||
if(self.counter > 20) self._mousedown(20, d, e);
|
||||
}, i);
|
||||
},
|
||||
_mouseup: function(e) {
|
||||
this.counter = 0;
|
||||
if(this.timer) window.clearInterval(this.timer);
|
||||
this.element[0].focus();
|
||||
this._propagate('change', e);
|
||||
},
|
||||
_keydown: function(e) {
|
||||
var KEYS = $.keyCode;
|
||||
|
||||
if(e.keyCode == KEYS.UP) this._up(e);
|
||||
if(e.keyCode == KEYS.DOWN) this._down(e);
|
||||
if(e.keyCode == KEYS.HOME) this._setValue(this.options.min || this.options.start); //Home key goes to min, if defined, else to start
|
||||
if(e.keyCode == KEYS.END && this.options.max != undefined) this._setValue(this.options.max); //End key goes to maximum
|
||||
return (e.keyCode == KEYS.TAB || e.keyCode == KEYS.BACKSPACE ||
|
||||
e.keyCode == KEYS.LEFT || e.keyCode == KEYS.RIGHT || e.keyCode == KEYS.PERIOD ||
|
||||
e.keyCode == KEYS.NUMPAD_DECIMAL || e.keyCode == KEYS.NUMPAD_SUBTRACT ||
|
||||
(e.keyCode >= 96 && e.keyCode <= 105) || // add support for numeric keypad 0-9
|
||||
(/[0-9\-\.]/).test(String.fromCharCode(e.keyCode))) ? true : false;
|
||||
},
|
||||
_mousewheel: function(e, delta) {
|
||||
delta = ($.browser.opera ? -delta / Math.abs(delta) : delta);
|
||||
delta > 0 ? this._up(e) : this._down(e);
|
||||
e.preventDefault();
|
||||
},
|
||||
_getValue: function() {
|
||||
return parseFloat(this.element.val().replace(/[^0-9\-\.]/g, ''));
|
||||
},
|
||||
_setValue: function(newVal) {
|
||||
if(isNaN(newVal)) newVal = this.options.start;
|
||||
this.element.val(
|
||||
this.options.currency ?
|
||||
$.ui.spinner.format.currency(newVal, this.options.currency) :
|
||||
$.ui.spinner.format.number(newVal, this._decimals)
|
||||
);
|
||||
},
|
||||
_animate: function(d) {
|
||||
if (this.element.hasClass('ui-spinner-list') && ((d == 'up' && this._getValue() <= this.options.max) || (d == 'down' && this._getValue() >= this.options.min)) ) {
|
||||
this.element.animate({marginTop: '-' + this._getValue() * this.element.outerHeight() }, {
|
||||
duration: 'fast',
|
||||
queue: false
|
||||
});
|
||||
}
|
||||
},
|
||||
_addItem: function(html) {
|
||||
if (!this.element.is('input')) {
|
||||
var wrapper = 'div';
|
||||
if (this.element.is('ol') || this.element.is('ul')) {
|
||||
wrapper = 'li';
|
||||
}
|
||||
this.element.append('<'+ wrapper +' class="ui-spinner-dyn">'+ html + '</'+ wrapper +'>');
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
plugins: {},
|
||||
ui: function(e) {
|
||||
return {
|
||||
options: this.options,
|
||||
element: this.element,
|
||||
value: this._getValue(),
|
||||
add: this._addItem
|
||||
};
|
||||
},
|
||||
_propagate: function(n,e) {
|
||||
$.ui.plugin.call(this, n, [e, this.ui()]);
|
||||
return this.element.triggerHandler(n == 'spin' ? n : 'spin'+n, [e, this.ui()], this.options[n]);
|
||||
},
|
||||
destroy: function() {
|
||||
if(!$.data(this.element[0], 'spinner')) return;
|
||||
if ($.fn.mousewheel) {
|
||||
this.element.unmousewheel();
|
||||
}
|
||||
this.element
|
||||
.removeClass('ui-spinner-box ui-spinner-list')
|
||||
.removeAttr('disabled')
|
||||
.removeAttr('autocomplete')
|
||||
.removeData('spinner')
|
||||
.unbind('.spinner')
|
||||
.siblings()
|
||||
.remove()
|
||||
.end()
|
||||
.children()
|
||||
.removeClass('ui-spinner-listitem')
|
||||
.remove('.ui-spinner-dyn')
|
||||
.end()
|
||||
.parent()
|
||||
.removeClass('ui-spinner ui-spinner-disabled')
|
||||
.before(this.element.clone())
|
||||
.remove()
|
||||
.end();
|
||||
},
|
||||
enable: function() {
|
||||
this.element
|
||||
.removeAttr('disabled')
|
||||
.siblings()
|
||||
.removeAttr('disabled')
|
||||
.parent()
|
||||
.removeClass('ui-spinner-disabled');
|
||||
this.disabled = false;
|
||||
},
|
||||
disable: function() {
|
||||
this.element
|
||||
.attr('disabled', true)
|
||||
.siblings()
|
||||
.attr('disabled', true)
|
||||
.parent()
|
||||
.addClass('ui-spinner-disabled');
|
||||
this.disabled = true;
|
||||
}
|
||||
});
|
||||
|
||||
$.extend($.ui.spinner, {
|
||||
defaults: {
|
||||
stepping: 1,
|
||||
start: 0,
|
||||
incremental: true,
|
||||
currency: false
|
||||
},
|
||||
format: {
|
||||
number: function(num, dec) {
|
||||
return this.round(num, dec);
|
||||
},
|
||||
currency: function(num, sym) {
|
||||
return (num !== Math.abs(num) ? '-' : '') + sym + this.round(Math.abs(num), 2);
|
||||
},
|
||||
round: function(num, dec) {
|
||||
var s = Math.round(parseFloat(num)*Math.pow(10, dec)) / Math.pow(10, dec); // round off weird decimals
|
||||
if (dec > 0) {
|
||||
s = s + ((s.toString().indexOf('.') == -1) ? '.' : '') + '0000000001';
|
||||
s = s.substr(0, s.indexOf('.')+1+dec);
|
||||
} else {
|
||||
s = Math.round(s);
|
||||
}
|
||||
return s;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
/*
|
||||
* jQuery UI Spinner @VERSION
|
||||
*
|
||||
* Copyright (c) 2008 jQuery
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*
|
||||
* http://docs.jquery.com/UI/Spinner
|
||||
*
|
||||
* Depends:
|
||||
* ui.core.js
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
$.widget('ui.spinner', {
|
||||
_init: function() {
|
||||
// terminate initialization if spinner already applied to current element
|
||||
if($.data(this.element[0], 'spinner')) return;
|
||||
|
||||
// check for onInit callback
|
||||
if (this.options.init) {
|
||||
this.options.init(this.ui(null));
|
||||
}
|
||||
|
||||
// check for decimals in steppinng and set _decimals as internal (needs cleaning up)
|
||||
this._decimals = 0;
|
||||
if (this.options.stepping.toString().indexOf('.') != -1) {
|
||||
var s = this.options.stepping.toString();
|
||||
this._decimals = s.slice(s.indexOf('.')+1, s.length).length;
|
||||
}
|
||||
|
||||
//Initialize needed constants
|
||||
var self = this;
|
||||
this.element
|
||||
.addClass('ui-spinner-box')
|
||||
.attr('autocomplete', 'off'); // switch off autocomplete in opera
|
||||
|
||||
this._setValue( isNaN(this._getValue()) ? this.options.start : this._getValue() );
|
||||
|
||||
this.element
|
||||
.wrap('<div>')
|
||||
.parent()
|
||||
.addClass('ui-spinner')
|
||||
.append('<button class="ui-spinner-up" type="button">▲</button>')
|
||||
.find('.ui-spinner-up')
|
||||
.bind('mousedown', function(e) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._mousedown(100, '_up', e);
|
||||
})
|
||||
.bind('mouseup', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
if(self.counter == 1) self._up(e);
|
||||
self._mouseup(e);
|
||||
})
|
||||
.bind('mouseout', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._mouseup(e);
|
||||
})
|
||||
// mousedown/mouseup capture first click, now handle second click
|
||||
.bind('dblclick', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._up(e);
|
||||
})
|
||||
.bind('keydown.spinner', function(e) {
|
||||
var KEYS = $.keyCode;
|
||||
if (e.keyCode == KEYS.SPACE || e.keyCode == KEYS.ENTER) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._up.call(self, e);
|
||||
} else if (e.keyCode == KEYS.DOWN || e.keyCode == KEYS.RIGHT) {
|
||||
self.element.siblings('.ui-spinner-down').focus();
|
||||
} else if (e.keyCode == KEYS.LEFT) {
|
||||
self.element.focus();
|
||||
}
|
||||
})
|
||||
.bind('keyup.spinner', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self.counter = 0;
|
||||
self._propagate('change', e);
|
||||
})
|
||||
.end()
|
||||
.append('<button class="ui-spinner-down" type="button">▼</button>')
|
||||
.find('.ui-spinner-down')
|
||||
.bind('mousedown', function(e) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._mousedown(100, '_down', e);
|
||||
})
|
||||
.bind('mouseup', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
if(self.counter == 1) self._down();
|
||||
self._mouseup(e);
|
||||
})
|
||||
.bind('mouseout', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._mouseup(e);
|
||||
})
|
||||
// mousedown/mouseup capture first click, now handle second click
|
||||
.bind('dblclick', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self._down(e);
|
||||
})
|
||||
.bind('keydown.spinner', function(e) {
|
||||
var KEYS = $.keyCode;
|
||||
if (e.keyCode == KEYS.SPACE || e.keyCode == KEYS.ENTER) {
|
||||
$(this).addClass('ui-spinner-pressed');
|
||||
if(!self.counter) self.counter = 1;
|
||||
self._down.call(self, e);
|
||||
} else if (e.keyCode == KEYS.UP || e.keyCode == KEYS.LEFT) {
|
||||
self.element.siblings('.ui-spinner-up').focus();
|
||||
}
|
||||
})
|
||||
.bind('keyup.spinner', function(e) {
|
||||
$(this).removeClass('ui-spinner-pressed');
|
||||
self.counter = 0;
|
||||
self._propagate('change', e);
|
||||
})
|
||||
.end();
|
||||
|
||||
|
||||
// DataList: Set contraints for object length and step size.
|
||||
// Manipulate height of spinner.
|
||||
this._items = this.element.children().length;
|
||||
if (this._items > 1) {
|
||||
this.element
|
||||
.addClass('ui-spinner-list')
|
||||
.css('height', this.element.outerHeight()/this._items)
|
||||
.children()
|
||||
.addClass('ui-spinner-listitem')
|
||||
.end()
|
||||
.parent()
|
||||
.css('height', this.element.outerHeight())
|
||||
.end();
|
||||
this.options.stepping = 1;
|
||||
this.options.min = 0;
|
||||
this.options.max = this._items-1;
|
||||
}
|
||||
|
||||
this.element
|
||||
.bind('keydown.spinner', function(e) {
|
||||
if(!self.counter) self.counter = 1;
|
||||
return self._keydown.call(self, e);
|
||||
})
|
||||
.bind('keyup.spinner', function(e) {
|
||||
self.counter = 0;
|
||||
self._propagate('change', e);
|
||||
})
|
||||
.bind('blur.spinner', function(e) {
|
||||
self._cleanUp();
|
||||
});
|
||||
|
||||
if ($.fn.mousewheel) {
|
||||
this.element.mousewheel(function(e, delta) {
|
||||
self._mousewheel(e, delta);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
_constrain: function() {
|
||||
if(this.options.min != undefined && this._getValue() < this.options.min) this._setValue(this.options.min);
|
||||
if(this.options.max != undefined && this._getValue() > this.options.max) this._setValue(this.options.max);
|
||||
},
|
||||
_cleanUp: function() {
|
||||
this._setValue(this._getValue());
|
||||
this._constrain();
|
||||
},
|
||||
_spin: function(d, e) {
|
||||
if (this.disabled) return;
|
||||
|
||||
if(isNaN(this._getValue())) this._setValue(this.options.start);
|
||||
this._setValue(this._getValue() + (d == 'up' ? 1:-1) * (this.options.incremental && this.counter > 100 ? (this.counter > 200 ? 100 : 10) : 1) * this.options.stepping);
|
||||
this._animate(d);
|
||||
this._constrain();
|
||||
if(this.counter) this.counter++;
|
||||
this._propagate('spin', e);
|
||||
},
|
||||
_down: function(e) {
|
||||
this._spin('down', e);
|
||||
this._propagate('down', e);
|
||||
},
|
||||
_up: function(e) {
|
||||
this._spin('up', e);
|
||||
this._propagate('up', e);
|
||||
},
|
||||
_mousedown: function(i, d, e) {
|
||||
var self = this;
|
||||
i = i || 100;
|
||||
if(this.timer) window.clearInterval(this.timer);
|
||||
this.timer = window.setInterval(function() {
|
||||
self[d](e);
|
||||
if(self.counter > 20) self._mousedown(20, d, e);
|
||||
}, i);
|
||||
},
|
||||
_mouseup: function(e) {
|
||||
this.counter = 0;
|
||||
if(this.timer) window.clearInterval(this.timer);
|
||||
this.element[0].focus();
|
||||
this._propagate('change', e);
|
||||
},
|
||||
_keydown: function(e) {
|
||||
var KEYS = $.keyCode;
|
||||
|
||||
if(e.keyCode == KEYS.UP) this._up(e);
|
||||
if(e.keyCode == KEYS.DOWN) this._down(e);
|
||||
if(e.keyCode == KEYS.HOME) this._setValue(this.options.min || this.options.start); //Home key goes to min, if defined, else to start
|
||||
if(e.keyCode == KEYS.END && this.options.max != undefined) this._setValue(this.options.max); //End key goes to maximum
|
||||
return (e.keyCode == KEYS.TAB || e.keyCode == KEYS.BACKSPACE ||
|
||||
e.keyCode == KEYS.LEFT || e.keyCode == KEYS.RIGHT || e.keyCode == KEYS.PERIOD ||
|
||||
e.keyCode == KEYS.NUMPAD_DECIMAL || e.keyCode == KEYS.NUMPAD_SUBTRACT ||
|
||||
(e.keyCode >= 96 && e.keyCode <= 105) || // add support for numeric keypad 0-9
|
||||
(/[0-9\-\.]/).test(String.fromCharCode(e.keyCode))) ? true : false;
|
||||
},
|
||||
_mousewheel: function(e, delta) {
|
||||
delta = ($.browser.opera ? -delta / Math.abs(delta) : delta);
|
||||
delta > 0 ? this._up(e) : this._down(e);
|
||||
e.preventDefault();
|
||||
},
|
||||
_getValue: function() {
|
||||
return parseFloat(this.element.val().replace(/[^0-9\-\.]/g, ''));
|
||||
},
|
||||
_setValue: function(newVal) {
|
||||
if(isNaN(newVal)) newVal = this.options.start;
|
||||
this.element.val(
|
||||
this.options.currency ?
|
||||
$.ui.spinner.format.currency(newVal, this.options.currency) :
|
||||
$.ui.spinner.format.number(newVal, this._decimals)
|
||||
);
|
||||
},
|
||||
_animate: function(d) {
|
||||
if (this.element.hasClass('ui-spinner-list') && ((d == 'up' && this._getValue() <= this.options.max) || (d == 'down' && this._getValue() >= this.options.min)) ) {
|
||||
this.element.animate({marginTop: '-' + this._getValue() * this.element.outerHeight() }, {
|
||||
duration: 'fast',
|
||||
queue: false
|
||||
});
|
||||
}
|
||||
},
|
||||
_addItem: function(html) {
|
||||
if (!this.element.is('input')) {
|
||||
var wrapper = 'div';
|
||||
if (this.element.is('ol') || this.element.is('ul')) {
|
||||
wrapper = 'li';
|
||||
}
|
||||
this.element.append('<'+ wrapper +' class="ui-spinner-dyn">'+ html + '</'+ wrapper +'>');
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
plugins: {},
|
||||
ui: function(e) {
|
||||
return {
|
||||
options: this.options,
|
||||
element: this.element,
|
||||
value: this._getValue(),
|
||||
add: this._addItem
|
||||
};
|
||||
},
|
||||
_propagate: function(n,e) {
|
||||
$.ui.plugin.call(this, n, [e, this.ui()]);
|
||||
return this.element.triggerHandler(n == 'spin' ? n : 'spin'+n, [e, this.ui()], this.options[n]);
|
||||
},
|
||||
destroy: function() {
|
||||
if(!$.data(this.element[0], 'spinner')) return;
|
||||
if ($.fn.mousewheel) {
|
||||
this.element.unmousewheel();
|
||||
}
|
||||
this.element
|
||||
.removeClass('ui-spinner-box ui-spinner-list')
|
||||
.removeAttr('disabled')
|
||||
.removeAttr('autocomplete')
|
||||
.removeData('spinner')
|
||||
.unbind('.spinner')
|
||||
.siblings()
|
||||
.remove()
|
||||
.end()
|
||||
.children()
|
||||
.removeClass('ui-spinner-listitem')
|
||||
.remove('.ui-spinner-dyn')
|
||||
.end()
|
||||
.parent()
|
||||
.removeClass('ui-spinner ui-spinner-disabled')
|
||||
.before(this.element.clone())
|
||||
.remove()
|
||||
.end();
|
||||
},
|
||||
enable: function() {
|
||||
this.element
|
||||
.removeAttr('disabled')
|
||||
.siblings()
|
||||
.removeAttr('disabled')
|
||||
.parent()
|
||||
.removeClass('ui-spinner-disabled');
|
||||
this.disabled = false;
|
||||
},
|
||||
disable: function() {
|
||||
this.element
|
||||
.attr('disabled', true)
|
||||
.siblings()
|
||||
.attr('disabled', true)
|
||||
.parent()
|
||||
.addClass('ui-spinner-disabled');
|
||||
this.disabled = true;
|
||||
}
|
||||
});
|
||||
|
||||
$.extend($.ui.spinner, {
|
||||
defaults: {
|
||||
stepping: 1,
|
||||
start: 0,
|
||||
incremental: true,
|
||||
currency: false
|
||||
},
|
||||
format: {
|
||||
number: function(num, dec) {
|
||||
return this.round(num, dec);
|
||||
},
|
||||
currency: function(num, sym) {
|
||||
return (num !== Math.abs(num) ? '-' : '') + sym + this.round(Math.abs(num), 2);
|
||||
},
|
||||
round: function(num, dec) {
|
||||
var s = Math.round(parseFloat(num)*Math.pow(10, dec)) / Math.pow(10, dec); // round off weird decimals
|
||||
if (dec > 0) {
|
||||
s = s + ((s.toString().indexOf('.') == -1) ? '.' : '') + '0000000001';
|
||||
s = s.substr(0, s.indexOf('.')+1+dec);
|
||||
} else {
|
||||
s = Math.round(s);
|
||||
}
|
||||
return s;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
|
Loading…
Reference in New Issue
Block a user