var ColorHex=new Array('00','33','66','99','CC','FF')
var SpColorHex=new Array('FF0000','00FF00','0000FF','FFFF00','00FFFF','FF00FF');
var current=null
var curColor=null;
var source_color_panel;
var part;


function intocolor()
{

var colorTable=''
for (i=0;i<2;i++)
 {
  for (j=0;j<6;j++)
   {
    colorTable=colorTable+'<tr height=12>'
    colorTable=colorTable+'<td width=11 style="background-color:#000000">'
    
    if (i==0){
    colorTable=colorTable+'<td width=11 style="background-color:#'+ColorHex[j]+ColorHex[j]+ColorHex[j]+'">'} 
    else{
    colorTable=colorTable+'<td width=11 style="background-color:#'+SpColorHex[j]+'">'} 
    
    colorTable=colorTable+'<td width=11 style="background-color:#000000">'
    for (k=0;k<3;k++)
     {
       for (l=0;l<6;l++)
       {
        colorTable=colorTable+'<td width=11 style="background-color:#'+ColorHex[k+i*3]+ColorHex[l]+ColorHex[j]+'">'
       }
     }
  }
}

colorTable='<table width=253 border="0" cellspacing="0" cellpadding="0" style="border:1px #000000 solid;border-bottom:none;border-collapse: collapse" bordercolor="000000">'
           +'<tr height=30><td colspan=21 bgcolor=#cccccc>'
           +'<table cellpadding="0" cellspacing="1" border="0" style="border-collapse: collapse">'
           +'<tr><td width="3"><td><input type="text" name="DisColor" size="6" disabled style="border:solid 1px #000000;background-color:#ffff00"></td>'
           +'<td width="3"><td><input type="text" name="HexColor" size="7" style="border:inset 1px;font-family:Arial;" value="#000000"></td></tr></table></td>'
		   +'<td width=11 height=12 border="1" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="000000" onmouseover="doOver()" onmouseout="doOut()" onclick="doclick()" style="cursor:hand;">X</td></tr></table>'		   
           +'<table border="1" cellspacing="0" cellpadding="0" style="border-collapse: collapse" bordercolor="000000" onmouseover="doOver()" onmouseout="doOut()" onclick="doclick()" style="cursor:hand;" width=253 >'
           +colorTable+'</table>';          
$('colorpanel').innerHTML=colorTable;
}
function doOver() {
      if ((event.srcElement.tagName=="TD") && (current!=event.srcElement)) {
        if (current!=null){current.style.backgroundColor = current._background}     
        event.srcElement._background = event.srcElement.style.backgroundColor
        DisColor.style.backgroundColor = event.srcElement.style.backgroundColor
        HexColor.value = event.srcElement.style.backgroundColor
        event.srcElement.style.backgroundColor = "white"
        current = event.srcElement
      }
}
function doOut() {
    if (current!=null) current.style.backgroundColor = current._background;
}

function doclick(){
	
if (event.srcElement.tagName=="TD"){

$("colorpanel").style.display="none";
curColor = event.srcElement._background ;


if(part=="blockTitle")
	{	
	 if(handleobj=(document.getElementsByClassName("blockTitle",document)))
		{
		 for(i=0;i<handleobj.length;i++) 
		 {
			handleobj[i].style.color= curColor;
		  }
				
		}
		wrapCode("title color",".blockTitle{color:"+curColor+"}")
	
	}

if(part=="blockTitleBg")
	{	if(handleobj=(document.getElementsByClassName("blockTitle",document)))
		{
			 for(i=0;i<handleobj.length;i++) 
			 {
				handleobj[i].style.backgroundColor= curColor;
		  	}
		}
		wrapCode("title bgcolor",".blockTitle{background-color:"+curColor+"}")		
	}	

if(part=="blockContent")
	{	if(handleobj=(document.getElementsByClassName("blockContent",document)))
		 for(i=0;i<handleobj.length;i++)  {
			handleobj[i].style.color= curColor;
			handleobj2=handleobj[i].getElementsByTagName("a");
			for(j=0;j<handleobj2.length;j++)  
				handleobj2[j].style.color= curColor;
		  }
				
		
		wrapCode("block font-color",
				 ".blockContent{color:"+curColor+"}"+
				 "\n.blockContent a{color:"+curColor+"}"
				 )		
		
		
	}	

if(part=="blockContentBg")
	{	if(handleobj=(document.getElementsByClassName("blockContent",document)))
		 for(i=0;i<handleobj.length;i++)  {
			handleobj[i].style.backgroundColor= curColor;
		  }
		
		wrapCode("block bg color",
		".blockContent{background-color:"+curColor+"}"
		 )		

	}

if(part=="borderColor")
	{	if(handleobj=(document.getElementsByClassName("blockBorder",document)))
		 for(i=0;i<handleobj.length;i++)  {
			handleobj[i].style.borderColor= curColor;
		  }
		  
		wrapCode("border color",
		".blockBorder{border-color:"+curColor+"}"
		 )	
	}

if(part=="mainColor")
	{	if($('main'))
			 $('custom_WYSIWYG_page').style.backgroundColor= curColor;
			 
		wrapCode("mainColor",
		"#perG_data{background-color:"+curColor+"}"
		 )	
	}
	
if(part=="pageColor")
	{	$('custom_WYSIWYG_page').style.backgroundColor= curColor;
		
		wrapCode("page color",
		"body{background-color:"+curColor+"}"
		 )	
	}
	
	eval(part+"='"+curColor+"'");
		
	makeJsCode();		
	updateColorInput(curColor);	

}

}

function setColor(p)
{
source_color_panel = event.srcElement ;
part = p;
$("colorpanel").style.display="";
$("colorpanel").style.left = event.clientX;
$("colorpanel").style.top = event.clientY-170;
}


function updateColorInput(curColor)
{
source_color_panel.style.backgroundColor = curColor;
}



/////////border//////
function setBorder(bs,bw)
{
	if(bs)
	{
		if(handleobj=(document.getElementsByClassName("blockBorder",document)))
		 for(i=0;i<handleobj.length;i++)  {
			handleobj[i].style.borderStyle=bs;
		  }
		
		wrapCode("border style",
		".blockBorder{border-style:"+bs+"}\n"
		 )	
		borderStyle=bs;
	}
	
	if(bw!=null)
	{
		 if(handleobj=(document.getElementsByClassName("blockBorder",document)))
		 for(i=0;i<handleobj.length;i++)  {
			handleobj[i].style.borderWidth=bw+"px";
		  }
		  		
		wrapCode("border width",
		".blockBorder{border-width:"+bw+"px}\n"
		 )	
		borderWidth=bw;
	}
		
	
	makeJsCode();	
	
}


function setBGM(part,curBg)
{
if(part=="pageBg")
	{	
		$('custom_WYSIWYG_page').style.backgroundImage= "url("+curBg+")";	
		wrapCode("page bg image",
		"body{background-image:url("+curBg+")}"
		 )	
	}
		
	bgImage=curBg;
	makeJsCode();	
	
}

function setBgRepeat(part,curRepeat)
{
if(part=="pageBg")
	{	
		document.body.style.backgroundRepeat= curRepeat;	
		wrapCode("page bg image repeat",
		"body{background-repeat:"+curRepeat+"}"
		 )	
	}
		
	bgRepeat=curRepeat;
	makeJsCode();	
}


function setFlash(curFlash)
{
if(curFlash!="")
{
$("flashBg").outerHTML = 
'<EMBED id="flashBg" align=right height=700 src="'+curFlash+'" style="LEFT:10px; POSITION:absolute; TOP:-120px" width=980; quality="high" wmode="transparent"  autostart=true >'
}
bgFlash = curFlash;
makeJsCode();
}


function wrapCode(name,code)
{
	
	wrapedCode ="";
	wrapedCode+="\n\n/*begin"+name+"*/\n"; 
	 wrapedCode+=code + "\n";
	 wrapedCode+="/*end"+name+"*/";
	
	if(customStr.indexOf("/*begin"+name+"*/")<0)
	{
		customStr+=wrapedCode;
		
	}
	else
	{
		beginIndex=customStr.indexOf("\n\n/*begin"+name+"*/");
		endIndex=customStr.indexOf("/*end"+name+"*/");
		offset= ("/*end"+name+"*/").length;
		bereplacedStr = customStr.substring(beginIndex,endIndex+offset);
		customStr = customStr.replace(bereplacedStr,"");	
		customStr+=wrapedCode;		
	}
	
		$('customizeCode').value="<style type=\"text/css\">\n" + customStr + "\n</style>";
		
		
	
}


function makeJsCode()
{
	
jsCode="";
jsCode+=wrapJsCode("borderColor");
jsCode+=wrapJsCode("borderStyle");
jsCode+=wrapJsCode("borderWidth");
jsCode+=wrapJsCode("blockTitle");
jsCode+=wrapJsCode("blockTitleBg");
jsCode+=wrapJsCode("blockContent");
jsCode+=wrapJsCode("blockContentBg");
jsCode+=wrapJsCode("mainColor");
jsCode+=wrapJsCode("pageColor");
jsCode+=wrapJsCode("bgImage");
jsCode+=wrapJsCode("bgRepeat");
jsCode+=wrapJsCode("bgFlash");

$('customizeJsCode').value="<Script>\n" + jsCode + "\n</Script>";
}

function wrapJsCode(name)
{
	return(name+"=\""+eval(name)+"\";\n");
}