summaryrefslogtreecommitdiff
path: root/framework/Web/Javascripts/js/colorpicker.js
diff options
context:
space:
mode:
Diffstat (limited to 'framework/Web/Javascripts/js/colorpicker.js')
-rw-r--r--framework/Web/Javascripts/js/colorpicker.js984
1 files changed, 556 insertions, 428 deletions
diff --git a/framework/Web/Javascripts/js/colorpicker.js b/framework/Web/Javascripts/js/colorpicker.js
index 3dde7692..27e180b0 100644
--- a/framework/Web/Javascripts/js/colorpicker.js
+++ b/framework/Web/Javascripts/js/colorpicker.js
@@ -1,467 +1,595 @@
-if(typeof (Rico)=="undefined"){
-Rico={};
-}
-Rico.Color=Class.create();
-Rico.Color.prototype={initialize:function(_1,_2,_3){
-this.rgb={r:_1,g:_2,b:_3};
-},setRed:function(r){
-this.rgb.r=r;
-},setGreen:function(g){
-this.rgb.g=g;
-},setBlue:function(b){
-this.rgb.b=b;
-},setHue:function(h){
-var _8=this.asHSB();
-_8.h=h;
-this.rgb=Rico.Color.HSBtoRGB(_8.h,_8.s,_8.b);
-},setSaturation:function(s){
-var hsb=this.asHSB();
-hsb.s=s;
-this.rgb=Rico.Color.HSBtoRGB(hsb.h,hsb.s,hsb.b);
-},setBrightness:function(b){
-var hsb=this.asHSB();
-hsb.b=b;
-this.rgb=Rico.Color.HSBtoRGB(hsb.h,hsb.s,hsb.b);
-},darken:function(_11){
-var hsb=this.asHSB();
-this.rgb=Rico.Color.HSBtoRGB(hsb.h,hsb.s,Math.max(hsb.b-_11,0));
-},brighten:function(_12){
-var hsb=this.asHSB();
-this.rgb=Rico.Color.HSBtoRGB(hsb.h,hsb.s,Math.min(hsb.b+_12,1));
-},blend:function(_13){
-this.rgb.r=Math.floor((this.rgb.r+_13.rgb.r)/2);
-this.rgb.g=Math.floor((this.rgb.g+_13.rgb.g)/2);
-this.rgb.b=Math.floor((this.rgb.b+_13.rgb.b)/2);
-},isBright:function(){
-var hsb=this.asHSB();
-return this.asHSB().b>0.5;
-},isDark:function(){
-return !this.isBright();
-},asRGB:function(){
-return "rgb("+this.rgb.r+","+this.rgb.g+","+this.rgb.b+")";
-},asHex:function(){
-return "#"+this.rgb.r.toColorPart()+this.rgb.g.toColorPart()+this.rgb.b.toColorPart();
-},asHSB:function(){
-return Rico.Color.RGBtoHSB(this.rgb.r,this.rgb.g,this.rgb.b);
-},toString:function(){
+
+if(typeof(Rico) == "undefined") Rico = {};
+Rico.Color = Class.create();
+Rico.Color.prototype = {
+initialize: function(red, green, blue) {
+this.rgb = { r: red, g : green, b : blue };
+ },
+setRed: function(r) {
+this.rgb.r = r;
+ },
+setGreen: function(g) {
+this.rgb.g = g;
+ },
+setBlue: function(b) {
+this.rgb.b = b;
+ },
+setHue: function(h) {
+var hsb = this.asHSB();
+hsb.h = h;
+this.rgb = Rico.Color.HSBtoRGB(hsb.h, hsb.s, hsb.b);
+ },
+setSaturation: function(s) {
+var hsb = this.asHSB();
+hsb.s = s;
+this.rgb = Rico.Color.HSBtoRGB(hsb.h, hsb.s, hsb.b);
+ },
+setBrightness: function(b) {
+var hsb = this.asHSB();
+hsb.b = b;
+this.rgb = Rico.Color.HSBtoRGB( hsb.h, hsb.s, hsb.b );
+ },
+darken: function(percent) {
+var hsb= this.asHSB();
+this.rgb = Rico.Color.HSBtoRGB(hsb.h, hsb.s, Math.max(hsb.b - percent,0));
+ },
+brighten: function(percent) {
+var hsb= this.asHSB();
+this.rgb = Rico.Color.HSBtoRGB(hsb.h, hsb.s, Math.min(hsb.b + percent,1));
+ },
+blend: function(other) {
+this.rgb.r = Math.floor((this.rgb.r + other.rgb.r)/2);
+this.rgb.g = Math.floor((this.rgb.g + other.rgb.g)/2);
+this.rgb.b = Math.floor((this.rgb.b + other.rgb.b)/2);
+ },
+isBright: function() {
+var hsb = this.asHSB();
+return this.asHSB().b > 0.5;
+ },
+isDark: function() {
+return ! this.isBright();
+ },
+asRGB: function() {
+return "rgb(" + this.rgb.r + "," + this.rgb.g + "," + this.rgb.b + ")";
+ },
+asHex: function() {
+return "#" + this.rgb.r.toColorPart() + this.rgb.g.toColorPart() + this.rgb.b.toColorPart();
+ },
+asHSB: function() {
+return Rico.Color.RGBtoHSB(this.rgb.r, this.rgb.g, this.rgb.b);
+ },
+toString: function() {
return this.asHex();
-}};
-Rico.Color.createFromHex=function(_14){
-if(_14.indexOf("#")==0){
-_14=_14.substring(1);
-}
-var red="ff",green="ff",blue="ff";
-if(_14.length>4){
-red=_14.substring(0,2);
-green=_14.substring(2,4);
-blue=_14.substring(4,6);
-}else{
-if(_14.length>0&_14.length<4){
-var r=_14.substring(0,1);
-var g=_14.substring(1,2);
-var b=_14.substring(2);
-red=r+r;
-green=g+g;
-blue=b+b;
-}
-}
-return new Rico.Color(parseInt(red,16),parseInt(green,16),parseInt(blue,16));
+ }
};
-Rico.Color.createColorFromBackground=function(_16){
-var _17=Element.getStyle($(_16),"background-color");
-if(_17=="transparent"&&_16.parent){
-return Rico.Color.createColorFromBackground(_16.parent);
-}
-if(_17==null){
+Rico.Color.createFromHex = function(hexCode) {
+if ( hexCode.indexOf('#') == 0 )
+hexCode = hexCode.substring(1);
+var red = "ff", green = "ff", blue="ff";
+ if(hexCode.length > 4)
+{
+ red = hexCode.substring(0,2);
+ green = hexCode.substring(2,4);
+ blue= hexCode.substring(4,6);
+}
+else if(hexCode.length > 0 & hexCode.length < 4)
+{
+var r = hexCode.substring(0,1);
+var g = hexCode.substring(1,2);
+var b = hexCode.substring(2);
+red = r+r;
+green = g+g;
+blue = b+b;
+}
+ return new Rico.Color( parseInt(red,16), parseInt(green,16), parseInt(blue,16) );
+}
+Rico.Color.createColorFromBackground = function(elem) {
+var actualColor = Element.getStyle($(elem), "background-color");
+if ( actualColor == "transparent" && elem.parent )
+return Rico.Color.createColorFromBackground(elem.parent);
+if ( actualColor == null )
return new Rico.Color(255,255,255);
-}
-if(_17.indexOf("rgb(")==0){
-var _18=_17.substring(4,_17.length-1);
-var _19=_18.split(",");
-return new Rico.Color(parseInt(_19[0]),parseInt(_19[1]),parseInt(_19[2]));
-}else{
-if(_17.indexOf("#")==0){
-return Rico.Color.createFromHex(_17);
-}else{
+if ( actualColor.indexOf("rgb(") == 0 ) {
+var colors = actualColor.substring(4, actualColor.length - 1 );
+var colorArray = colors.split(",");
+return new Rico.Color( parseInt( colorArray[0] ),
+parseInt( colorArray[1] ),
+parseInt( colorArray[2] ));
+}
+ else if ( actualColor.indexOf("#") == 0 ) {
+return Rico.Color.createFromHex(actualColor);
+ }
+ else
return new Rico.Color(255,255,255);
}
-}
-};
-Rico.Color.HSBtoRGB=function(hue,_21,_22){
-var red=0;
-var _23=0;
-var _24=0;
-if(_21==0){
-red=parseInt(_22*255+0.5);
-_23=red;
-_24=red;
-}else{
-var h=(hue-Math.floor(hue))*6;
-var f=h-Math.floor(h);
-var p=_22*(1-_21);
-var q=_22*(1-_21*f);
-var t=_22*(1-(_21*(1-f)));
-switch(parseInt(h)){
-case 0:
-red=(_22*255+0.5);
-_23=(t*255+0.5);
-_24=(p*255+0.5);
+Rico.Color.HSBtoRGB = function(hue, saturation, brightness) {
+var red = 0;
+var green = 0;
+var blue= 0;
+if (saturation == 0) {
+red = parseInt(brightness * 255.0 + 0.5);
+ green = red;
+ blue = red;
+}
+else {
+var h = (hue - Math.floor(hue)) * 6.0;
+var f = h - Math.floor(h);
+var p = brightness * (1.0 - saturation);
+var q = brightness * (1.0 - saturation * f);
+var t = brightness * (1.0 - (saturation * (1.0 - f)));
+switch (parseInt(h)) {
+ case 0:
+red = (brightness * 255.0 + 0.5);
+green = (t * 255.0 + 0.5);
+blue= (p * 255.0 + 0.5);
break;
-case 1:
-red=(q*255+0.5);
-_23=(_22*255+0.5);
-_24=(p*255+0.5);
+ case 1:
+red = (q * 255.0 + 0.5);
+green = (brightness * 255.0 + 0.5);
+blue= (p * 255.0 + 0.5);
break;
-case 2:
-red=(p*255+0.5);
-_23=(_22*255+0.5);
-_24=(t*255+0.5);
+ case 2:
+red = (p * 255.0 + 0.5);
+green = (brightness * 255.0 + 0.5);
+blue= (t * 255.0 + 0.5);
break;
-case 3:
-red=(p*255+0.5);
-_23=(q*255+0.5);
-_24=(_22*255+0.5);
+ case 3:
+red = (p * 255.0 + 0.5);
+green = (q * 255.0 + 0.5);
+blue= (brightness * 255.0 + 0.5);
break;
-case 4:
-red=(t*255+0.5);
-_23=(p*255+0.5);
-_24=(_22*255+0.5);
+ case 4:
+red = (t * 255.0 + 0.5);
+green = (p * 255.0 + 0.5);
+blue= (brightness * 255.0 + 0.5);
break;
case 5:
-red=(_22*255+0.5);
-_23=(p*255+0.5);
-_24=(q*255+0.5);
+red = (brightness * 255.0 + 0.5);
+green = (p * 255.0 + 0.5);
+blue= (q * 255.0 + 0.5);
break;
}
}
-return {r:parseInt(red),g:parseInt(_23),b:parseInt(_24)};
-};
-Rico.Color.RGBtoHSB=function(r,g,b){
-var hue;
-var _29;
-var _30;
-var _31=(r>g)?r:g;
-if(b>_31){
-_31=b;
-}
-var _32=(r<g)?r:g;
-if(b<_32){
-_32=b;
-}
-_30=_31/255;
-if(_31!=0){
-saturation=(_31-_32)/_31;
-}else{
-saturation=0;
-}
-if(saturation==0){
-hue=0;
-}else{
-var _33=(_31-r)/(_31-_32);
-var _34=(_31-g)/(_31-_32);
-var _35=(_31-b)/(_31-_32);
-if(r==_31){
-hue=_35-_34;
-}else{
-if(g==_31){
-hue=2+_33-_35;
-}else{
-hue=4+_34-_33;
-}
+return { r : parseInt(red), g : parseInt(green) , b : parseInt(blue) };
}
-hue=hue/6;
-if(hue<0){
-hue=hue+1;
-}
-}
-return {h:hue,s:saturation,b:_30};
-};
-Prado.WebUI.TColorPicker=Class.create();
-Object.extend(Prado.WebUI.TColorPicker,{palettes:{Small:[["fff","fcc","fc9","ff9","ffc","9f9","9ff","cff","ccf","fcf"],["ccc","f66","f96","ff6","ff3","6f9","3ff","6ff","99f","f9f"],["c0c0c0","f00","f90","fc6","ff0","3f3","6cc","3cf","66c","c6c"],["999","c00","f60","fc3","fc0","3c0","0cc","36f","63f","c3c"],["666","900","c60","c93","990","090","399","33f","60c","939"],["333","600","930","963","660","060","366","009","339","636"],["000","300","630","633","330","030","033","006","309","303"]],Tiny:[["ffffff","00ff00","008000","0000ff"],["c0c0c0","ffff00","ff00ff","000080"],["808080","ff0000","800080","000000"]]},UIImages:{"button.gif":"button.gif","background.png":"background.png"}});
-Object.extend(Prado.WebUI.TColorPicker.prototype,{initialize:function(_36){
-var _37={Palette:"Small",ClassName:"TColorPicker",Mode:"Basic",OKButtonText:"OK",CancelButtonText:"Cancel",ShowColorPicker:true};
-this.element=null;
-this.showing=false;
-_36=Object.extend(_37,_36);
-this.options=_36;
-this.input=$(_36["ID"]);
-this.button=$(_36["ID"]+"_button");
-this._buttonOnClick=this.buttonOnClick.bind(this);
-if(_36["ShowColorPicker"]){
-Event.observe(this.button,"click",this._buttonOnClick);
+Rico.Color.RGBtoHSB = function(r, g, b) {
+var hue;
+ var saturaton;
+ var brightness;
+var cmax = (r > g) ? r : g;
+ if (b > cmax)
+cmax = b;
+var cmin = (r < g) ? r : g;
+ if (b < cmin)
+cmin = b;
+brightness = cmax / 255.0;
+ if (cmax != 0)
+saturation = (cmax - cmin)/cmax;
+ else
+saturation = 0;
+if (saturation == 0)
+hue = 0;
+ else {
+var redc = (cmax - r)/(cmax - cmin);
+var greenc = (cmax - g)/(cmax - cmin);
+var bluec= (cmax - b)/(cmax - cmin);
+if (r == cmax)
+ hue = bluec - greenc;
+else if (g == cmax)
+ hue = 2.0 + redc - bluec;
+else
+ hue = 4.0 + greenc - redc;
+hue = hue / 6.0;
+if (hue < 0)
+ hue = hue + 1.0;
+ }
+return { h : hue, s : saturation, b : brightness };
+}
+Prado.WebUI.TColorPicker = Class.create();
+Object.extend(Prado.WebUI.TColorPicker,
+{
+palettes:
+{
+Small : [["fff", "fcc", "fc9", "ff9", "ffc", "9f9", "9ff", "cff", "ccf", "fcf"],
+["ccc", "f66", "f96", "ff6", "ff3", "6f9", "3ff", "6ff", "99f", "f9f"],
+["c0c0c0", "f00", "f90", "fc6", "ff0", "3f3", "6cc", "3cf", "66c", "c6c"],
+["999", "c00", "f60", "fc3", "fc0", "3c0", "0cc", "36f", "63f", "c3c"],
+["666", "900", "c60", "c93", "990", "090", "399", "33f", "60c", "939"],
+["333", "600", "930", "963", "660", "060", "366", "009", "339", "636"],
+["000", "300", "630", "633", "330", "030", "033", "006", "309", "303"]],
+Tiny : [["ffffff" , "00ff00" , "008000" , "0000ff" ],
+["c0c0c0" , "ffff00" , "ff00ff" , "000080" ],
+["808080" , "ff0000" , "800080" , "000000" ]]
+},
+UIImages :
+{
+'button.gif' : 'button.gif',
+'background.png' : 'background.png'
}
-Event.observe(this.input,"change",this.updatePicker.bind(this));
-},updatePicker:function(e){
-var _39=Rico.Color.createFromHex(this.input.value);
-this.button.style.backgroundColor=_39.toString();
-},buttonOnClick:function(_40){
-var _41=this.options["Mode"];
-if(this.element==null){
-var _42=_41=="Basic"?"getBasicPickerContainer":"getFullPickerContainer";
-this.element=this[_42](this.options["ID"],this.options["Palette"]);
+});
+Object.extend(Prado.WebUI.TColorPicker.prototype,
+{
+initialize : function(options)
+{
+var basics =
+{
+Palette : 'Small',
+ClassName : 'TColorPicker',
+Mode : 'Basic',
+OKButtonText : 'OK',
+CancelButtonText : 'Cancel',
+ShowColorPicker : true
+}
+this.element = null;
+this.showing = false;
+options = Object.extend(basics, options);
+this.options = options;
+this.input = $(options['ID']);
+this.button = $(options['ID']+'_button');
+this._buttonOnClick = this.buttonOnClick.bind(this);
+if(options['ShowColorPicker'])
+Event.observe(this.button, "click", this._buttonOnClick);
+Event.observe(this.input, "change", this.updatePicker.bind(this));
+},
+updatePicker : function(e)
+{
+var color = Rico.Color.createFromHex(this.input.value);
+this.button.style.backgroundColor = color.toString();
+},
+buttonOnClick : function(event)
+{
+var mode = this.options['Mode'];
+if(this.element == null)
+{
+var constructor = mode == "Basic" ? "getBasicPickerContainer": "getFullPickerContainer"
+this.element = this[constructor](this.options['ID'], this.options['Palette'])
document.body.appendChild(this.element);
-this.element.style.display="none";
-if(Prado.Browser().ie){
-this.iePopUp=document.createElement("iframe");
-this.iePopUp.src="";
-this.iePopUp.style.position="absolute";
-this.iePopUp.scrolling="no";
-this.iePopUp.frameBorder="0";
+this.element.style.display = "none";
+if(Prado.Browser().ie)
+{
+this.iePopUp = document.createElement('iframe');
+this.iePopUp.src = "";
+this.iePopUp.style.position = "absolute"
+this.iePopUp.scrolling="no"
+this.iePopUp.frameBorder="0"
this.input.parentNode.appendChild(this.iePopUp);
}
-if(_41=="Full"){
+if(mode == "Full")
this.initializeFullPicker();
}
-}
this.show();
-},show:function(_43){
-if(!this.showing){
-var pos=Position.cumulativeOffset(this.input);
-pos[1]+=this.input.offsetHeight;
-this.element.style.top=(pos[1]-1)+"px";
-this.element.style.left=pos[0]+"px";
-this.element.style.display="block";
-this.ieHack(_43);
-this._documentClickEvent=this.hideOnClick.bindEvent(this,_43);
-this._documentKeyDownEvent=this.keyPressed.bindEvent(this,_43);
-Event.observe(document.body,"click",this._documentClickEvent);
-Event.observe(document,"keydown",this._documentKeyDownEvent);
-this.showing=true;
-if(_43=="Full"){
-var _45=Rico.Color.createFromHex(this.input.value);
-this.inputs.oldColor.style.backgroundColor=_45.asHex();
-this.setColor(_45,true);
-}
-}
-},hide:function(_46){
-if(this.showing){
-if(this.iePopUp){
-this.iePopUp.style.display="none";
-}
-this.element.style.display="none";
-this.showing=false;
-Event.stopObserving(document.body,"click",this._documentClickEvent);
-Event.stopObserving(document,"keydown",this._documentKeyDownEvent);
-}
-},keyPressed:function(_47,_48){
-if(Event.keyCode(_47)==Event.KEY_ESC){
-this.hide(_47,_48);
-}
-},hideOnClick:function(ev){
-if(!this.showing){
-return;
-}
-var el=Event.element(ev);
-var _51=false;
-do{
-_51=_51||String(el.className).indexOf("FullColorPicker")>-1;
-_51=_51||el==this.button;
-_51=_51||el==this.input;
-if(_51){
-break;
-}
-el=el.parentNode;
-}while(el);
-if(!_51){
-this.hide(ev);
-}
-},ieHack:function(){
-if(this.iePopUp){
-this.iePopUp.style.display="block";
-this.iePopUp.style.top=(this.element.offsetTop)+"px";
-this.iePopUp.style.left=(this.element.offsetLeft)+"px";
-this.iePopUp.style.width=Math.abs(this.element.offsetWidth)+"px";
-this.iePopUp.style.height=(this.element.offsetHeight+1)+"px";
-}
-},getBasicPickerContainer:function(_52,_53){
-var _54=TABLE({className:"basic_colors palette_"+_53},TBODY());
-var _55=Prado.WebUI.TColorPicker.palettes[_53];
-var _56=this.cellOnClick.bind(this);
-_55.each(function(_57){
-var row=document.createElement("tr");
-_57.each(function(c){
-var td=document.createElement("td");
-var img=IMG({src:Prado.WebUI.TColorPicker.UIImages["button.gif"],width:16,height:16});
-img.style.backgroundColor="#"+c;
-Event.observe(img,"click",_56);
-Event.observe(img,"mouseover",function(e){
-Element.addClassName(Event.element(e),"pickerhover");
+},
+show : function(type)
+{
+if(!this.showing)
+{
+var pos = Position.cumulativeOffset(this.input);
+pos[1] += this.input.offsetHeight;
+this.element.style.top = (pos[1]-1) + "px";
+this.element.style.left = pos[0] + "px";
+this.element.style.display = "block";
+this.ieHack(type);
+this._documentClickEvent = this.hideOnClick.bindEvent(this, type);
+this._documentKeyDownEvent = this.keyPressed.bindEvent(this, type);
+Event.observe(document.body, "click", this._documentClickEvent);
+Event.observe(document,"keydown", this._documentKeyDownEvent);
+this.showing = true;
+if(type == "Full")
+{
+var color = Rico.Color.createFromHex(this.input.value);
+this.inputs.oldColor.style.backgroundColor = color.asHex();
+this.setColor(color,true);
+}
+}
+},
+hide : function(event)
+{
+if(this.showing)
+{
+if(this.iePopUp)
+this.iePopUp.style.display = "none";
+this.element.style.display = "none";
+this.showing = false;
+Event.stopObserving(document.body, "click", this._documentClickEvent);
+Event.stopObserving(document,"keydown", this._documentKeyDownEvent);
+}
+},
+keyPressed : function(event,type)
+{
+if(Event.keyCode(event) == Event.KEY_ESC)
+this.hide(event,type);
+},
+hideOnClick : function(ev)
+{
+if(!this.showing) return;
+var el = Event.element(ev);
+var within = false;
+do
+{within = within || String(el.className).indexOf('FullColorPicker') > -1
+within = within || el == this.button;
+within = within || el == this.input;
+if(within) break;
+el = el.parentNode;
+}
+while(el);
+if(!within) this.hide(ev);
+},
+ieHack : function()
+{
+if(this.iePopUp)
+{
+this.iePopUp.style.display = "block";
+this.iePopUp.style.top = (this.element.offsetTop) + "px";
+this.iePopUp.style.left = (this.element.offsetLeft)+ "px";
+this.iePopUp.style.width = Math.abs(this.element.offsetWidth)+ "px";
+this.iePopUp.style.height = (this.element.offsetHeight + 1)+ "px";
+}
+},
+getBasicPickerContainer : function(pickerID, palette)
+{
+var table = TABLE({className:'basic_colors palette_'+palette},TBODY());
+var colors = Prado.WebUI.TColorPicker.palettes[palette];
+var pickerOnClick = this.cellOnClick.bind(this);
+colors.each(function(color)
+{
+var row = document.createElement("tr");
+color.each(function(c)
+{
+var td = document.createElement("td");
+var img = IMG({src:Prado.WebUI.TColorPicker.UIImages['button.gif'],width:16,height:16});
+img.style.backgroundColor = "#"+c;
+Event.observe(img,"click", pickerOnClick);
+Event.observe(img,"mouseover", function(e)
+{
+Element.addClassName(Event.element(e), "pickerhover");
});
-Event.observe(img,"mouseout",function(e){
-Element.removeClassName(Event.element(e),"pickerhover");
+Event.observe(img,"mouseout", function(e)
+{
+Element.removeClassName(Event.element(e), "pickerhover");
});
td.appendChild(img);
row.appendChild(td);
});
-_54.childNodes[0].appendChild(row);
+table.childNodes[0].appendChild(row);
});
-return DIV({className:this.options["ClassName"]+" BasicColorPicker",id:_52+"_picker"},_54);
-},cellOnClick:function(e){
-var el=Event.element(e);
-if(el.tagName.toLowerCase()!="img"){
+return DIV({className:this.options['ClassName']+" BasicColorPicker",
+id:pickerID+"_picker"}, table);
+},
+cellOnClick : function(e)
+{
+var el = Event.element(e);
+if(el.tagName.toLowerCase() != "img")
return;
-}
-var _62=Rico.Color.createColorFromBackground(el);
-this.updateColor(_62);
-},updateColor:function(_63){
-this.input.value=_63.toString().toUpperCase();
-this.button.style.backgroundColor=_63.toString();
-if(isFunction(this.onChange)){
-this.onChange(_63);
-}
-},getFullPickerContainer:function(_64){
-this.buttons={OK:INPUT({value:this.options.OKButtonText,className:"button",type:"button"}),Cancel:INPUT({value:this.options.CancelButtonText,className:"button",type:"button"})};
-var _65={};
-["H","S","V","R","G","B"].each(function(_66){
-_65[_66]=INPUT({type:"text",size:"3",maxlength:"3"});
+var color = Rico.Color.createColorFromBackground(el);
+this.updateColor(color);
+},
+updateColor : function(color)
+{
+this.input.value = color.toString().toUpperCase();
+this.button.style.backgroundColor = color.toString();
+if(isFunction(this.onChange))
+this.onChange(color);
+},
+getFullPickerContainer : function(pickerID)
+{
+this.buttons =
+{
+OK : INPUT({value:this.options.OKButtonText, className:'button', type:'button'}),
+Cancel : INPUT({value:this.options.CancelButtonText, className:'button', type:'button'})
+};
+var inputs = {};
+['H','S','V','R','G','B'].each(function(type)
+{
+inputs[type] = INPUT({type:'text',size:'3',maxlength:'3'});
});
-_65["HEX"]=INPUT({className:"hex",type:"text",size:"6",maxlength:"6"});
-this.inputs=_65;
-var _67=Prado.WebUI.TColorPicker.UIImages;
-this.inputs["currentColor"]=SPAN({className:"currentColor"});
-this.inputs["oldColor"]=SPAN({className:"oldColor"});
-var _68=TABLE({className:"inputs"},TBODY(null,TR(null,TD({className:"currentcolor",colSpan:2},this.inputs["currentColor"],this.inputs["oldColor"])),TR(null,TD(null,"H:"),TD(null,this.inputs["H"],"\xc2\xb0")),TR(null,TD(null,"S:"),TD(null,this.inputs["S"],"%")),TR(null,TD(null,"V:"),TD(null,this.inputs["V"],"%")),TR(null,TD({className:"gap"},"R:"),TD({className:"gap"},this.inputs["R"])),TR(null,TD(null,"G:"),TD(null,this.inputs["G"])),TR(null,TD(null,"B:"),TD(null,this.inputs["B"])),TR(null,TD({className:"gap"},"#"),TD({className:"gap"},this.inputs["HEX"]))));
-var _69={selector:SPAN({className:"selector"}),background:SPAN({className:"colorpanel"}),slider:SPAN({className:"slider"}),hue:SPAN({className:"strip"})};
-if(Prado.Browser().ie){
-var _70="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader";
-_69["background"]=SPAN({className:"colorpanel",style:_70+"(src='"+_67["background.png"]+"' sizingMethod=scale);"});
-}
-this.inputs=Object.extend(this.inputs,_69);
-var _71=TABLE(null,TBODY(null,TR({className:"selection"},TD({className:"colors"},_69["selector"],_69["background"]),TD({className:"hue"},_69["slider"],_69["hue"]),TD({className:"inputs"},_68)),TR({className:"options"},TD({colSpan:3},this.buttons["OK"],this.buttons["Cancel"]))));
-return DIV({className:this.options["ClassName"]+" FullColorPicker",id:_64+"_picker"},_71);
-},initializeFullPicker:function(){
-var _72=Rico.Color.createFromHex(this.input.value);
-this.inputs.oldColor.style.backgroundColor=_72.asHex();
-this.setColor(_72,true);
-var i=0;
-for(var _74 in this.inputs){
-Event.observe(this.inputs[_74],"change",this.onInputChanged.bindEvent(this,_74));
+inputs['HEX'] = INPUT({className:'hex',type:'text',size:'6',maxlength:'6'});
+this.inputs = inputs;
+var images = Prado.WebUI.TColorPicker.UIImages;
+this.inputs['currentColor'] = SPAN({className:'currentColor'});
+this.inputs['oldColor'] = SPAN({className:'oldColor'});
+var inputsTable =
+TABLE({className:'inputs'}, TBODY(null,
+TR(null,
+TD({className:'currentcolor',colSpan:2},
+this.inputs['currentColor'], this.inputs['oldColor'])),
+TR(null,
+TD(null,'H:'),
+TD(null,this.inputs['H'], '°')),
+TR(null,
+TD(null,'S:'),
+TD(null,this.inputs['S'], '%')),
+TR(null,
+TD(null,'V:'),
+TD(null,this.inputs['V'], '%')),
+TR(null,
+TD({className:'gap'},'R:'),
+TD({className:'gap'},this.inputs['R'])),
+TR(null,
+TD(null,'G:'),
+TD(null, this.inputs['G'])),
+TR(null,
+TD(null,'B:'),
+TD(null, this.inputs['B'])),
+TR(null,
+TD({className:'gap'},'#'),
+TD({className:'gap'},this.inputs['HEX']))
+));
+var UIimages =
+{
+selector : SPAN({className:'selector'}),
+background : SPAN({className:'colorpanel'}),
+slider : SPAN({className:'slider'}),
+hue : SPAN({className:'strip'})
+}
+if(Prado.Browser().ie)
+{
+var filter = "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader";
+UIimages['background'] = SPAN({className:'colorpanel',style:filter+"(src='"+images['background.png']+"' sizingMethod=scale);"})
+}
+this.inputs = Object.extend(this.inputs, UIimages);
+var pickerTable =
+TABLE(null,TBODY(null,
+TR({className:'selection'},
+TD({className:'colors'},UIimages['selector'],UIimages['background']),
+TD({className:'hue'},UIimages['slider'],UIimages['hue']),
+TD({className:'inputs'}, inputsTable)
+),
+TR({className:'options'},
+TD({colSpan:3},
+this.buttons['OK'],
+this.buttons['Cancel'])
+)
+));
+return DIV({className:this.options['ClassName']+" FullColorPicker",
+id:pickerID+"_picker"},pickerTable);
+},
+initializeFullPicker : function()
+{
+var color = Rico.Color.createFromHex(this.input.value);
+this.inputs.oldColor.style.backgroundColor = color.asHex();
+this.setColor(color,true);
+var i = 0;
+for(var type in this.inputs)
+{
+Event.observe(this.inputs[type], "change",
+this.onInputChanged.bindEvent(this,type));
i++;
-if(i>6){
-break;
-}
-}
-this.isMouseDownOnColor=false;
-this.isMouseDownOnHue=false;
-this._onColorMouseDown=this.onColorMouseDown.bind(this);
-this._onHueMouseDown=this.onHueMouseDown.bind(this);
-this._onMouseUp=this.onMouseUp.bind(this);
-this._onMouseMove=this.onMouseMove.bind(this);
-Event.observe(this.inputs.background,"mousedown",this._onColorMouseDown);
-Event.observe(this.inputs.hue,"mousedown",this._onHueMouseDown);
-Event.observe(document.body,"mouseup",this._onMouseUp);
-Event.observe(document.body,"mousemove",this._onMouseMove);
-Event.observe(this.buttons.Cancel,"click",this.hide.bindEvent(this,this.options["Mode"]));
-Event.observe(this.buttons.OK,"click",this.onOKClicked.bind(this));
-},onColorMouseDown:function(ev){
-this.isMouseDownOnColor=true;
+if(i > 6) break;
+}
+this.isMouseDownOnColor = false;
+this.isMouseDownOnHue = false;
+this._onColorMouseDown = this.onColorMouseDown.bind(this);
+this._onHueMouseDown = this.onHueMouseDown.bind(this);
+this._onMouseUp = this.onMouseUp.bind(this);
+this._onMouseMove = this.onMouseMove.bind(this);
+Event.observe(this.inputs.background, "mousedown", this._onColorMouseDown);
+Event.observe(this.inputs.hue, "mousedown", this._onHueMouseDown);
+Event.observe(document.body, "mouseup", this._onMouseUp);
+Event.observe(document.body, "mousemove", this._onMouseMove);
+Event.observe(this.buttons.Cancel, "click", this.hide.bindEvent(this,this.options['Mode']));
+Event.observe(this.buttons.OK, "click", this.onOKClicked.bind(this));
+},
+onColorMouseDown : function(ev)
+{
+this.isMouseDownOnColor = true;
this.onMouseMove(ev);
-},onHueMouseDown:function(ev){
-this.isMouseDownOnHue=true;
+},
+onHueMouseDown : function(ev)
+{
+this.isMouseDownOnHue = true;
this.onMouseMove(ev);
-},onMouseUp:function(ev){
-this.isMouseDownOnColor=false;
-this.isMouseDownOnHue=false;
-},onMouseMove:function(ev){
-if(this.isMouseDownOnColor){
+},
+onMouseUp : function(ev)
+{
+this.isMouseDownOnColor = false;
+this.isMouseDownOnHue = false;
+},
+onMouseMove : function(ev)
+{
+if(this.isMouseDownOnColor)
this.changeSV(ev);
-}
-if(this.isMouseDownOnHue){
+if(this.isMouseDownOnHue)
this.changeH(ev);
-}
-},changeSV:function(ev){
-var px=Event.pointerX(ev);
-var py=Event.pointerY(ev);
-var pos=Position.cumulativeOffset(this.inputs.background);
-var x=this.truncate(px-pos[0],0,255);
-var y=this.truncate(py-pos[1],0,255);
-var h=this.truncate(this.inputs.H.value,0,360)/360;
-var s=x/255;
-var b=(255-y)/255;
-var _79=new Rico.Color();
-_79.rgb=Rico.Color.HSBtoRGB(h,s,b);
-this.inputs.selector.style.left=x+"px";
-this.inputs.selector.style.top=y+"px";
-this.inputs.currentColor.style.backgroundColor=_79.asHex();
-return this.setColor(_79);
-},changeH:function(ev){
-var py=Event.pointerY(ev);
-var pos=Position.cumulativeOffset(this.inputs.background);
-var y=this.truncate(py-pos[1],0,255);
-var h=(255-y)/255;
-var s=parseInt(this.inputs.S.value)/100;
-var b=parseInt(this.inputs.V.value)/100;
-var _80=new Rico.Color();
-_80.rgb=Rico.Color.HSBtoRGB(h,s,b);
-var hue=new Rico.Color(_80.rgb.r,_80.rgb.g,_80.rgb.b);
-hue.setSaturation(1);
-hue.setBrightness(1);
-this.inputs.background.style.backgroundColor=hue.asHex();
-this.inputs.currentColor.style.backgroundColor=_80.asHex();
-this.inputs.slider.style.top=this.truncate(y,0,255)+"px";
-return this.setColor(_80);
-},onOKClicked:function(ev){
-var r=this.truncate(this.inputs.R.value,0,255);
-var g=this.truncate(this.inputs.G.value,0,255);
-var b=this.truncate(this.inputs.B.value,0,255);
-var _81=new Rico.Color(r,g,b);
-this.updateColor(_81);
-this.inputs.oldColor.style.backgroundColor=_81.asHex();
+},
+changeSV : function(ev)
+{
+var px = Event.pointerX(ev);
+var py = Event.pointerY(ev);
+var pos = Position.cumulativeOffset(this.inputs.background);
+var x = this.truncate(px - pos[0],0,255);
+var y = this.truncate(py - pos[1],0,255);
+var h = this.truncate(this.inputs.H.value,0,360)/360;
+var s = x/255;
+var b = (255-y)/255;
+var color = new Rico.Color();
+color.rgb = Rico.Color.HSBtoRGB(h,s,b);
+this.inputs.selector.style.left = x+"px";
+this.inputs.selector.style.top = y+"px";
+this.inputs.currentColor.style.backgroundColor = color.asHex();
+return this.setColor(color);
+},
+changeH : function(ev)
+{
+var py = Event.pointerY(ev);
+var pos = Position.cumulativeOffset(this.inputs.background);
+var y = this.truncate(py - pos[1],0,255);
+var h = (255-y)/255;
+var s = parseInt(this.inputs.S.value)/100;
+var b = parseInt(this.inputs.V.value)/100;
+var color = new Rico.Color();
+color.rgb = Rico.Color.HSBtoRGB(h,s,b);
+var hue = new Rico.Color(color.rgb.r,color.rgb.g,color.rgb.b);
+hue.setSaturation(1); hue.setBrightness(1);
+this.inputs.background.style.backgroundColor = hue.asHex();
+this.inputs.currentColor.style.backgroundColor = color.asHex();
+this.inputs.slider.style.top = this.truncate(y,0,255)+"px";
+return this.setColor(color);
+},
+onOKClicked : function(ev)
+{
+var r = this.truncate(this.inputs.R.value,0,255);
+var g = this.truncate(this.inputs.G.value,0,255);
+var b = this.truncate(this.inputs.B.value,0,255);
+var color = new Rico.Color(r,g,b);
+this.updateColor(color);
+this.inputs.oldColor.style.backgroundColor = color.asHex();
this.hide(ev);
-},onInputChanged:function(ev,_82){
-if(this.isMouseDownOnColor||isMouseDownOnHue){
+},
+onInputChanged : function(ev, type)
+{
+if(this.isMouseDownOnColor || isMouseDownOnHue)
return;
-}
-switch(_82){
-case "H":
-case "S":
-case "V":
-var h=this.truncate(this.inputs.H.value,0,360)/360;
-var s=this.truncate(this.inputs.S.value,0,100)/100;
-var b=this.truncate(this.inputs.V.value,0,100)/100;
-var _83=new Rico.Color();
-_83.rgb=Rico.Color.HSBtoRGB(h,s,b);
-return this.setColor(_83,true);
-case "R":
-case "G":
-case "B":
-var r=this.truncate(this.inputs.R.value,0,255);
-var g=this.truncate(this.inputs.G.value,0,255);
-var b=this.truncate(this.inputs.B.value,0,255);
-var _83=new Rico.Color(r,g,b);
-return this.setColor(_83,true);
+switch(type)
+{
+case "H": case "S": case "V":
+var h = this.truncate(this.inputs.H.value,0,360)/360;
+var s = this.truncate(this.inputs.S.value,0,100)/100;
+var b = this.truncate(this.inputs.V.value,0,100)/100;
+var color = new Rico.Color();
+color.rgb = Rico.Color.HSBtoRGB(h,s,b);
+return this.setColor(color,true);
+case "R": case "G": case "B":
+var r = this.truncate(this.inputs.R.value,0,255);
+var g = this.truncate(this.inputs.G.value,0,255);
+var b = this.truncate(this.inputs.B.value,0,255);
+var color = new Rico.Color(r,g,b);
+return this.setColor(color,true);
case "HEX":
-var _83=Rico.Color.createFromHex(this.inputs.HEX.value);
-return this.setColor(_83,true);
+var color = Rico.Color.createFromHex(this.inputs.HEX.value);
+return this.setColor(color,true);
+}
+},
+setColor : function(color, update)
+{
+var hsb = color.asHSB();
+this.inputs.H.value = parseInt(hsb.h*360);
+this.inputs.S.value = parseInt(hsb.s*100);
+this.inputs.V.value = parseInt(hsb.b*100);
+this.inputs.R.value = color.rgb.r;
+this.inputs.G.value = color.rgb.g;
+this.inputs.B.value = color.rgb.b;
+this.inputs.HEX.value = color.asHex().substring(1).toUpperCase();
+var images = Prado.WebUI.TColorPicker.UIImages;
+var changeCss = color.isBright() ? 'removeClassName' : 'addClassName';
+Element[changeCss](this.inputs.selector, 'target_white');
+if(update)
+this.updateSelectors(color);
+},
+updateSelectors : function(color)
+{
+var hsb = color.asHSB();
+var pos = [hsb.s*255, hsb.b*255, hsb.h*255];
+this.inputs.selector.style.left = this.truncate(pos[0],0,255)+"px";
+this.inputs.selector.style.top = this.truncate(255-pos[1],0,255)+"px";
+this.inputs.slider.style.top = this.truncate(255-pos[2],0,255)+"px";
+var hue = new Rico.Color(color.rgb.r,color.rgb.g,color.rgb.b);
+hue.setSaturation(1); hue.setBrightness(1);
+this.inputs.background.style.backgroundColor = hue.asHex();
+this.inputs.currentColor.style.backgroundColor = color.asHex();
+},
+truncate : function(value, min, max)
+{
+value = parseInt(value);
+return value < min ? min : value > max ? max : value;
}
-},setColor:function(_84,_85){
-var hsb=_84.asHSB();
-this.inputs.H.value=parseInt(hsb.h*360);
-this.inputs.S.value=parseInt(hsb.s*100);
-this.inputs.V.value=parseInt(hsb.b*100);
-this.inputs.R.value=_84.rgb.r;
-this.inputs.G.value=_84.rgb.g;
-this.inputs.B.value=_84.rgb.b;
-this.inputs.HEX.value=_84.asHex().substring(1).toUpperCase();
-var _86=Prado.WebUI.TColorPicker.UIImages;
-var _87=_84.isBright()?"removeClassName":"addClassName";
-Element[_87](this.inputs.selector,"target_white");
-if(_85){
-this.updateSelectors(_84);
-}
-},updateSelectors:function(_88){
-var hsb=_88.asHSB();
-var pos=[hsb.s*255,hsb.b*255,hsb.h*255];
-this.inputs.selector.style.left=this.truncate(pos[0],0,255)+"px";
-this.inputs.selector.style.top=this.truncate(255-pos[1],0,255)+"px";
-this.inputs.slider.style.top=this.truncate(255-pos[2],0,255)+"px";
-var hue=new Rico.Color(_88.rgb.r,_88.rgb.g,_88.rgb.b);
-hue.setSaturation(1);
-hue.setBrightness(1);
-this.inputs.background.style.backgroundColor=hue.asHex();
-this.inputs.currentColor.style.backgroundColor=_88.asHex();
-},truncate:function(_89,min,max){
-_89=parseInt(_89);
-return _89<min?min:_89>max?max:_89;
-}});
-
+});