function colorPicker(event) {

//HEXIDECIMAL FUNCTIONS
function dtoh(d) {
d=d.toString(16);
if (d.length == 1) {d = "0"+d;}
else {d = d;}
return d;
}
function htod(h) {return parseInt(h,16);}

//CREATE COLOR BOX
var cDiv = document.createElement('div');
cDiv.id = 'colorpicker';
cDiv.style.position = 'absolute';
cDiv.style.display = 'none';
cDiv.style.top = event.pageY + 205 + "px";
cDiv.style.left = (document.body.clientWidth / 2) + "px";

//DISPLAY COLORS
innerHTML = "<div style=text-align:right;cursor:pointer;cursor:hand;font-style:italic;font-size:10px;color:#FFFFFF; id=closecolor title=Close onclick=closeColor('colorpicker');>X</div><table>";
//REDS
innerHTML = innerHTML+"<tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = (temp+"0000").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//ORANGES
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
temp2 = dtoh(c-51).toString();
color = (temp+temp2+"00").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//YELLOWS
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = (temp+temp+"00").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//GREENS
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = ("00"+temp+"00").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//TEALS
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
temp2 = dtoh(c-51).toString();
color = ("00"+temp+temp2).toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//BLUES
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = ("0000"+temp).toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//PURPLES
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
temp2 = dtoh(c-51).toString();
color = (temp+"00"+temp2).toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
innerHTML = innerHTML+"</tr></table>";

//DISPLAY COLOR BOX
document.body.appendChild(cDiv);
$('#colorpicker').fadeIn(500);
cDiv.style.backgroundColor = "#000000";
cDiv.style.border = '#333333 1px solid';
cDiv.style.zIndex = 9999;
cDiv.innerHTML = innerHTML;
}

function submitColor(color) {
window.frames[0].document.getElementById('colorVote').value = color;
window.frames[0].document.getElementById('colorVote').form.submit();
closeColor();
}

function closeColor() {
$('#colorpicker').fadeOut(500,function() {$('#colorpicker').remove();});
}
