/*
 * x, y = coordinates
 * w,h = width, height
 * point = direction of pointer ( 0 for none or 1-4 )
 * str = html to display in the bubble
*/
function speechBubble( x, y, w, h, point, str )
{
    var imgBASE = "images/";

    document.write( '<div style="position: absolute; top: ' + y + 'px; left: ' + x + 'px; z-index: 98">' );
    document.write( '<table width="' + w + '" height="' + h + '" border="0" cellspacing="0" cellpadding="0" style="font-size: 10pt">' );
    document.write( '<tr><td width="8" height="8"><img src="' + imgBASE + 'corner-ul.gif"/></td>' );
    document.write( '<td width="100%" height="8" style="background-image: url(' + imgBASE + 'top.gif); background-repeat: repeat-x"></td>' );
    document.write( '<td width="8" height="8"><img src="' + imgBASE + 'corner-ur.gif"/></td></tr>' );
    document.write( '<tr><td width="8" height="100%" style="background-image: url(' + imgBASE + 'left.gif); background-repeat: repeat-y"></td>' );
    document.write( '<td width="100%" height="100%" bgcolor="#fea750" valign="top">' );
    document.write( str );
    document.write( '</td><td width="8" height="100%" style="background-image: url(' + imgBASE + 'right.gif); background-repeat: repeat-y"></td></tr>' );
    document.write( '<tr><td width="8" height="8"><img src="' + imgBASE + 'corner-ll.gif"/></td>' );
    document.write( '<td width="100%" height="8" style="background-image: url(' + imgBASE + 'bottom.gif); background-repeat: repeat-x"></td>' );
    document.write( '<td width="8" height="8"><img src="' + imgBASE + 'corner-lr.gif"/></td>' );
    document.write( '</tr></table>' );
    document.write( '</div>' ); 

	   var pointX, pointY, pointIMG;

    if ( point == undefined || point == '0' )
          return;
    else if ( point == '1' )
    {
          pointX = x;
          pointY = y-25;
    }
    else if ( point == '2' )
    {
          pointX = x+w-30;
          pointY = y-25;
    }
    else if ( point == '3' )
    {
          pointX = x+w-30;
          pointY = y+h-2;
    }
    else if ( point == '4' )
    {
          pointX = x;
          pointY = y+h-2;
    }
    else if ( point == '5' )
    {
        pointX = x;
        pointY = y-25;

        document.write( '<div style="position: absolute; top: ' + pointY + 'px; left: ' + pointX + 'px; z-index: 99"><img src="' + imgBASE + "point1.gif" + '"/></div>' );

        pointX = x+w-30;
        pointY = y-25;

        document.write( '<div style="position: absolute; top: ' + pointY + 'px; left: ' + pointX + 'px; z-index: 99"><img src="' + imgBASE + "point2.gif" + '"/></div>' );
    }

    pointIMG = imgBASE + "point" + point + ".gif";
    if (point < 5)
    {
        document.write( '<div style="position: absolute; top: ' + pointY + 'px; left: ' + pointX + 'px; z-index: 99"><img src="' + pointIMG + '"/></div>' );
    }
}                          

function showDiv(objectID) {
var theElementStyle = document.getElementById(objectID);

if(theElementStyle.style.display == "none")
{
theElementStyle.style.display = "block";
}
else
{
theElementStyle.style.display = "none";
}
}