/****************************************************************************************
	 *	!!PopUp HTML Alt tags for HREFS														*
	 *	cchoyce 19 Feb 2000																	*
	 *	YOU MUST HAVE THIS TAG IN THE HEAD OF YOUR HTML DOCUMENT:							*
	 * 	<div ID="PopUpDiv" STYLE="position:absolute; visibility:hidden; z-index:1;"></div>	*
	 *	To call this from an href use the following in the 'A' tag							*
	 *	onMouseOver="showPopUp('This is the Text', 'this is the Heder')"					*
	 *	onMouseOut="hidePopUp()"															*
	 *	other documentation throughout the program											*
	 ****************************************************************************************/
	
		/*	These are the config variables. There must be a parameter unless otherwise noted.
		 *	If a parameter is optional, just leave its value as an empty string ("") if you don't
		 *	want to use it.
		 */
//-------------- START VARIABLE CONFIG ----------

		//set the Modes
		var MenusMoveWithMouse = false;		//this determines whether the menus move with onMousemove

		var MenusHaveFixedPosition = false;	//this determines whether the menus position is static or dynamic
			//these are only when FixedPosition is 'true'
			var FixedX	= 165; //static X position of the PopUp
			var FixedY	= 20;	//static Y position of the PopUp
		
		//used if you want all the links to display the same thing
		//just don't pass in a text string in the call 'to showPopUp()'
		var DefaultText		= "(<i>No Description</i>)";

		var MainBGColor		= "#FFFFFF";
		var BorderColor		= "#C15E55";
		var BorderWidth		= "1";
		var Width			= "350";	//optional

		var FontColor		= "#000000";
		var FontFace		= "Verdana";
		var FontSize		= "1";
		var FontAlign		= "left";	// either 'left', 'center', or 'right'
										// set to left by default HTML standards
		
		var HeaderFontColor	= "#FFFFFF";
		var HeaderFontFace	= "Verdana";
		var HeaderFontSize	= "2";
		var HeaderBGColor	= "#0D2320";
		var HeaderFontAlign	= "";	// either 'left', 'center', or 'right'
										// set to left by default HTML standards

		var HeaderIcon		= ""; //optional

		//how much to offset the popup window from the cursor	
		var OffsetX			= 17;
		var OffsetY			= -4;

		var Align			= "";	//either 'right','center', of 'left'
										//if you leave it empty, it will defualt to right
										//you can only use center and left if you specify a width
		var Valign			= "bottom";	//either 'top' or 'bottom'
										//if you leave it empty, it will defualt to bottom
//-------------- END VARIABLE CONFIG ----------

		/*	DON'T MODIFY ANY OF THESE GLOBAL VARIABLES!!!
		 *	THEY ARE USED IN THE RUNTIME AND THE PROGRAM WILL CRASH IF THEY ARE CHANGED
		 */

//------------- START RUNTIME VARIABLES --------

		// Display state variables
		var posX = 0;
		var posY = 0;

		//whether our layer can be seen or not
		var isVisible = false;
		
		// Decide browser version
		var ns4 = (document.layers)?true:false;
		var	ie4 = (document.all)?true:false;
		
		//used to capture the mouse movement and get the screen coridants	
		if ( ns4 || ie4  )
		{
			document.onmousemove = mouseMove; //note we have no function '()' here. this is correct
			if (ns4)
				document.captureEvents(Event.MOUSEMOVE)
		}
		else
			showPopUp = noPopUp; //redefine the function for older browsers

//------------- END RUNTIME VARIABLES --------

		/*	This is the start of the functions.
		 *	You must call showPopUp()' from some javascript call in the document
		 */

//------------- START MAIN FUNCTIONS --------

		/**
		 * noPopUp()
		 *	dummy function for older browsers ( ver < 4 )
		 */
		function noPopUp()
		{
			return true;
		}

		/**
		 * showPopUp()
		 *	shows the given layer on the screen
		 *	@param Text:
		 *		The Text that is to be displayed in the PopUp
		 *	@param Header:	(optional)
		 *		The Header that will be displayed above the Text
		 */
		function showPopUp( Text, Header )
		{
			if( Text == "" )
				Text = DefaultText;
		
			//create the HTML for the popup layer
			var layerHtml = "";
			if( Header == null )
				layerHtml = makePopUp( Text );
			else
				layerHtml = makePopUpWithHeader( Text, Header );

			//insert the html into our layer
			insertLayerHTML( openTable() + layerHtml + closeTable() );

			//move the layer to the proper spot
			positionLayerOnScreen()

			//lets see it
			setLayerToVisible();
		}	

//------------- END MAIN FUNCTIONS --------


//------------- START LAYER MODIFICATION FUNCTIONS --------

		/**
		 * insertLayerHTML()
		 *	inserts html code inside of the 'DIV' tag in the document header
		 *	@param Html:
		 *		The HTML that is going to be inserted
		 */
		function insertLayerHTML( Html )
		{
		   if (ns4)
			{
				var layer = top.bottom.PopUpDiv.document;
				layer.write( Html );
				layer.close();
			}
		   else if (ie4)
				document.all['PopUpDiv'].innerHTML = Html;
		}

		/**
		 * positionLayerOnScreen()
		 *	determine the coorinates of the top left corner of the layer
		 *	algorythm will change depending on the alignment type
		 */
		function positionLayerOnScreen()
		{
			var X=0, Y=0;
		
			if (parseInt(navigator.appVersion)>3) {
				if (navigator.appName=="Netscape") {
					winW = window.innerWidth;
					winH = window.innerHeight;
				}
				if (navigator.appName.indexOf("Microsoft")!=-1) {
					winW = document.body.offsetWidth;
					winH = document.body.offsetHeight;
				}
			}
			
			if( MenusHaveFixedPosition )
			{
				//just use the predefinded positions
				X = FixedX;// + OffsetX;
				Y = FixedY;// + OffsetY;
			}
			else
			{								
				if( Align == "left" && Width != "")
					X = posX - OffsetX - Width;
				else if ( Align == "center" && Width != "")
					X = posX + OffsetX - (Width/2);
				else
					X = posX + OffsetX;
	
				if( Valign == "top" )
					Y = posY - OffsetY;
				else
					Y = posY + OffsetY;
					
				/*
				if (calpoptable.clientWidth + X > winW)
					X -= calpoptable.clientWidth;
				if (calpoptable.clientHeight + Y > winH)
					Y -= calpoptable.clientHeight;
				*/
			}

			// Actually move the object.
			if( ( MenusMoveWithMouse || !(isVisible) ) )
				moveTo(X, Y);
		}

		/**
		 * moveTo()
		 *	this takes in an 'X' and a 'Y' coordinate and moves
		 *	the layer to that position.
		 *	called from the 'onMousemove' event that is inherant to the browser
		 */
		function moveTo(Xval,Yval)
		{
			if( ns4 )
			{
				self.document.PopUpDiv.left = Xval;
				self.document.PopUpDiv.top	= Yval;
			}
			if( ie4 )
			{
				document.all['PopUpDiv'].style.left	= Xval;
				document.all['PopUpDiv'].style.top	= Yval;
			}
		}
		
		/**
		 * setLayerToVisible()
		 *	this makes the layer visible to the user
		 */
		function setLayerToVisible()
		{
			if( ns4 )
				self.document.PopUpDiv.visibility = "show";
			if( ie4 )
				document.all['PopUpDiv'].style.visibility = "visible";
			
			//tell us that we are currently viewing the layer
			isVisible = true;
		}
		
		/**
		 * hidePopUp()
		 *	this hides the popup window from the user
		 *	called from the 'onMousemove' event that is inherant to the browser
		 */
		function hidePopUp()
		{
			if ( ns4 )
				self.document.PopUpDiv.visibility = "hide";
			else if (ie4)
				document.all['PopUpDiv'].style.visibility = "hidden";

			//tell us that the layer is now hidden
			isVisible = false;
		}		
//------------- END LAYER MODIFICATION FUNCTIONS --------		


//------------- START HTML GENEREATION FUNCTIONS --------

		/**
		 * openTable()
		 *	generates the opening HTML for the border table
		 */
		function openTable()
		{
			var l_Width = "";
			if( Width != "" )
				l_Width = " Width='" + Width + "' ";
			var html =	"<table " + l_Width + " border=0 cellpadding='" + BorderWidth +"' cellspacing=0 bgcolor='" + BorderColor + "' style='filter:alpha(opacity=70, enabled=0)'>\n" + 
						"	<tr>\n" + 
						"		<td>\n" + 
						"			<table width=100% border=0 cellpadding=2 cellspacing=0>\n";
			return html;
		}
		
		/**
		 * closeTable()
		 *	generates the closing HTML for the border table
		 */
		function closeTable()
		{
			var html =	"			</table>\n" + 
						"		</td>\n" + 
						"	</tr>\n" + 
						"</table>\n";
							
			return html;
		
		}

		/**
		 * makePopUp()
		 *	generates the HTML for the inner table given the passed in text string
		 *	@param Text:
		 *		the string that is passed in from the origanl 'displayPopUp()' call
		 */
		function makePopUp( Text )
		{
			var l_Align = "";
			if ( FontAlign != "" )
				l_Align	= "align='" + FontAlign + "' ";

			html =	"			<tr bgcolor='" + MainBGColor + "'>" + 
					"					<td valign=top " + l_Align + " colspan=2 align=center>" + 
											"<font face='" + FontFace + "' COLOR='" + FontColor + "' SIZE='" + FontSize + "'>" +  Text + "</font>" +
										"</td>" + 
					"				</tr>";
			return html;
		}	

		/**
		 * makePopUpWithHeader()
		 *	generates the HTML for the header table given the passed in Header string
		 *	@param Text:
		 *		a string that is passed in from the origanl 'displayPopUp()' call.
		 *		used for the main text about the href.
		 *	@param Header:
		 *		a string that is passed in from the origanl 'displayPopUp()' call.
		 *		used for a header on the popup. has its own attributes seperate from the text.
		 *	@param Header2: (optinal)
		 *		a string that is passed in from the origanl 'displayPopUp()' call.
		 *		used for a header on the popup. aligned right in the header cell.
		 */
		function makePopUpWithHeader(Text, Header, Header2)
		{
			var l_HeaderIcon = "";
			if ( HeaderIcon != "" )
				l_HeaderIcon	= "<IMG SRC='" + HeaderIcon + "'> ";

			var l_Align = "";
			if ( HeaderFontAlign != "" )
				l_Align	= " align='" + HeaderFontAlign + "'";
			
			var l_Header2 = "<a href='javascript:hidePopUp()'>X</a>";
			
			html =	"				<tr bgcolor='" + HeaderBGColor + "'>\n" + 
					"					<td " + l_Align + "><b><FONT FACE='" + HeaderFontFace + "' COLOR='" + HeaderFontColor +"' SIZE='" + HeaderFontSize + "'>" + l_HeaderIcon + Header + "</font></b></TD>\n" +
					"					<td align='right'><b><FONT FACE='" + HeaderFontFace + "' COLOR='" + HeaderFontColor +"' SIZE='" + HeaderFontSize + "'>" +  l_Header2 + "</font></b></TD>\n" + 
					"				</tr>\n ";
			//now add the regular PopUp Below the Header
			html += makePopUp( Text );
		
			return html;
		}		

//------------- END LAYER MODIFICATION FUNCTIONS --------


//------------- START EVENT HANDLERS --------

		/**
		 * mouseMove()
		 *	this is called whenever there is mouse movement.
		 *	it is called by the document, set by the 'document.onmousemove = mouseMove;'
		 *	statement in the INIT section. no need to call it after that
		 *	@param e:
		 *		the event that has just taken place. it will always be the cursor
		 */
		function mouseMove(e)
		{
			if ( ns4 )
			{
				posX	= e.pageX;
				posY	= e.pageY;
			}
			else if ( ie4 )
			{
				posX	= event.clientX + self.document.body.scrollLeft;
				posY	= event.clientY + self.document.body.scrollTop;
			}
			if( isVisible )
				positionLayerOnScreen();
		}
//------------- END EVENT HANDLERS --------