/*
Example:
*/
function MyColorPicker(div_frame_id)
{
var me = this;
var cp_grid = [
["FFFFFF", "FFCCCC", "FFCC99", "FFFF99", "FFFFCC", "99FF99", "99FFFF", "CCFFFF", "CCCCFF", "FFCCFF"],
["CCCCCC", "FF6666", "FF9966", "FFFF66", "FFFF33", "66FF99", "33FFFF", "66FFFF", "9999FF", "FF99FF"],
["C0C0C0", "FF0000", "FF9900", "FFCC66", "FFFF00", "33FF33", "66CCCC", "33CCFF", "6666CC", "CC66CC"],
["999999", "CC0000", "FF6600", "FFCC33", "FFCC00", "33CC00", "00CCCC", "3366FF", "6633FF", "CC33CC"],
["666666", "990000", "CC6600", "CC9933", "999900", "009900", "339999", "3333FF", "6600CC", "993399"],
["333333", "660000", "993300", "996633", "666600", "006600", "336666", "000099", "333399", "663366"],
["000000", "330000", "663300", "663333", "333300", "003300", "003333", "000066", "330099", "330033"]];
// create and show color picking window besides picker object
//var color_frame = document.createElement("div");
var color_frame = document.getElementById(div_frame_id);
color_frame.style.backgroundColor = "#C0C0C0";
color_frame.style.width = "100px";
color_frame.style.height = "100px";
color_frame.style.zIndex = "100";
color_frame.style.position = "absolute";
color_frame.style.left = "0px";
color_frame.style.top = "0px";
color_frame.style.visibility = "hidden";
//color_frame.id = "zzzzzzzzzzzzz";
// this somehow brakes the html !!!!
//document.body.appendChild(color_frame);
//document.getElementById('contents').appendChild(color_frame);
// color table
var table = document.createElement("table");
table.setAttribute("border", "1");
table.style.backgroundColor = "#808080";
var tbody = document.createElement("tbody"); // IE 6 needs this.
var row = null, cell = null;
for (var y=0; y