summaryrefslogtreecommitdiff
path: root/framework/Web/Javascripts/js/colorpicker.js
diff options
context:
space:
mode:
authorxue <>2006-04-30 12:51:23 +0000
committerxue <>2006-04-30 12:51:23 +0000
commitddfafaac2c1f18aca0fda3b4157acd935b9ac9a2 (patch)
treed131537413fa80aadf44feb8607eca6584e539f7 /framework/Web/Javascripts/js/colorpicker.js
parent10b65d6d03ee0afc1ec1a50f320af42a79f5492b (diff)
merge from 3.0 branch till 995.
Diffstat (limited to 'framework/Web/Javascripts/js/colorpicker.js')
-rw-r--r--framework/Web/Javascripts/js/colorpicker.js706
1 files changed, 89 insertions, 617 deletions
diff --git a/framework/Web/Javascripts/js/colorpicker.js b/framework/Web/Javascripts/js/colorpicker.js
index b926dc93..5bfab96d 100644
--- a/framework/Web/Javascripts/js/colorpicker.js
+++ b/framework/Web/Javascripts/js/colorpicker.js
@@ -1,621 +1,93 @@
-
-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(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 ( 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, 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 + 0.5);
-green = (brightness * 255.0 + 0.5);
-blue= (p * 255.0 + 0.5);
-break;
- 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 + 0.5);
-green = (q * 255.0 + 0.5);
-blue= (brightness * 255.0 + 0.5);
-break;
- case 4:
-red = (t * 255.0 + 0.5);
-green = (p * 255.0 + 0.5);
-blue= (brightness * 255.0 + 0.5);
-break;
-case 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(green) , b : parseInt(blue) };
-}
-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;
+
+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(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(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
- 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'
-}
-});
-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"
+return new Rico.Color(255,255,255);}
+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+0.5);green=(brightness*255.0+0.5);blue=(p*255.0+0.5);break;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+0.5);green=(q*255.0+0.5);blue=(brightness*255.0+0.5);break;case 4:red=(t*255.0+0.5);green=(p*255.0+0.5);blue=(brightness*255.0+0.5);break;case 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(green),b:parseInt(blue)};}
+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'}});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.input.parentNode.appendChild(this.iePopUp);
-}
-if(mode == "Full")
-this.initializeFullPicker();
-}
-this.show(mode);
-},
-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")
-{
-this.observeMouseMovement();
-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);
-if(this._observingMouseMove)
-{
-Event.stopObserving(document.body, "mousemove", this._onMouseMove);
-this._observingMouseMove = false;
-}
-}
-},
-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");
-});
-td.appendChild(img);
-row.appendChild(td);
-});
-table.childNodes[0].appendChild(row);
-});
-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 color = Rico.Color.createColorFromBackground(el);
-this.updateColor(color);
-},
-updateColor : function(color)
-{
-this.input.value = color.toString().toUpperCase();
-this.button.style.backgroundColor = color.toString();
-if(typeof(this.onChange) == "function")
-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'});
-});
-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'})
-}
+this.input.parentNode.appendChild(this.iePopUp);}
+if(mode=="Full")
+this.initializeFullPicker();}
+this.show(mode);},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")
+{this.observeMouseMovement();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);if(this._observingMouseMove)
+{Event.stopObserving(document.body,"mousemove",this._onMouseMove);this._observingMouseMove=false;}}},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");});td.appendChild(img);row.appendChild(td);});table.childNodes[0].appendChild(row);});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 color=Rico.Color.createColorFromBackground(el);this.updateColor(color);},updateColor:function(color)
+{this.input.value=color.toString().toUpperCase();this.button.style.backgroundColor=color.toString();if(typeof(this.onChange)=="function")
+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'});});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.selector, "mousedown", this._onColorMouseDown);
-Event.observe(this.inputs.hue, "mousedown", this._onHueMouseDown);
-Event.observe(this.inputs.slider, "mousedown", this._onHueMouseDown);
-Event.observe(document.body, "mouseup", this._onMouseUp);
-this.observeMouseMovement();
-Event.observe(this.buttons.Cancel, "click", this.hide.bindEvent(this,this.options['Mode']));
-Event.observe(this.buttons.OK, "click", this.onOKClicked.bind(this));
-},
-observeMouseMovement : function()
-{
-if(!this._observingMouseMove)
-{
-Event.observe(document.body, "mousemove", this._onMouseMove);
-this._observingMouseMove = true;
-}
-},
-onColorMouseDown : function(ev)
-{
-this.isMouseDownOnColor = true;
-this.onMouseMove(ev);
-Event.stop(ev);
-},
-onHueMouseDown : function(ev)
-{
-this.isMouseDownOnHue = true;
-this.onMouseMove(ev);
-Event.stop(ev);
-},
-onMouseUp : function(ev)
-{
-this.isMouseDownOnColor = false;
-this.isMouseDownOnHue = false;
-Event.stop(ev);
-},
-onMouseMove : function(ev)
-{
-if(this.isMouseDownOnColor)
-this.changeSV(ev);
-if(this.isMouseDownOnHue)
-this.changeH(ev);
-Event.stop(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 s = x/255;
-var b = (255-y)/255;
-var current_s = parseInt(this.inputs.S.value);
-var current_b = parseInt(this.inputs.V.value);
-if(current_s == parseInt(s*100) && current_b == parseInt(b*100)) return;
-var h = this.truncate(this.inputs.H.value,0,360)/360;
-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 current_h = this.truncate(this.inputs.H.value,0,360);
-current_h = current_h == 0 ? 360 : current_h;
-if(current_h == parseInt(h*360)) return;
-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, type)
-{
-if(this.isMouseDownOnColor || isMouseDownOnHue)
-return;
-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 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;
-}
-});
+{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.selector,"mousedown",this._onColorMouseDown);Event.observe(this.inputs.hue,"mousedown",this._onHueMouseDown);Event.observe(this.inputs.slider,"mousedown",this._onHueMouseDown);Event.observe(document.body,"mouseup",this._onMouseUp);this.observeMouseMovement();Event.observe(this.buttons.Cancel,"click",this.hide.bindEvent(this,this.options['Mode']));Event.observe(this.buttons.OK,"click",this.onOKClicked.bind(this));},observeMouseMovement:function()
+{if(!this._observingMouseMove)
+{Event.observe(document.body,"mousemove",this._onMouseMove);this._observingMouseMove=true;}},onColorMouseDown:function(ev)
+{this.isMouseDownOnColor=true;this.onMouseMove(ev);Event.stop(ev);},onHueMouseDown:function(ev)
+{this.isMouseDownOnHue=true;this.onMouseMove(ev);Event.stop(ev);},onMouseUp:function(ev)
+{this.isMouseDownOnColor=false;this.isMouseDownOnHue=false;Event.stop(ev);},onMouseMove:function(ev)
+{if(this.isMouseDownOnColor)
+this.changeSV(ev);if(this.isMouseDownOnHue)
+this.changeH(ev);Event.stop(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 s=x/255;var b=(255-y)/255;var current_s=parseInt(this.inputs.S.value);var current_b=parseInt(this.inputs.V.value);if(current_s==parseInt(s*100)&&current_b==parseInt(b*100))return;var h=this.truncate(this.inputs.H.value,0,360)/360;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 current_h=this.truncate(this.inputs.H.value,0,360);current_h=current_h==0?360:current_h;if(current_h==parseInt(h*360))return;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,type)
+{if(this.isMouseDownOnColor||isMouseDownOnHue)
+return;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 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;}}); \ No newline at end of file