var CPArray = new Array();

var CP_NAMED =
[
 ["CC0000", "red"],
 ["FFFF00", "yellow"],
 ["00FF00", "lime"],
 ["00FFFF", "cyan"],
 ["0000FF", "blue"],
 ["FF00FF", "magenta"],
 ["FFFFFF", "white"],
 ["F5F5F5", "whitesmoke"],
 ["DCDCDC", "gainsboro"],
 ["D3D3D3", "lightgrey"],
 ["C0C0C0", "silver"],
 ["A9A9A9", "darkgray"],
 ["808080", "gray"],
 ["696969", "dimgray"],
 ["000000", "black"],
 ["2F4F4F", "darkslategray"],
 ["708090", "slategray"],
 ["778899", "lightslategray"],
 ["4682B4", "steelblue"],
 ["4169E1", "royalblue"],
 ["6495ED", "cornflowerblue"],
 ["B0C4DE", "lightsteelblue"],
 ["7B68EE", "mediumslateblue"],
 ["6A5ACD", "slateblue"],
 ["483D8B", "darkslateblue"],
 ["191970", "midnightblue"],
 ["000080", "navy"],
 ["00008B", "darkblue"],
 ["0000CD", "mediumblue"],
 ["1E90FF", "dodgerblue"],
 ["00BFFF", "deepskyblue"],
 ["87CEFA", "lightskyblue"],
 ["87CEEB", "skyblue"],
 ["ADD8E6", "lightblue"],
 ["B0E0E6", "powderblue"],
 ["F0FFFF", "azure"],
 ["E0FFFF", "lightcyan"],
 ["AFEEEE", "paleturquoise"],
 ["48D1CC", "mediumturquoise"],
 ["20B2AA", "lightseagreen"],
 ["008B8B", "darkcyan"],
 ["008080", "teal"],
 ["5F9EA0", "cadetblue"],
 ["00CED1", "darkturquoise"],
 ["00FFFF", "aqua"],
 ["40E0D0", "turquoise"],
 ["7FFFD4", "aquamarine"],
 ["66CDAA", "mediumaquamarine"],
 ["8FBC8F", "darkseagreen"],
 ["3CB371", "mediumseagreen"],
 ["2E8B57", "seagreen"],
 ["006400", "darkgreen"],
 ["008000", "green"],
 ["228B22", "forestgreen"],
 ["32CD32", "limegreen"],
 ["00FF00", "lime"],
 ["7FFF00", "chartreuse"],
 ["7CFC00", "lawngreen"],
 ["ADFF2F", "greenyellow"],
 ["98FB98", "palegreen"],
 ["90EE90", "lightgreen"],
 ["00FF7F", "springgreen"],
 ["00FA9A", "mediumspringgreen"],
 ["556B2F", "darkolivegreen"],
 ["6B8E23", "olivedrab"],
 ["808000", "olive"],
 ["BDB76B", "darkkhaki"],
 ["B8860B", "darkgoldenrod"],
 ["DAA520", "goldenrod"],
 ["FFD700", "gold"],
 ["F0E68C", "khaki"],
 ["EEE8AA", "palegoldenrod"],
 ["FFEBCD", "blanchedalmond"],
 ["FFE4B5", "moccasin"],
 ["F5DEB3", "wheat"],
 ["FFDEAD", "navajowhite"],
 ["DEB887", "burlywood"],
 ["D2B48C", "tan"],
 ["BC8F8F", "rosybrown"],
 ["A0522D", "sienna"],
 ["8B4513", "saddlebrown"],
 ["D2691E", "chocolate"],
 ["CD853F", "peru"],
 ["F4A460", "sandybrown"],
 ["8B0000", "darkred"],
 ["800000", "maroon"],
 ["A52A2A", "brown"],
 ["B22222", "firebrick"],
 ["CD5C5C", "indianred"],
 ["F08080", "lightcoral"],
 ["FA8072", "salmon"],
 ["E9967A", "darksalmon"],
 ["FFA07A", "lightsalmon"],
 ["FF7F50", "coral"],
 ["FF6347", "tomato"],
 ["FF8C00", "darkorange"],
 ["FFA500", "orange"],
 ["FF4500", "orangered"],
 ["DC143C", "crimson"],
 ["CC0000", "red"],
 ["FF1493", "deeppink"],
 ["FF00FF", "fuchsia"],
 ["FF69B4", "hotpink"],
 ["FFB6C1", "lightpink"],
 ["FFC0CB", "pink"],
 ["DB7093", "palevioletred"],
 ["C71585", "mediumvioletred"],
 ["800080", "purple"],
 ["8B008B", "darkmagenta"],
 ["9370DB", "mediumpurple"],
 ["8A2BE2", "blueviolet"],
 ["4B0082", "indigo"],
 ["9400D3", "darkviolet"],
 ["9932CC", "darkorchid"],
 ["BA55D3", "mediumorchid"],
 ["DA70D6", "orchid"],
 ["EE82EE", "violet"],
 ["DDA0DD", "plum"],
 ["D8BFD8", "thistle"],
 ["E6E6FA", "lavender"],
 ["F8F8FF", "ghostwhite"],
 ["F0F8FF", "aliceblue"],
 ["F5FFFA", "mintcream"],
 ["F0FFF0", "honeydew"],
 ["FAFAD2", "lightgoldenrodyellow"],
 ["FFFACD", "lemonchiffon"],
 ["FFF8DC", "cornsilk"],
 ["FFFFE0", "lightyellow"],
 ["FFFFF0", "ivory"],
 ["FFFAF0", "floralwhite"],
 ["FAF0E6", "linen"],
 ["FDF5E6", "oldlace"],
 ["FAEBD7", "antiquewhite"],
 ["FFE4C4", "bisque"],
 ["FFDAB9", "peachpuff"],
 ["FFEFD5", "papayawhip"],
 ["FFF5EE", "seashell"],
 ["FFF0F5", "lavenderblush"],
 ["FFE4E1", "mistyrose"],
 ["FFFAFA", "snow"] 
];

function Color_Picker(inDIV) {
 this.uID = document.uniqueID;
 CPArray[this.uID] = this;
 this.which = null;
 this.oPopup = window.createPopup();
 this.GetMenuColors = function()
 {
  var str = "", i = 0, j = 0, k = 0, tdDisp = 0, totDisp = 0, fDisp = 0, aHex;
  str += "<DIV ID=\"ColorMenu_" + this.uID + "\" STYLE=\"display:none;\">";
  str += "<table id=\"Named_" + this.uID + "\" cellpadding=\"1\" cellspacing=\"2\" border=\"1\" bordercolor=\"#666666\" style=\"font-family: tahoma; font-size: 7px; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 2px solid; BORDER-TOP: buttonhighlight 1px solid; BORDER-BOTTOM: buttonshadow 1px solid; table-layout; fixed;\" bgcolor=\"buttonface\" width=\"100%\" height=\"100%\">";
  str += "<tr><td align=\"center\" colspan=\"16\" style=\"height: 20px;border:1px solid buttonface;font-family: tahoma; font-size:11px;\">";
  str += "<font color=\"#CC0000\"><b>Palette 1</b></font> - ";
  str += "<a style=\"cursor:hand;\" onClick=\"javascript:parent.CPArray['" + this.uID + "'].ToggleColor(Gray_" + this.uID + ", Named_" + this.uID + ", Safe_" + this.uID + ");\"><b>Palette 2</b></a> - ";
  str += "<a style=\"cursor:hand;\" onClick=\"javascript:parent.CPArray['" + this.uID + "'].ToggleColor(Safe_" + this.uID + ", Named_" + this.uID + ", Gray_" + this.uID + ");\"><b>Palette 3</b></a>";
  str += "</td></tr>";
  str += "<tr><td colspan=\"16\" id=\"NamedColor_" + this.uID + "\" style=\"height: 20px;font-family: tahoma; font-size:11px;\">&nbsp;</td></tr>";
  str += "<tr><td width=\"100%\" colspan=\"16\" id=\"NamedName_" + this.uID + "\" style=\"height: 20px;border: 1px solid buttonface; font-family: tahoma; font-size:9px;\" align=\"left\">&nbsp;</td>";
  str += "</tr>";
  str += "<tr><td colspan=\"16\" onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(NamedColor_" + this.uID + ", NamedName_" + this.uID + ", this, '');\" style=\"height: 20px;font-family: tahoma; font-size:11px;cursor: hand;\" align=\"center\" onClick=\"parent.CPArray['" + this.uID + "'].DoColor('');\">Aucune</td></tr>";
  str += "<tr>";
  for (i = 0; i < CP_NAMED.length; i++) {
   if (i % 16 == 0 && i != 0) {
    str += "</tr>";
    str += "<tr>";
    tdDisp = 0;
   }
   str += "<td style=\"height:11px;width:11px;cursor: hand;background-color:'" + CP_NAMED[i][0] + "'; font-size: 0px;\"";
   str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(NamedColor_" + this.uID + ", NamedName_" + this.uID + ", this, '" + CP_NAMED[i][1] + "');\"";
   str += " onClick=\"parent.CPArray['" + this.uID + "'].DoColor('" + CP_NAMED[i][0] + "');\">" + String.fromCharCode(160) + "</td>";
   tdDisp++;
   totDisp++;
  };
  for (i = tdDisp; i < 16; i++) {
   str += "<td style=\"height:11px;width:11px;border: 1px solid buttonface; background-color:buttonface; font-size: 0px;\"";
   str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(NamedColor_" + this.uID + ", NamedName_" + this.uID + ", this, '');\">" + String.fromCharCode(160) + "</td>";
   totDisp++;
  };
  str += "</tr>";
  str += "<tr>";
  fDisp = totDisp;
  for (i = totDisp; i < (16 * 16); i++) {
   if (i % 16 == 0 && i != fDisp) {
    str += "</tr>";
    str += "<tr>";
   }
   str += "<td style=\"height:11px;width:11px;border: 1px solid buttonface; background-color:buttonface; font-size: 0px;\"";
   str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(NamedColor_" + this.uID + ", NamedName_" + this.uID + ", this, '');\">" + String.fromCharCode(160) + "</td>";
  };
  str += "</tr>";
  str += "</table>";
  aHex = new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
  str += "<table id=\"Gray_" + this.uID + "\" cellpadding=\"1\" cellspacing=\"2\" border=\"1\" bordercolor=\"#666666\" style=\"font-family: tahoma; font-size: 7px; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 2px solid; BORDER-TOP: buttonhighlight 1px solid; BORDER-BOTTOM: buttonshadow 1px solid; table-layout; fixed;display: none;\" bgcolor=\"buttonface\" width=\"100%\" height=\"100%\">";
  str += "<tr><td align=\"center\" colspan=\"16\" style=\"height:20px;border:1px solid buttonface;font-family: tahoma; font-size:11px;\">";
  str += "<a style=\"cursor:hand;\" onClick=\"javascript:parent.CPArray['" + this.uID + "'].ToggleColor(Named_" + this.uID + ", Gray_" + this.uID + ", Safe_" + this.uID + ");\"><b>Palette 1</b></a> - ";
  str += "<font color=\"#CC0000\"><b>Palette 2</b></font> - ";
  str += "<a style=\"cursor:hand;\" onClick=\"javascript:parent.CPArray['" + this.uID + "'].ToggleColor(Safe_" + this.uID + ", Named_" + this.uID + ", Gray_" + this.uID + ");\"><b>Palette 3</b></a>";
  str += "</td></tr>";
  str += "<tr><td colspan=\"16\" id=\"GrayColor_" + this.uID + "\" style=\"height:20px;font-family: tahoma; font-size:11px;\">&nbsp;</td></tr>";
  str += "<tr><td colspan=\"16\" id=\"GrayName_" + this.uID + "\" style=\"height:20px;border: 1px solid buttonface; font-family: tahoma; font-size:11px;\" align=\"left\">&nbsp;</td></tr>";
  str += "<tr><td onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(GrayColor_" + this.uID + ", GrayName_" + this.uID + ", this, '');\" colspan=\"16\" style=\"height:20px;font-family: tahoma; font-size:11px;cursor: hand;\" align=\"center\" onClick=\"parent.CPArray['" + this.uID + "'].DoColor('');\">Aucune</td></tr>";
  str += "<tr>";
  for (i = 0; i < aHex.length; i++) {
   for (j = 0; j < aHex.length; j++) {
    str += "<td style=\"height:11px;width:11px;cursor: hand;background-color:'#" + aHex[i] + aHex[j] + aHex[i] + aHex[j] + aHex[i] + aHex[j] + "'; font-size: 0px;\"";
    str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(GrayColor_" + this.uID + ", GrayName_" + this.uID + ", this, '');\"";
    str += " onClick=\"parent.CPArray['" + this.uID + "'].DoColor('" + aHex[i] + aHex[j] + aHex[i] + aHex[j] + aHex[i] + aHex[j] + "');\">" + String.fromCharCode(160) + "</td>";
   };
   if (i < aHex.length - 1) {
     str += "</tr>";
     str += "<tr>";
   }
  };
  str += "</tr>";
  str += "</table>";
  aHex = new Array("00","33","66","99","CC","FF");
  tdDisp = 0;
  totDisp = 0;
  str += "<table id=\"Safe_" + this.uID + "\" cellpadding=\"1\" cellspacing=\"2\" border=\"1\" bordercolor=\"#666666\" style=\"font-family: tahoma; font-size: 7px; BORDER-LEFT: buttonhighlight 1px solid; BORDER-RIGHT: buttonshadow 2px solid; BORDER-TOP: buttonhighlight 1px solid; BORDER-BOTTOM: buttonshadow 1px solid; table-layout; fixed;display: none;\" bgcolor=\"buttonface\" width=\"100%\" height=\"100%\">";
  str += "<tr><td align=\"center\" colspan=\"16\" style=\"height:20px;border:1px solid buttonface;font-family: tahoma; font-size:11px;\">";
  str += "<a style=\"cursor:hand;\" onClick=\"javascript:parent.CPArray['" + this.uID + "'].ToggleColor(Named_" + this.uID + ", Gray_" + this.uID + ", Safe_" + this.uID + ");\"><b>Palette 1</b></a> - ";
  str += "<a style=\"cursor:hand;\" onClick=\"javascript:parent.CPArray['" + this.uID + "'].ToggleColor(Gray_" + this.uID + ", Named_" + this.uID + ", Safe_" + this.uID + ");\"><b>Palette 2</b></a> - ";
  str += "<font color=\"#CC0000\"><b>Palette 3</b></font>";
  str += "</td></tr>";
  str += "<tr><td colspan=\"16\" id=\"SafeColor_" + this.uID + "\" style=\"height:20px;font-family: tahoma; font-size:11px;\">&nbsp;</td></tr>";
  str += "<tr><td colspan=\"16\" id=\"SafeName_" + this.uID + "\" style=\"height:20px;border: 1px solid buttonface; font-family: tahoma; font-size:11px;\" align=\"left\">&nbsp;</td></tr>";
  str += "<tr><td colspan=\"16\" onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(SafeColor_" + this.uID + ", SafeName_" + this.uID + ", this, '');\" style=\"height:20px;font-family: tahoma; font-size:11px;cursor: hand;\" align=\"center\" onClick=\"parent.CPArray['" + this.uID + "'].DoColor('');\">Aucune</td></tr>";
  str += "<tr>";
  for (i = 0; i < aHex.length; i++) {
   for (j = 0; j < aHex.length; j++) {
    for (k = 0; k < aHex.length; k++) {
     if (totDisp % 16 == 0 && totDisp != 0) {
      str += "</tr>";
      str += "<tr>";
      tdDisp = 0;
     }
     str += "<td style=\"height:11px;width:11px;cursor: hand;background-color:'#" + aHex[i] + aHex[j] + aHex[k] + "'; font-size: 0px;\"";
     str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(SafeColor_" + this.uID + ", SafeName_" + this.uID + ", this, '');\"";
     str += " onClick=\"parent.CPArray['" + this.uID + "'].DoColor('" + aHex[i] + aHex[j] + aHex[k] + "');\">" + String.fromCharCode(160) + "</td>";
     tdDisp++;
     totDisp++;
    };
   };
  };
  for (i = tdDisp; i < 16; i++) {
   str += "<td style=\"height:11px;width:11px;border: 1px solid buttonface; background-color:buttonface; font-size: 0px;\"";
   str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(SafeColor_" + this.uID + ", SafeName_" + this.uID + ", this, '');\">" + String.fromCharCode(160) + "</td>";
   totDisp++;
  };
  str += "</tr>";
  str += "<tr>";
  fDisp = totDisp;
  for (i = totDisp; i < (16 * 16); i++) {
   if (i % 16 == 0 && i != fDisp) {
    str += "</tr>";
    str += "<tr>";
   }
   str += "<td style=\"height:11px;width:11px;border: 1px solid buttonface; background-color:buttonface; font-size: 0px;\"";
   str += " onMouseOver=\"parent.CPArray['" + this.uID + "'].ShowColor(SafeColor_" + this.uID + ", SafeName_" + this.uID + ", this, '');\">" + String.fromCharCode(160) + "</td>";
  };
  str += "</tr>";
  str += "</table>";
  str += "</DIV>";
  return str;
 };
 this.ToggleColor = function( inCOLORON, inCOLOROFF, inCOLOROFF_2 )
 {
  inCOLORON.style.display = "";
  inCOLOROFF.style.display = "none";
  inCOLOROFF_2.style.display = "none";
 };
 this.ShowColor = function( inTDC, inTDT, inTD, inTXT)
 {
  var str = "";
  if (inTXT != "") {
   inTDT.innerHTML = inTD.style.backgroundColor.toUpperCase() + " " + inTXT;
  } else {
   inTDT.innerHTML = inTD.style.backgroundColor.toUpperCase().replace("BUTTONFACE", "");
  }
  inTDC.style.backgroundColor = inTD.style.backgroundColor;
 };
 this.DoColor = function( inCOLOR )
 {
  document.all[this.which].value = inCOLOR;
  this.which = null;
  this.open = null;
  this.oPopup.hide();
 };
 this.Show = function( inFORM, inPOS )
 {
  this.which = inFORM;
  this.open = inPOS;
  this.ShowMenu('ColorMenu_' + this.uID, 240, 320);
 };
 this.ShowMenu = function( inMENU, inW, inH)
 {
  var oPopBody = this.oPopup.document.body;
  var HTMLContent = eval(inMENU).innerHTML;
  oPopBody.innerHTML = HTMLContent;
  oPopBody.onselectstart = function() {return false;};
  oPopBody.ondragstart = function() {return false;};
  oPopBody.oncontextmenu = function() {return false;};
  if (this.open == "center") {
   var leftPos = (screen.availWidth - inW) / 2;
   var topPos = (screen.availHeight - inH) / 2;
   this.oPopup.show(leftPos, topPos, inW, inH, document.body);
  } else if (this.open == "bottom") {
   var lefter = event.clientX;
   var leftoff = event.offsetX;
   var topper = event.clientY;
   var topoff = event.offsetY;
   this.oPopup.show(lefter - leftoff - 2, topper - topoff + 22, inW, inH, document.body);
  } else if (this.open == "right") {
   var lefter = event.clientX;
   var leftoff = event.offsetX;
   var topper = event.clientY;
   var topoff = event.offsetY;
   this.oPopup.show(lefter - leftoff + 22, topper - topoff - 2, inW, inH, document.body);
  }
  return false;
 };
 this.Init = function()
 {
  var str = document.getElementById(inDIV).innerHTML;
  str += this.GetMenuColors();
  document.getElementById(inDIV).innerHTML = str;
 };
 this.Init();
};