//*******************************************************************************
//Title:      FCP Combo-Chromatic Color Picker
//URL:        http://www.free-color-picker.com
//Product No. FCP201a
//Version:    1.2
//Date:       10/01/2006
//NOTE:       Permission given to use this script in ANY kind of applications IF
//            script code remains UNCHANGED and the anchor tag "powered by FCP"
//            remains valid and visible to the user.
//
//  Call:     showColorGrid3("input_field_id","span_id")
//  Add:      <DIV ID="colorpicker" CLASS="colorpicker"></DIV> anywhere in body
//*******************************************************************************
function getScrollY(){var scrOfX = 0,scrOfY=0;if(typeof(window.pageYOffset)=='number'){scrOfY=window.pageYOffset;scrOfX=window.pageXOffset;}else if(document.body&&(document.body.scrollLeft||document.body.scrollTop)){scrOfY=document.body.scrollTop;scrOfX=document.body.scrollLeft;}else if(document.documentElement&&(document.documentElement.scrollLeft||document.documentElement.scrollTop)){scrOfY=document.documentElement.scrollTop;scrOfX=document.documentElement.scrollLeft;}return scrOfY;}document.write("<style>.colorpicker{text-align:center;visibility:hidden;display:none;position:absolute;background-color:#FFF;border:solid 1px #CCC;padding:4px;z-index:999;filter:progid:DXImageTransform.Microsoft.Shadow(color=#D0D0D0,direction=135);}.o5582brd{border-bottom:solid 1px #000000;border-right:solid 1px #DFDFDF;padding:0px;}a.o5582n66,.o5582n66,.o5582n66a{font-family:arial,tahoma,sans-serif;text-decoration:underline;font-size:9px;color:#666;border:none;}.o5582n66,.o5582n66a{text-align:center;text-decoration:none;}a:hover.o5582n66{text-decoration:none;color:#FFA500;cursor:pointer;}.a01p3{padding:1px 4px 1px 2px;background:whitesmoke;border:solid 1px #DFDFDF;}</style>");

function gettop()
{
	return yMousePos;
}

function getleft()
{
	return xMousePos;
}



if (document.layers || window.Event) { // Netscape
    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = captureMousePosition;
} else if (document.all) { // Internet Explorer
    document.onmousemove = captureMousePosition;
} else if (document.getElementById) { // Netcsape 6
    document.onmousemove = captureMousePosition;
}
// Global variables
xMousePos = 0; // Horizontal position of the mouse on the screen
yMousePos = 0; // Vertical position of the mouse on the screen
xMousePosMax = 0; // Width of the page
yMousePosMax = 0; // Height of the page

function captureMousePosition(e) {
    if (document.layers) {
        // When the page scrolls in Netscape, the event's mouse position
        // reflects the absolute position on the screen. innerHight/Width
        // is the position from the top/left of the screen that the user is
        // looking at. pageX/YOffset is the amount that the user has 
        // scrolled into the page. So the values will be in relation to
        // each other as the total offsets into the page, no matter if
        // the user has scrolled or not.
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    } else if (document.all && document.body) {
        // When the page scrolls in IE, the event's mouse position 
        // reflects the position from the top/left of the screen the 
        // user is looking at. scrollLeft/Top is the amount the user
        // has scrolled into the page. clientWidth/Height is the height/
        // width of the current page the user is looking at. So, to be
        // consistent with Netscape (above), add the scroll offsets to
        // both so we end up with an absolute value on the page, no 
        // matter if the user has scrolled or not.
        xMousePos = window.event.x+document.body.scrollLeft;
        yMousePos = window.event.y+document.body.scrollTop;
        xMousePosMax = document.body.clientWidth+document.body.scrollLeft;
        yMousePosMax = document.body.clientHeight+document.body.scrollTop;
    } else if (document.getElementById && document.body ) {
        // Netscape 6 behaves the same as Netscape 4 in this regard 
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    }
}




var nocol1="&#78;&#79;&#32;&#67;&#79;&#76;&#79;&#82;",clos1="&#67;&#76;&#79;&#83;&#69;",tt6="&#70;&#82;&#69;&#69;&#45;&#67;&#79;&#76;&#79;&#82;&#45;&#80;&#73;&#67;&#75;&#69;&#82;&#46;&#67;&#79;&#77;",hm6="&#104;&#116;&#116;&#112;&#58;&#47;&#47;&#119;&#119;&#119;&#46;";hm6+=tt6;tt6="&#80;&#79;&#87;&#69;&#82;&#69;&#68;&#32;&#98;&#121;&#32;&#70;&#67;&#80;";function setCCbldID6(objID,val){document.getElementById(objID).value=val;}function setCCbldSty6(objID,prop,val){switch(prop){case "bc":if(objID!='none'){document.getElementById(objID).style.backgroundColor=val;}break;case "vs":document.getElementById(objID).style.visibility=val;break;case "ds":document.getElementById(objID).style.display=val;break;case "tp":document.getElementById(objID).style.top=val;break;case "lf":document.getElementById(objID).style.left=val;break;}}function putOBJxColor6(OBjElem,Samp,pigMent){if(pigMent!='x'){setCCbldID6(OBjElem,pigMent);setCCbldSty6(Samp,'bc',pigMent);}setCCbldSty6('colorpicker','vs','hidden');setCCbldSty6('colorpicker','ds','none');}

var _globalB = 1;

function SetB(b)
{
	_globalB = b;
	Draw();
}

function RGB2Hex(red, green, blue)
{
	var c="0123456789abcdef";

	with (Math) {

		n1=c.substring(floor(red/16),floor(red/16)+1);

		n2=c.substring(red%16,(red%16)+1);

		n3=c.substring(floor(green/16),floor(green/16)+1);

		n4=c.substring(green%16,(green%16)+1);

		n5=c.substring(floor(blue/16),floor(blue/16)+1);

		n6=c.substring(blue%16,(blue%16)+1);	


	}

	return "#"+n1+""+n2+""+n3+""+n4+""+n5+""+n6;
}

function Draw()
{
	var div = document.getElementById("divMainColor");

	var html = "<table cellspacing=0 cellpadding=0 border=0><tr>";
	var color, param;

	for(var r=1;r<256;r+=15)
	{
		for(var g=1;g<256;g+=15)
		{
			
			color = RGB2Hex(r,g,_globalB);
			color = color.toUpperCase();
			
			param = "'"+_OBjElem+"', '"+_Sam+"','"+color+"'";
			html += '<td style="background-color:'+color+';padding:0px;spacing:0px;border-style:none;"><a class="o5582n66" href="javascript:onclick=putOBJxColor6('+param+');" onmouseover=javascript:document.getElementById("o5582n66").value="'+color+'";javascript:document.getElementById("o5582n66a").style.backgroundColor="'+color+'";title="'+color+'"><div style="width:20px;height:15px;"></div></a></td>';

		}
		
		html +="</tr><tr>";	
	}

	div.innerHTML = html;


}

var _OBjElem;
var _Sam;

function showColorGrid3(OBjElem,Sam)
{
	_OBjElem = OBjElem;
	_Sam = Sam;

	var objX=new Array('00','33','66','99','CC','FF');
	var c=0;
	var z='"'+OBjElem+'","'+Sam+'",""';
	var xl='"'+OBjElem+'","'+Sam+'","x"';
	var mid='';
	var head ='<center><table width=400 bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" style="border:solid 1px #F0F0F0;padding:2px;"><tr>';
	head +="<td colspan='18' align='left' style='font-size:10px;background:#6666CC;color:#FFF;font-family:arial;'>&nbsp;Combo-Chromatic Selection Palette</td></tr><tr><td colspan='18' align='center' style='margin:0;padding:2px;height:14px;' ><input class='o5582n66' type='text' size='10' id='o5582n66' value='#FFFFFF'><input class='o5582n66a' type='text' size='2' style='width:100px;' id='o5582n66a' onclick='javascript:alert(\"click on selected swatch below...\");' value='' style='border:solid 1px #666;'>&nbsp;|&nbsp;<a class='o5582n66' href='javascript:onclick=putOBJxColor6("+z+")'><span class='a01p3'>"+nocol1+"</span></a>&nbsp;&nbsp;&nbsp;&nbsp;<a class='o5582n66' href='javascript:onclick=putOBJxColor6("+xl+")'><span class='a01p3'>"+clos1+"</span></a></td></tr></table>";
	var br=1;
	
	var html = "<table width=400px border=0><tr><td><table>";

	//======================================================
	//BLUE SLIDER
	//======================================================
	for(var b=1;b<256;b+=30)
	{
		var c = RGB2Hex(1,1,b);

		html += "<tr><td style='background-color:" + c + ";width:30px;height:25px;padding:0px;border:solid 2px #ffffff'><a class=o5582n66 href=\"javascript:SetB('" + b + "');\"><div style='width:30px;height:25px;'></div></a></td></tr>";
	}
	
	html += "</table><br>";
	//======================================================

	html += "</td><td><div id=divMainColor></div></td></tr></table>";

				
	//==================================================================
	//BLACK & WHITE
	//==================================================================

	var objX=new Array('0','3','6','9','C','F');
	
	var c=0;
	var z='"'+OBjElem+'","'+Sam+'",""';
	var xl='"'+OBjElem+'","'+Sam+'","x"';
	mid+='<table width=400 bgcolor="#FFFFFF" border="0" cellpadding="0" cellspacing="0" style="border:solid 1px #F0F0F0;padding:1px;"><tr>';
	var br=0;
	
	for(y=0;y<6;y++)
	{
		for(x=0;x<6;x++)
		{
			if(br==18)
			{
				br=0;
				mid+='</tr><tr>';
			}
			br++;
			var grid='';
			grid=objX[y]+objX[x]+objX[y]+objX[x]+objX[y]+objX[x];
			grid = grid.toUpperCase();
			var b="'"+OBjElem+"', '"+Sam+"','#"+grid+"'";
			mid+='<td style="background-color:#'+grid+';"><a class="o5582n66" href="javascript:onclick=putOBJxColor6('+b+');" onmouseover=javascript:document.getElementById("o5582n66").value="#'+grid+'";javascript:document.getElementById("o5582n66a").style.backgroundColor="#'+grid+'";title="#'+grid+'"><div style="width:10px;height:14px;"></div></a></td>';
			c++;
		}
	}
	
	mid+="</tr><tr><td colspan='18' align='right' style='padding:2px;border:solid 1px #FFF;background:#FFF;'><a href='"+hm6+"' style='color:#666;font-size:8px;font-family:arial;text-decoration:none;letter-spacing:1px;'>"+tt6+"</a></td>";mid+='</tr></table></center>';
	setCCbldSty6('colorpicker','tp','100px');
	var div = document.getElementById('colorpicker');
	
	div.style.position = "absolute";
	div.style.top=gettop() + "px";
	div.style.left=getleft() + "px";
	setCCbldSty6('colorpicker','vs','visible');
	setCCbldSty6('colorpicker','ds','block');
	div.innerHTML=head + html + mid;

	Draw();
}