// JavaScript Document
function $(id){return document.getElementById(id);}
function over(obj,color){
	obj.className="colorSmallBox colorOver";
	$('colorExColor').style.backgroundColor=color;
	if(document.all){
		$('colorExTxt').innerText='#'+color;
	}else{
		$('colorExTxt').innerHTML='#'+color;
	}
}
function out(obj){
	obj.className="colorSmallBox colorOut";
}
function closePicker(){
	try{
		$('colorPick').parentNode.removeChild($('colorPick'));
	}catch(e){}
}
function colorClick(id,color){
	closePicker();
	$(id).value=color;
	$(id+'P').onclick=function(){pickColor(this,id,color);};
	$(id+'P').style.background='#'+color;
}
function pickColor(obj,id,color){
	if($('colorPick')){
		$('colorPick').parentNode.removeChild($('colorPick'));
	}
	colorArr=new Array('00','33','66','99','CC','FF');
	if(!color){
		color="FFFFFF";
	}
	colorNode=document.createElement('div');
	colorNode.className="colorPick";
	colorNode.id="colorPick";
	html="<div class=\"colorHeadBox\"><div id=\"colorExColor\" style=\"background-color:#"+color+"\"></div><div id=\"colorExTxt\">#"+color+"</div><div style=\"float:right;margin:3px;\"><a onclick=\"closePicker();return false;\">close</a></div></div>";
	html+="<div class=\"colorBigBox\">";
	for(i=0;i<6;i++){
		html+="<div class=\"colorMediumBox\">";
		for(j=0;j<6;j++){
			for(k=0;k<6;k++){
				cj=colorArr[i]+colorArr[k]+colorArr[j];
				html+="<div class=\"colorSmallBox\" title=\"#"+cj+"\" style=\"background-color:#"+cj+"\" onmouseover=\"over(this,'"+cj+"');\" onmouseout=\"out(this);\" onclick=\"colorClick('"+id+"','"+cj+"');\" >&nbsp;&nbsp;&nbsp;</div>";
			}
		}
		html+="</div>";
	}
	html+="</div>";
	colorNode.innerHTML=html;
	obj.parentNode.appendChild(colorNode);
}
