/**********************************************
 *   Name: Javascript libraries for Tudou User Interface
 *   Author: Dexter.Yy
 *   Version: beta1
 **********************************************/ 
 
var TUI={};


/***********************************************/

TUI.pos={
	scrollTop : function()
	{
		if (self.pageYOffset) 
		    var t = self.pageYOffset;
		else if (document.documentElement && document.documentElement.scrollTop)  // Explorer 6 Strict
			var t = document.documentElement.scrollTop;
		else if (document.body) // all other Explorers
		    var t = document.body.scrollTop;
		return t;
	},
	scrollLeft : function()
	{
		if (self.pageXOffset) 
		    var t = self.pageXOffset;
		else if (document.documentElement && document.documentElement.scrollLeft)  // Explorer 6 Strict
			var t = document.documentElement.scrollLeft;
		else if (document.body) // all other Explorers
		    var t = document.body.scrollLeft;
		return t;
	},
	windowHeight : function()
	{
		if (self.innerHeight) 
			var t = self.innerHeight;
		else if (document.documentElement && document.documentElement.clientHeight)
			var t = document.documentElement.clientHeight;   
		else if (document.body) 
			var t = document.body.clientHeight;
		return t;
	},
	elementLeft : function(element)
	{
		var x = 0;                
	    while(element) 
		{               
	        x += element.offsetLeft;    
	        element = element.offsetParent; 
	    }
	    return x;
	},
	elementTop : function(element)
	{
		var y = 0;
	    for(var e = element; e; e = e.offsetParent) 
	        y += e.offsetTop;                     

	    for(e = element.parentNode; e && e != document.body; e = e.parentNode)
	        if (e.scrollTop) y -= e.scrollTop;
	    return y;
	}
}

/**********************************************
 *   tabs toggle
 **********************************************/

TUI.tabToggle=function(str,cb)
{
	TUI.tabToggle[str]=new TUI.tabToggle.constructor();
	var o=TUI.tabToggle[str];
	var l=document.getElementById(str).getElementsByTagName('LI');
	for(var i=0;i<l.length;i++)
	{
		if(l[i].getElementsByTagName('A').length==0)continue;
		if(l[i].className=="current")
			o.last=l[i].getElementsByTagName('A')[0];

		l[i].getElementsByTagName('A')[0].onclick=function(){
			o.choose(this,cb);this.blur();return false;
		}
	}
}
TUI.tabToggle.constructor=function(){}
TUI.tabToggle.constructor.prototype.choose = function(t,cb)
{
	if(this.last==t)
		return false;
	document.getElementById(this.last.getAttribute('rel')).style.display="none";
	this.last.parentNode.className="";
	t.parentNode.className="current";
	document.getElementById(t.getAttribute('rel')).style.display="";
	if(cb)cb(t,this.last);
	this.last=t;
}


/**********************************************
 *   drag it!
 **********************************************/
TUI.drag={
	
	handle : null,
	init : function(h)
	{
		
		if(!h.handle.nodeType)
		{
			for(var i=0;i<h.handle.length;i++)
			{
				h.handle[i].onmousedown=function(event){
					TUI.drag.set(event,h);
				}
			}
			
		}
		else
		{
			h.handle.onmousedown=function(event){
				TUI.drag.set(event,h);
			}
		}
		
	},
	
	set: function(e,h){
		var e=TUI.EventUtil.getEvent();
		TUI.drag.handle=h.handle;
		TUI.drag.opacity = (h.opacity) ? h.opacity : null;
		TUI.drag.fake = (h.fake) ? h.fake : false;
		TUI.drag.mousefixed = (h.mousefixed) ? h.mousefixed : true;
		TUI.drag.beforeDrag = (h.beforeDrag) ? h.beforeDrag : null;
		TUI.drag.callback = (h.callback) ? h.callback : null;
		TUI.drag.listener = (h.listener) ? h.listener : null;
		
		if(TUI.drag.fake)
		{
			TUI.drag.obox = h.box;
			TUI.drag.obox.style.visibility="hidden";
			TUI.drag.box=document.createElement(TUI.drag.obox.nodeName);
			if(TUI.drag.obox.className)TUI.drag.box.className=TUI.drag.obox.className;
			TUI.drag.box.innerHTML=TUI.drag.obox.innerHTML;
			TUI.drag.box.style.float='none';
			TUI.drag.box.style.position='absolute';
			TUI.drag.box.style.left=TUI.pos.elementLeft(TUI.drag.obox)+"px";
			TUI.drag.box.style.top=TUI.pos.elementTop(TUI.drag.obox)+"px";
			TUI.drag.obox.parentNode.appendChild(TUI.drag.box);
		}
		else
		{
			TUI.drag.box = h.box;
			TUI.drag.obox = null;
		}
		
		if(TUI.drag.opacity!=null)
		{
			TUI.drag.box.style.opacity=TUI.drag.opacity;
			TUI.drag.box.style.filter='alpha(opacity='+TUI.drag.opacity*100+')';
		}
		
		if(TUI.drag.beforeDrag!=null)
		{
			if(TUI.drag.fake)
				TUI.drag.beforeDrag(e,TUI.drag.box,TUI.drag.obox);
			else
				TUI.drag.beforeDrag(e,TUI.drag.box);
		}
			
		document.body.onmousemove = TUI.drag.startDrag;
		document.body.onmouseup=TUI.drag.stopDrag;
	},
	
	startDrag : function()
	{
		var e=TUI.EventUtil.getEvent();
		
		document.body.style.cursor="move";
		TUI.drag.box.style.zIndex="9999";
		
		if(TUI.drag.mousefixed)
		{
			var l=TUI.pos.elementLeft(TUI.drag.box);
			var t=TUI.pos.elementTop(TUI.drag.box);
			TUI.drag.posX=(e.pageX>l)?(e.pageX-l):0;
			TUI.drag.posY=(e.pageY>t)?(e.pageY-t):0;
		}
		else
		{
			TUI.drag.posX=0;
			TUI.drag.posY=0;
		}
		
		document.body.onmousemove = TUI.drag.goDrag;
	},
	
	goDrag : function()
	{
		var e=TUI.EventUtil.getEvent();
		TUI.drag.box.style.left=e.pageX-TUI.drag.posX+"px";
		TUI.drag.box.style.top=e.pageY-TUI.drag.posY+"px";
		
		if(TUI.drag.listener!=null)
		{
			if(TUI.drag.fake)
				TUI.drag.listener(e,TUI.drag.box,TUI.drag.obox);
			else
				TUI.drag.listener(e,TUI.drag.box);
		}
		
		return false;
	},
	
	stopDrag : function()
	{
		document.body.style.cursor="auto";
		document.body.onmousemove=null;
		document.body.onmouseup=null;
		if(TUI.drag.box==null)return false;
		
		if(TUI.drag.obox!=null)
		{
			TUI.drag.obox.parentNode.removeChild(TUI.drag.box);
			TUI.drag.obox.style.visibility="";
		}
		else if(TUI.drag.opacity!=null)
		{
			TUI.drag.box.style.opacity="";
			TUI.drag.box.style.filter='';
		}
		else
		{
			TUI.drag.box.style.zIndex="";
		}
		
		if(TUI.drag.callback!=null)
		{
			if(TUI.drag.fake)
				TUI.drag.callback(TUI.drag.obox);
			else
				TUI.drag.callback();
		}
		
		if(!TUI.drag.handle.nodeType)
		{
			for(var i=0;i<TUI.drag.handle.length;i++)
			{
				TUI.drag.handle[i].blur();
			}
			
		}
		else
		{
			TUI.drag.handle.blur();
		}
		return false;
	}

};

/**********************************************
 *        Event Adapter for MSIE
 **********************************************/
TUI.EventUtil={

	addEventHandler:function(oTarget,sEventType,handler)  //sEventType is name,not function
	{
		if(oTarget.addEventListener) //for DOM
		{
			oTarget.addEventListener(sEventType,handler,false);
		}
		else if(oTarget.attachEvent)  //for IE
		{
			oTarget.attachEvent("on"+sEventType,handler);
		}
		else
		{
			oTarget["on"+sEventType]=handler;
		}
	},
	
	removeEventHandler:function(oTarget,sEventType,handler)
	{
		if(oTarget.removeEventListener) //for DOM
		{
			oTarget.removeEventListener(sEventType,handler,false);
		}
		else if(oTarget.detachEvent)  //for IE
		{
			oTarget.detachEvent("on"+sEventType,handler);
		}
		else
		{
			oTarget["on"+sEventType]=null;
		}
	},
	
	formatEvent:function(oEvent)
	{
		if(window.ActiveXObject)
		{
			oEvent.charCode=(oEvent.type=="keypress") ? oEvent.keyCode : 0;
			oEvent.isChar=(oEvent.charCode>0);
			
			oEvent.eventPhase=2;
			
			oEvent.pageX=oEvent.clientX+TUI.pos.scrollLeft();
			oEvent.pageY=oEvent.clientY+TUI.pos.scrollTop();
			
			oEvent.preventDefault=function()
			{
				this.returnValue=false;
			};
			
			if(oEvent.type=="mouseout")
			{
				oEvent.relatedTarget=oEvent.toElement;
			}
			else if(oEvent.type=="mouseover")
			{
				oEvent.relatedTarget=oEvent.fromElement;
			}
			
			oEvent.stopPropagation=function()
			{
				this.cancelBubble=true;
			}
			
			oEvent.target=oEvent.srcElement;
			
			oEvent.time=(new Date).getTime();
		}
		return oEvent;
	},
	
	getEvent:function()
	{
		if(window.event)
		{
			return this.formatEvent(window.event);
		}
		else
		{
			return TUI.EventUtil.getEvent.caller.arguments[0];
		}
	}
}
/**********************************************
 *        xml doc & dom
 **********************************************/ 
TUI.xml={
	load : function(url, callback) 
	{
	    var xmldoc = TUI.xml.newDoc();

	    if (document.implementation && document.implementation.createDocument) 
		{
	        xmldoc.onload = function() { callback(xmldoc); };
	    }
	    else
		{
	        xmldoc.onreadystatechange = function() {
	            if (xmldoc.readyState == 4) callback(xmldoc);
	        };
	    }
	    xmldoc.load(url);
	},
	newDoc : function(rootTagName, namespaceURL) 
	{
	    if (!rootTagName) rootTagName = "";
	    if (!namespaceURL) namespaceURL = "";
	
	    if (document.implementation && document.implementation.createDocument) 
		{  
	        return document.implementation.createDocument(namespaceURL,rootTagName, null); //W3C 
	    }
	    else 
		{
	        var doc = new ActiveXObject("MSXML2.DOMDocument");  //MSIE
	
	        if (rootTagName) {
	            var prefix = "";
	            var tagname = rootTagName;
	            var p = rootTagName.indexOf(':');
	            if (p != -1) {
	                prefix = rootTagName.substring(0, p);
	                tagname = rootTagName.substring(p+1);
	            }
	            if (namespaceURL) {
	                if (!prefix) prefix = "a0"; //Firefox
	            }
	            else prefix = "";

	            var text = "<" + (prefix?(prefix+":"):"") +  tagname + (namespaceURL ? (" xmlns:" + prefix + '="' + namespaceURL +'"') : "") + "/>";
	            doc.loadXML(text);
	        }
	        return doc;
	    }
	},
	parse : function(text) 
	{
	    if (typeof DOMParser != "undefined") //Firefox, and related browsers
		{      
	        return (new DOMParser()).parseFromString(text, "application/xml");
	    }
	    else if (typeof ActiveXObject != "undefined") // MSIE
		{
	        var doc = TUI.xml.newDoc(); 
	        doc.loadXML(text);            
	        return doc; 
	    }
	    else 
		{
	        var url = "data:text/xml;charset=utf-8," + encodeURIComponent(text);
	        var request = new XMLHttpRequest();
	        request.open("GET", url, false);
	        request.send(null);
	        return request.responseXML;
	    }
	},
	todo : function(xml,tag,option,action,help,callback)
	{
		if(typeof xml != 'object' )
			var xmldom=TUI.xml.parse(xml);
		else
			var xmldom=xml;
			
		var r=xmldom.documentElement;
		
		if(action=="add")
		{
			var newtag=xmldom.createElement(tag);
			for(var name in option)
			{
				if(name=="tuiValue")
				{
					if(newtag.firstChild)
					{
						newtag.firstChild.nodeValue=option.tuiValue;
					}
					else
					{
						var v=xmldom.createTextNode(option.tuiValue);
						newtag.appendChild(v);
					}
				}
				else
				{
					newtag.setAttribute(name,option[name]);
				}
					
			}
			
			var parent=TUI.xml.findTag(xmldom,help);
			parent.appendChild(newtag);
		}
		else if(action=="delete")
		{
			var g=TUI.xml.findTag(xmldom,help);
			if(option!=null)
			{
				var deletetItems=TUI.xml.findTag(xmldom,option);
				g.removeChild(deletetItems);
			}
			else
			{
				if(tag==null)
				{
					for(var j=0;j<g.childNodes.length;)
						g.removeChild(g.childNodes[j]);
				}
				else
				{
					for(var j=0;j<g.getElementsByTagName(tag).length;)
						g.removeChild(g.getElementsByTagName(tag)[j]);
				}
			}	
		}
		else if(action=="attr")
		{
			if(option!=null)
			{
				var newtag=TUI.xml.findTag(xmldom,option);
			}
			else
			{
				var newtag=xmldom.getElementsByTagName(tag)[0];
			}
			for(var name in help)
			{
				if(newtag.nodeType)
				{
					if(name=="tuiValue")
					{
						if(newtag.firstChild)
						{
							newtag.firstChild.nodeValue=help.tuiValue;
						}
						else
						{
							var v=xmldom.createTextNode(help.tuiValue);
							newtag.appendChild(v);
						}
						
					}
					else
					{
						if(help[name]==null)
							newtag.removeAttribute(name);
						else
							newtag.setAttribute(name,help[name]);
					}
				}
				else
				{
					for(var k=0;k<newtag.length;k++)
					{
						if(name=="tuiValue")
						{
							if(newtag[k].firstChild)
							{
								newtag[k].firstChild.nodeValue=help.tuiValue;
							}
							else
							{
								var v=xmldom.createTextNode(help.tuiValue);
								newtag[k].appendChild(v);
							}
							
						}
						else
						{
							newtag[k].setAttribute(name,help[name]);
						}
					}
				}
			
			}
		}
		
		if(window.ActiveXObject)
		{
			callback(xmldom.xml,xmldom);
		}
		else
		{
			if(!document.getElementById("tuiXmlIsland"))
			{
				var island=document.createElement('DIV');
				island.id='tuiXmlIsland';
				document.body.appendChild(island);
			}
			else
			{
				var island=document.getElementById("tuiXmlIsland");
			}
			island.innerHTML="";
			island.appendChild(xmldom.documentElement);
			callback(island.innerHTML,xmldom);
		}
	},
	findTag : function(xml,o)
	{
		var parent=xml.getElementsByTagName(o.iTag);
			
			var p=[];
			for(var name in o)
			{
				if(name=="iTag" || name=="iNum")continue;
				if(parent.length==0)break;
					
				for(var i=0;i<parent.length;i++)
				{
					if(name=="tuiValue")
					{
						if(parent[i].firstChild.nodeValue==o[name])
							p.push(parent[i]);
					}
					else
					{
						if(parent[i].getAttribute(name)==o[name])
							p.push(parent[i]);
					}
				}
				parent=p;
				p=[];
			}
		
		if(o.iNum)
		{
			parent=parent[o.iNum];
		}
		else
		{
			if(parent.length==1)
				parent=parent[0];
		}
		return parent;
	}
}
/**********************************************
 *         get value from URL
 **********************************************/
TUI.getURLvalue=function(key) 
{
        var href = window.location.search;
        var lhref = href.toLowerCase();

        var pos = lhref.indexOf( key + "=" );
        if (pos==-1) return null;

        var next = lhref.indexOf( "&", pos );
        var value = href.substring( pos + key.length + 1, (next==-1) ? 999 : next );

        return value;
} 

/**********************************************
 *         tools for form
 **********************************************/
TUI.setSelectValue=function(src,value)
{
	var s=src;
	var o=s.getElementsByTagName('OPTION');
	for(var i=0;i<o.length;o++)
	{
		if(o[i].value==value)
			o[i].setAttribute('selected','selected');
		else
			o[i].removeAttribute('selected');
	}
	s.value=value;
}

TUI.noAboveFloater=function(action,p)
{
	if(!p)
		var p=document.body;
	var s=p.getElementsByTagName('SELECT');	
		
	if(action=="show")
	{
		for(var i=0;i<s.length;i++)
		{
			s[i].style.visibility="";
		}
	}
	else if(action=="hidden")
	{
		for(var i=0;i<s.length;i++)
		{
			s[i].style.visibility="hidden";
		}
	}
}

TUI.maskAllPage=function(o,bg)
{
	if(o<0)
	{
		document.body.removeChild(document.getElementById('TUI_masklayer'));
		TUI.noAboveFloater('show');
		return false;
	}
	else
	{
		if(!bg)var bg="#000000";
		if(!document.getElementById('TUI_masklayer'))
		{
			var m=document.createElement('DIV');
			m.id='TUI_masklayer';
			m.style.width=document.body.offsetWidth+"px";
			m.style.height=document.body.offsetHeight+"px";
			m.style.position="absolute";
			m.style.top="0px";m.style.left="0px";
			document.body.appendChild(m);
		}
		else
		{
			var m=document.getElementById('TUI_masklayer');
		}
		TUI.noAboveFloater('hidden');
		m.style.opacity=o;
		m.style.filter='alpha(opacity='+o*100+')';
		m.style.background=bg;
		return m;
	}
}

TUI.copyToClip=function(url)
{
	if (window.clipboardData)
		window.clipboardData.setData('text',url);
	else
		alert('抱歉，在firefox里不能自动复制到剪贴板～');
}
TUI.addBookmark=function(n,u)
{
	if(window.ActiveXObject)
		window.external.AddFavorite(u, n);
	else if (window.sidebar) 
		window.sidebar.addPanel(n,u,"");
	return false;
}
/**********************************************
 *         color picker
 **********************************************/
TUI.detail=50;
TUI.strhex = "0123456789abcdef";

TUI.pickColor=function(e,p) 
{
	var x, y, partWidth, partDetail, imHeight, r, g, b, coef, i, finalCoef, finalR, finalG, finalB;
	
	if(e)
		var xfix=2;
	else
		var xfix=5;
	var e=TUI.EventUtil.getEvent();
	
	x = e.pageX-p.offsetLeft-p.parentNode.parentNode.offsetLeft-xfix;
	y = e.pageY-p.offsetTop-p.parentNode.parentNode.offsetTop-2;

	partWidth = p.width / 6;
	partDetail = TUI.detail / 2;
	imHeight = p.height;

	r = (x >= 0)*(x < partWidth)*255 + (x >= partWidth)*(x < 2*partWidth)*(2*255 - x * 255 / partWidth) + (x >= 4*partWidth)*(x < 5*partWidth)*(-4*255 + x * 255 / partWidth) + (x >= 5*partWidth)*(x < 6*partWidth)*255;
	g = (x >= 0)*(x < partWidth)*(x * 255 / partWidth) + (x >= partWidth)*(x < 3*partWidth)*255	+ (x >= 3*partWidth)*(x < 4*partWidth)*(4*255 - x * 255 / partWidth);
	b = (x >= 2*partWidth)*(x < 3*partWidth)*(-2*255 + x * 255 / partWidth) + (x >= 3*partWidth)*(x < 5*partWidth)*255 + (x >= 5*partWidth)*(x < 6*partWidth)*(6*255 - x * 255 / partWidth);

	coef = (imHeight - y) / imHeight;
	r = 128 + (r - 128) * coef;
	g = 128 + (g - 128) * coef;
	b = 128 + (b - 128) * coef;
	
	if(arguments.length==3) 
	{
		TUI.changeFinalColor('#' + TUI.dechex(r) + TUI.dechex(g) + TUI.dechex(b), p, 1);
		TUI.updateLight(r, g, b, p);
	}
	else
	{
		TUI.changeFinalColor('#' + TUI.dechex(r) + TUI.dechex(g) + TUI.dechex(b), p);
		if(!window.ActiveXObject)TUI.updateLight(r, g, b, p);
	}
	
}
TUI.changeFinalColor=function(color,p) 
{
	if (color.indexOf('#') == -1)
		color = TUI.convertRGBToHex(color);
	if(p.nodeName=="DIV")
		var tinput=document.getElementsByName("params["+p.parentNode.id.split('-')[1]+"]")[0];
	else
		var tinput=document.getElementsByName("params["+p.id.split('-')[1]+"]")[0];
	
	if(arguments.length==3)
	{
		showCustomizeEffect(tinput);
		controlCustomizeJSON[tinput.getAttribute('name').match(/(\w+)\[(\w+)\]/)[2]]=color;
	}
		
	tinput.parentNode.getElementsByTagName('INPUT')[1].style.backgroundColor = color;
	tinput.value = color;
}
TUI.dechex=function(n) 
{
	return TUI.strhex.charAt(Math.floor(n / 16)) + TUI.strhex.charAt(n % 16);
}
TUI.convertRGBToHex=function(col) 
{
	var re = new RegExp("rgb\\s*\\(\\s*([0-9]+).*,\\s*([0-9]+).*,\\s*([0-9]+).*\\)", "gi");

	if (!col)
		return col;

	var rgb = col.replace(re, "$1,$2,$3").split(',');
	if (rgb.length == 3) {
		r = parseInt(rgb[0]).toString(16);
		g = parseInt(rgb[1]).toString(16);
		b = parseInt(rgb[2]).toString(16);

		r = r.length == 1 ? '0' + r : r;
		g = g.length == 1 ? '0' + g : g;
		b = b.length == 1 ? '0' + b : b;

		return "#" + r + g + b;
	}

	return col;
}

TUI.generatePicker=function(el,b) {
	var h = '', i;
	pid="minControlLight-"+b.parentNode.getElementsByTagName('INPUT')[0].getAttribute('name').match(/(\w+)\[(\w+)\]/)[2];
	for (i = 0; i < TUI.detail; i++){
		h += '<div id="'+pid+'-'+i+'" style="background-color:#000000; width:15px; height:3px;font-size:1px; border-style:none; border-width:0px;"'
		+ ' onclick="TUI.changeFinalColor(this.style.backgroundColor,this,1)"'
		+ ' onmousemove=" TUI.changeFinalColor(this.style.backgroundColor,this); return false;"'
		+ '></div>';
	}
	el.innerHTML += '<div id="'+pid+'" class="miniControlLight">'+h+'</div>';
	
}
TUI.updateLight=function(r, g, b ,p) 
{
	var i, partDetail = TUI.detail / 2, finalCoef, finalR, finalG, finalB, color;
	var pid=p.parentNode.getElementsByTagName('DIV')[0].id+ '-';
	
	for (i=0; i<TUI.detail; i++) 
	{
		if ((i>=0) && (i<partDetail)) 
		{
			finalCoef = i / partDetail;
			finalR = TUI.dechex(255 - (255 - r) * finalCoef);
			finalG = TUI.dechex(255 - (255 - g) * finalCoef);
			finalB = TUI.dechex(255 - (255 - b) * finalCoef);
		} else {
			finalCoef = 2 - i / partDetail;
			finalR = TUI.dechex(r * finalCoef);
			finalG = TUI.dechex(g * finalCoef);
			finalB = TUI.dechex(b * finalCoef);
		}

		color = finalR + finalG + finalB;
		document.getElementById(pid + i).style.backgroundColor = '#'+color;
	}
}



/**********************************************************************
 *        color picker of fireworks (single)
 **********************************************************************/

TUI.colorPicker={
	current:null,
	callback:function(){},
	
	intocolor:function(box)
	{
		var ColorHex=['00','33','66','99','CC','FF'];
		var SpColorHex=['FF0000','00FF00','0000FF','FFFF00','00FFFF','FF00FF'];
		var colorTable='';
		for(var i=0;i<2;i++)
		{
			for(var j=0;j<6;j++)
			{
				var color1=ColorHex[j]+ColorHex[j]+ColorHex[j];
				colorTable+='<tr border="0" height="12"><td width="11" title="#000000" style="border:solid 1px #000;border-top:0px;border-left:0px;background-color:#000000"></td>';
			
				if(i==0)
					colorTable+='<td width="11" title="#'+color1+'" style="border:solid 1px #000;border-top:0px;border-left:0px;background-color:#'+color1+'"></td>';
				else
					colorTable+='<td width="11" title="#'+SpColorHex[j]+'" style="border:solid 1px #000;border-top:0px;border-left:0px;background-color:#'+SpColorHex[j]+'"></td>';
	
				colorTable+='<td width="11" title="#000000" style="border:solid 1px #000;border-top:0px;border-left:0px;background-color:#000000"></td>';
				for(var k=0;k<3;k++)
				{
					for (var l=0;l<6;l++)
					{
						colorTable+='<td width="11" title="#'+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'" style="border:solid 1px #000;border-top:0px;border-left:0px;background-color:#'+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'"></td>';
					}
				}
				colorTable+='</tr>';
			}
		}
		colorTable='<div style="height:26px;"><input type="text" size="6" disabled="disabled" style="border:solid 1px #000000;background-color:#ffff00" /><input type="text" size="7" value="#000000" style="border:1px solid #999;margin:0 0 0 10px;" /><input style="margin:0 0 0 94px;line-height:18px;height:20px;border:1px solid #999;color:#fff;background:#999;" type="button" value="关闭" onclick="document.body.removeChild(document.getElementById(\'TUI_colorpicker\'));" /></div><table border="0" style="border:1px solid #000;border-right:0px;border-bottom:0px; background:#000;" cellspacing="0" cellpadding="0" style="cursor:pointer;" onmouseover="TUI.colorPicker.doOver(event,this)"  onclick="TUI.colorPicker.doclick(event,this)">'+colorTable+'</table>';          
		box.innerHTML=colorTable;
	},

	doOver:function(e,t) 
	{
	      var event=TUI.EventUtil.getEvent();
		  var srcElement = event.target;
		  if ((srcElement.nodeName=="TD") && (this.current!=srcElement)) 
		  {
		      if (this.current!=null)this.current.style.backgroundColor = this.current._background;    
			  var cc=srcElement.getAttribute('title');
		      srcElement._background = cc;
		      document.getElementById('TUI_colorpicker').getElementsByTagName('INPUT')[0].style.backgroundColor = cc;
		      document.getElementById('TUI_colorpicker').getElementsByTagName('INPUT')[1].value = cc;
		      srcElement.style.backgroundColor = "#fff";
		      this.current = srcElement;
	      }
	},

	doclick:function(e,t)
	{
	    var event=TUI.EventUtil.getEvent();
		var srcElement = event.target;
	
		if (srcElement.tagName == "TD")
	    {
	        var clr = srcElement._background;
	        document.body.removeChild(document.getElementById('TUI_colorpicker'));
			
			this.callback(clr);
	        return clr;
	    }
	},

	display:function(e,t,cb)
	{
		var event=TUI.EventUtil.getEvent();
	    if(document.getElementById('TUI_colorpicker'))
		document.body.removeChild(document.getElementById('TUI_colorpicker'));
		
		this.callback=cb;
		
		var clrPanel = document.createElement("DIV");
			clrPanel.id="TUI_colorpicker";
			clrPanel.style.position="absolute";
			clrPanel.style.padding="4px";
			clrPanel.style.width="253px";
			clrPanel.style.background="#eee";
			clrPanel.style.border="1px solid #ccc";
		document.body.appendChild(clrPanel);
		TUI.colorPicker.intocolor(clrPanel);
	        
	    clrPanel.style.left = event.pageX-100+"px";
		clrPanel.style.top = event.pageY-180+"px";
		
	}

}