function clickSetColor(setcolor,setid,textorbg,togid,targetid) {

        if (textorbg=="bg") {
            changecolordiv(targetid,setcolor);
        }
        else if (textorbg=="border") {
            changebordercolordiv(targetid,setcolor);
        }
        else {
            changetextcolordiv(targetid,setcolor);
        }

        changecolordiv("colorbox"+togid,setcolor);

        document.getElementById(setid).value=setcolor;

        // hide the color table div
        hidediv("colortable"+togid);


}

function SetColor(setcolor,setid,textorbg,togid,targetid) {

        if (textorbg=="bg") {
            changecolordiv(targetid,setcolor);
        }
        else if (textorbg=="border") {
            changebordercolordiv(targetid,setcolor);
        }
        else {
            changetextcolordiv(targetid,setcolor);
        }

}

function closeColorTable(tablenum,textorbg,setid,targetid) {

    // get the color from the input box
    thiscolor = document.getElementById(setid).value;

    clickSetColor(thiscolor,setid,textorbg,tablenum,targetid);


    hidediv("colortable"+tablenum);

}

function openColorTable(tablenum) {

    // ensure all other color tables are hidden
    for (i=1;i<=ncolorboxes;i++) {
        hidediv("colortable"+i);
    }


    // ensure position of table is correct

        // find the position of the color box
        xpos = findPosX(document.getElementById("colorbox"+tablenum));
        ypos = findPosY(document.getElementById("colorbox"+tablenum));

        document.getElementById("colortable"+tablenum).style.position = 'absolute';
        document.getElementById("colortable"+tablenum).style.top  = (ypos+15)+'px';
        document.getElementById("colortable"+tablenum).style.left = xpos+'px';



    // open this color table
    showdiv("colortable"+tablenum);



}



//safe function to change the bg color of an element with a specified id
function changecolordiv(id,bgcolor) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.backgroundColor = bgcolor;
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.backgroundColor = bgcolor;
        }
        else { // IE 4
            document.all.id.backgroundColor = bgcolor;
        }
    }
}

//safe function to change the border color of an element with a specified id
function changebordercolordiv(id,bordercolor) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.borderColor = bordercolor;
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.borderColor = bordercolor;
        }
        else { // IE 4
            document.all.id.borderColor = bordercolor;
        }
    }
}

//safe function to change the text color of an element with a specified id
function changetextcolordiv(id,textcolor) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.color = textcolor;
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.color = textcolor;
        }
        else { // IE 4
            document.all.id.color = textcolor;
        }
    }
}

//safe function to change the font size of an element with a specified id
function changefontsize(id,fontsize) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.fontSize = fontsize+'px';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.fontSize = fontsize+'px';
        }
        else { // IE 4
            document.all.id.fontSize = fontsize+'px';
        }
    }
}

//safe function to change the font style of an element with a specified id
function changefontstyle(id,fontstyle) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.fontStyle = fontstyle;
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.fontStyle = fontstyle;
        }
        else { // IE 4
            document.all.id.fontStyle = fontstyle;
        }
    }
}

//safe function to change the font weight of an element with a specified id
function changefontweight(id,fontweight) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.fontWeight = fontweight;
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.fontWeight = fontweight;
        }
        else { // IE 4
            document.all.id.fontWeight = fontweight;
        }
    }
}

//safe function to change the font face of an element with a specified id
function changefontface(id,fontface) {

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.fontFamily = fontface;
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.fontFamily = fontface;
        }
        else { // IE 4
            document.all.id.fontFamily = fontface;
        }
    }
}



function hidediv(id) {
    //safe function to hide an element with a specified id
    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.display = 'none';
        document.getElementById(id).style.visibility = 'hidden';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.display = 'none';
            document.id.visibility = 'hidden';
        }
        else { // IE 4
            document.all.id.style.display = 'none';
            document.all.id.style.visibility = 'hidden';
        }
    }
}

function showdiv(id) {
    //safe function to show an element with a specified id
    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.display = 'block';
        document.getElementById(id).style.visibility = 'visible';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.display = 'block';
            document.id.visibility = 'visible';
        }
        else { // IE 4
            document.all.id.style.display = 'block';
            document.all.id.style.visibility = 'visible';
        }
    }

}


// -----------------------------
// div positions
// -----------------------------

function findPosX(obj)
{
    var curleft = 0;
    if (obj.offsetParent)
    {
        while (obj.offsetParent)
        {
            curleft += obj.offsetLeft
            obj = obj.offsetParent;
        }
    }
    else if (obj.x)
        curleft += obj.x;
    return curleft;
}

function findPosY(obj)
{
    var curtop = 0;
    if (obj.offsetParent)
    {
        while (obj.offsetParent)
        {
            curtop += obj.offsetTop
            obj = obj.offsetParent;
        }
    }
    else if (obj.y) {
        curtop += obj.y;

    }
    return curtop;
}

// -----------------------------
// Font Functions
// -----------------------------

function setFontSize(setid,selectid) {

    var fs=document.getElementById(selectid);
    var fontsize = fs.options[fs.selectedIndex].value;

    changefontsize(setid,fontsize);

}

function setFontStyle(setid,selectid) {

    var fs=document.getElementById(selectid);
    var fontstyle = fs.options[fs.selectedIndex].value;

    changefontstyle(setid,fontstyle);

}

function setFontWeight(setid,selectid) {

    var fs=document.getElementById(selectid);
    var fontweight = fs.options[fs.selectedIndex].value;

    changefontweight(setid,fontweight);

}

function setFontFace(setid,selectid) {

    var fs=document.getElementById(selectid);
    var fontface = fs.options[fs.selectedIndex].value;

    changefontface(setid,fontface);

}

// -----------------------------
// Create a color table function
// -----------------------------

function createColorTable(tablenum,inputid,textorbg,targetid) {

    // find the position of the color box
    xpos = findPosX(document.getElementById("colorbox"+tablenum));
    ypos = findPosY(document.getElementById("colorbox"+tablenum));

    // Color Scale
    document.write("<div id=\"colortable"+tablenum+"\" style=\"position:absolute;top:"+ypos+"px; left:"+xpos+"px; z-index: 300; visibility: hidden; background-color: #FFFFFF;layer-background-color: #FFFFFF; border: 1px none #FFFFFF;\">");
    document.writeln( "<TABLE border='1px' cellpadding='0' cellspacing='0' \" style=\"border: #999999; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px;\" >" ) ;


    document.write("<tr style=\"font-size: 12px; background-color: #EEEEEE; \">");
    document.write("  <td align=\"right\" colspan=\"31\"><a href=\"javascript:closeColorTable("+tablenum+",'"+textorbg+"','"+inputid+"','"+targetid+"')\"><img src=\"./images/close.gif\" width=\"16\" height=\"14\" border=\"0\" alt=\"Close Color Chooser\"></a></td>");
    document.write("</tr>");

    for( var i = 0 ; i < colorarray.length ; i++ ) {
        if( (i % 31) == 0 ) {
            document.write("\n<TR>");
        }
        document.write("<TD bgcolor=\"" + colorarray[i] + "\" style=\"font-size: 8px; width: 8px; border: #999999; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px;\">" +
                        "<A href=\'javascript:clickSetColor(\"" + colorarray[i] + "\",\""+inputid+"\",\""+textorbg+"\","+tablenum+",\""+targetid+"\");\' " +
                        "onMouseOver=\'SetColor(\"" + colorarray[i] + "\",\""+inputid+"\",\""+textorbg+"\","+tablenum+",\""+targetid+"\");\' style=\"text-decoration: none;\">" +
                        "<DIV style=\"width: 8px; height: 8px; cursor: hand;\">&nbsp;</DIV></A></TD>");
    }

    document.writeln( "</TABLE>" ) ;
    document.write("</div>");



}


function createColorArray() {

    var colordelim = "#FFFFFF|#CCFFFF|#CCCCFF|#CCCCFF|#CCCCFF|#CCCCFF|#CCCCFF|#CCCCFF|#CCCCFF|#CCCCFF|#CCCCFF|#FFCCFF|#FFCCCC|#FFCCCC|#FFCCCC|#FFCCCC|#FFCCCC|#FFCCCC|#FFCCCC|#FFCCCC|#FFCCCC|#FFFFCC|#CCFFCC|#CCFFCC|#CCFFCC|#CCFFCC|#CCFFCC|#CCFFCC|#CCFFCC|#CCFFCC|#CCFFCC|"+
                     "#CCCCCC|#99FFFF|#99CCFF|#9999FF|#9999FF|#9999FF|#9999FF|#9999FF|#9999FF|#9999FF|#CC99FF|#FF99FF|#FF99CC|#FF9999|#FF9999|#FF9999|#FF9999|#FF9999|#FF9999|#FF9999|#FFCC99|#FFFF99|#CCFF99|#99FF99|#99FF99|#99FF99|#99FF99|#99FF99|#99FF99|#99FF99|#99FFCC|"+
                     "#CCCCCC|#66FFFF|#66CCFF|#6699FF|#6666FF|#6666FF|#6666FF|#6666FF|#6666FF|#9966FF|#CC66FF|#FF66FF|#FF66CC|#FF6699|#FF6666|#FF6666|#FF6666|#FF6666|#FF6666|#FF9966|#FFCC66|#FFFF66|#CCFF66|#99FF66|#66FF66|#66FF66|#66FF66|#66FF66|#66FF66|#66FF99|#66FFCC|"+
                     "#999999|#33FFFF|#33CCFF|#3399FF|#3366FF|#3333FF|#3333FF|#3333FF|#6633FF|#9933FF|#CC33FF|#FF33FF|#FF33CC|#FF3399|#FF3366|#FF3333|#FF3333|#FF3333|#FF6633|#FF9933|#FFCC33|#FFFF33|#CCFF33|#99FF33|#66FF33|#33FF33|#33FF33|#33FF33|#33FF66|#33FF99|#33FFCC|"+
                     "#999999|#00FFFF|#00CCFF|#0099FF|#0066FF|#0000FF|#0000FF|#0000FF|#6600FF|#9900FF|#CC00FF|#FF00FF|#FF00CC|#FF0099|#FF0066|#FF0066|#FF0000|#FF3300|#FF6600|#FF9900|#FFCC00|#FFFF00|#CCFF00|#99FF00|#66FF00|#00FF00|#00FF00|#00FF00|#00FF66|#00FF99|#00FFCC|"+
                     "#666666|#00CCCC|#00CCCC|#0099CC|#0066CC|#0033CC|#0000CC|#3300CC|#6600CC|#9900CC|#CC00CC|#CC00CC|#CC00CC|#CC0099|#CC0066|#CC0033|#CC0000|#CC3300|#CC6600|#CC9900|#CCCC00|#CCCC00|#CCCC00|#99CC00|#66CC00|#33CC00|#00CC00|#00CC33|#00CC66|#00CC99|#00CCCC|"+
                     "#666666|#009999|#009999|#009999|#006699|#003399|#000099|#330099|#660099|#990099|#990099|#990099|#990099|#990099|#990066|#990033|#990000|#993300|#996600|#999900|#999900|#999900|#999900|#999900|#669900|#339900|#009900|#009933|#009966|#009999|#009999|"+
                     "#333333|#006666|#006666|#006666|#006666|#003366|#000066|#330066|#660066|#660066|#660066|#660066|#660066|#660066|#660066|#660033|#660000|#663300|#666600|#666600|#666600|#666600|#666600|#666600|#666600|#336600|#006600|#006633|#006666|#006666|#006666|"+
                     "#000000|#003333|#003333|#003333|#003333|#003333|#000033|#330033|#330033|#330033|#330033|#330033|#330033|#330033|#330033|#330033|#330033|#330000|#333300|#333300|#333300|#333300|#333300|#333300|#333300|#333300|#333300|#003300|#003333|#003333|#003333";

    var colorarray = colordelim.split( "|" ) ;

    return colorarray;

}