/***********************************************
* Image w/ description tooltip- By Dynamic Web Coding (www.dyn-web.com)
* Copyright 2002-2007 by Sharon Paine
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

/* IMPORTANT: Put script after tooltip div or 
	 put tooltip div just before end body code. */

var dom = (document.getElementById) ? true : false;
var ns5 = (!document.all && dom || window.opera) ? true: false;
var ie5 = ((navigator.userAgent.indexOf("MSIE")>-1) && dom) ? true : false;
var ie4 = (document.all && !dom) ? true : false;
var nodyn = (!ns5 && !ie4 && !ie5 && !dom) ? true : false;

var origWidth, origHeight;

// avoid error of passing event object in older browsers
if (nodyn) { event = "nope" }

///////////////////////  CUSTOMIZE HERE   ////////////////////
// settings for tooltip 
// Do you want tip to move when mouse moves over link?
var tipFollowMouse= true;	
// Be sure to set tipWidth wide enough for widest image
var tipWidth= 400;
var offX= 20;	// how far from mouse to show tip
var offY= 12; 
var tipFontFamily= "Verdana, arial, helvetica, sans-serif";
var tipFontSize= "8pt";
// set default text color and background color for tooltip here
// individual tooltips can have their own (set in messages arrays)
// but don't have to
var tipFontColor= "#000000";
var tipBgColor= "#DDECFF"; 
var tipBorderColor= "#000080";
var tipBorderWidth= 2;
var tipBorderStyle= "ridge";
var tipPadding= 4;

// tooltip content goes here (image, description, optional bgColor, optional textcolor)
var messages = new Array();
// multi-dimensional arrays containing: 
// image and text for tooltip
// optional: bgColor and color to be sent to tooltip

messages[0] = new Array('images/spacer.gif','<strong>THE "BRUTE" MARINE BILGE OIL WATER SEPARATOR</strong><br />Workboats, Ships, Shoreside, Offshore Oil Platforms, Port Facilities.<br />USCG/Canada CG Certified ABS/BV Type Approval.<br />Meets IMO/MEPC 107(49) or IMO/MEPC 60(33). Bilge Oil Water Separators Removal Systems are industrial marine grade oil water separators that have a variety of applications. Fully US Coast Guard certified with vessels and piping in the standard oil water separator unit being constructed from carbon steel to ASME specifications and are coated with an industrial strength epoxy coating.<br />CALL 314&#8211;579&#8211;9755 FOR MORE INFORMATION!','#ffffff');

messages[1] = new Array('images/spacer.gif','<strong>TYPE II MSD MARINE SANITATION DEVICE</strong><br />TheTankMSD type ll MSD is a USCG Approved Type II Marine Sanitation Device sewage treatment system. This Marine Sanitation Device is compatible with the upstream equipment found on many workboats and ships. Due to the relatively small footprint and design engineering meant to allow an easy retrofit, hookup and connection, this compact design can be used virtually anywhere for a new installation or as a replacement for almost any existing unit. If you want to replace just the Marine Sanitation Device - treatment system component, this is a great choice and extremely easy to install/work with. CALL 314&#8111;579&#8211;9755 FOR MORE INFORMATION!','#ffffff');

messages[2] = new Array('images/floating_oil_skimmer_home2.jpg','<strong>OIL SKIMMERS FOR FLOATING OIL</strong><br />Our oil skimmers are used extensively in the steel, manufacturing, and petroleum industries as well as power plants across the world. We have almost ALL technologies known to man, for skimming floating oils, fuels, fats and grease from the surface of water. Our floating weir type skimmers are also used for skimming floating ash, plastic, scum, floc, duck weed, algae and water meal from water impoundments. We build systems to specifically address your problem through the use of our specialty, existing, unique and innovative technologies or equipment that can be used off the shelf or modified, configured or otherwise packaged, to fit your specific needs. CALL 314&#8211;579&#8211;9755 FOR MORE INFORMATION!','#ffffff');

messages[3] = new Array('images/spacer.gif','<strong>BILGEVAP MARINE WATER EVAPORATOR</strong><br /><font color="#c00000"><strong>NO DISCHARGE ZONE? ZERO LIQUID DISCHARGE!</font></strong><br />Skimoil&#8217;s BilgeVAP is a partial answer to the marine waste water management requirements presented by the new EPA enforcement of the Clean Water Act. The BilgeVAP by Skimoil evaporates away the water portion of oily bilge water, gray water and even treated black water coming off of Marine Sanitation Devices (MSD) allowing workboats, barges and even shore facilities to become no discharge zones. Bilge water, gray water, treated black water! GONE!<br />CALL 314&#8211;579&#8211;9755 FOR MORE INFORMATION!','#ffffff');

messages[4] = new Array('images/spacer.gif','<strong>MARINEVAP MV8 MARINE WATER EVAPORATOR</strong><br /><font color="#c00000"><strong>NO DISCHARGE ZONE? ZERO LIQUID DISCHARGE!</strong></font><br />Skimoil&#8217;s zero liquid discharge MarineVAP MV8 system is a completely marinized, simple device and the logical successor to the Skimoil BilgeVAP that has been successfully used for years to eliminate oily bilge water on coastal and inland waterways workboats. Our technology is mature and has been well proven, and now the materials and controls are even better.<br />CALL 314&#8211;579&#8211;9755 FOR MORE INFORMATION!','#ffffff');




////////////////////  END OF CUSTOMIZATION AREA  ///////////////////

// preload images that are to appear in tooltip
// from arrays above
if (document.images) {
	var theImgs = new Array();
	for (var i=0; i<messages.length; i++) {
  	theImgs[i] = new Image();
		theImgs[i].src = messages[i][0];
  }
}

// to layout image and text, 2-row table, image centered in top cell
// these go in var tip in doTooltip function
// startStr goes before image, midStr goes between image and text
var startStr = '<table width="' + tipWidth + '"><tr><td align="center" width="100%"><img src="';
var midStr = '" border="0"></td></tr><tr><td valign="top">';
var endStr = '</td></tr></table>';

////////////////////////////////////////////////////////////
//  initTip	- initialization for tooltip.
//		Global variables for tooltip. 
//		Set styles
//		Set up mousemove capture if tipFollowMouse set true.
////////////////////////////////////////////////////////////
var tooltip, tipcss;
function initTip() {
	if (nodyn) return;
	tooltip = (ie4)? document.all['tipDiv']: (ie5||ns5)? document.getElementById('tipDiv'): null;
	tipcss = tooltip.style;
	if (ie4||ie5||ns5) {	// ns4 would lose all this on rewrites
		tipcss.width = tipWidth+"px";
		tipcss.fontFamily = tipFontFamily;
		tipcss.fontSize = tipFontSize;
		tipcss.color = tipFontColor;
		tipcss.backgroundColor = tipBgColor;
		tipcss.borderColor = tipBorderColor;
		tipcss.borderWidth = tipBorderWidth+"px";
		tipcss.padding = tipPadding+"px";
		tipcss.borderStyle = tipBorderStyle;
	}
	if (tooltip&&tipFollowMouse) {
		document.onmousemove = trackMouse;
	}
}

window.onload = initTip;

/////////////////////////////////////////////////
//  doTooltip function
//			Assembles content for tooltip and writes 
//			it to tipDiv
/////////////////////////////////////////////////
var t1,t2;	// for setTimeouts
var tipOn = false;	// check if over tooltip link
function doTooltip(evt,num) {
	if (!tooltip) return;
	if (t1) clearTimeout(t1);	if (t2) clearTimeout(t2);
	tipOn = true;
	// set colors if included in messages array
	if (messages[num][2])	var curBgColor = messages[num][2];
	else curBgColor = tipBgColor;
	if (messages[num][3])	var curFontColor = messages[num][3];
	else curFontColor = tipFontColor;
	if (ie4||ie5||ns5) {
		var tip = startStr + messages[num][0] + midStr + '<span style="font-family:' + tipFontFamily + '; font-size:' + tipFontSize + '; color:' + curFontColor + ';">' + messages[num][1] + '</span>' + endStr;
		tipcss.backgroundColor = curBgColor;
	 	tooltip.innerHTML = tip;
	}
	if (!tipFollowMouse) positionTip(evt);
	else t1=setTimeout("tipcss.visibility='visible'",100);
}

var mouseX, mouseY;
function trackMouse(evt) {
	standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body //create reference to common "body" across doctypes
	mouseX = (ns5)? evt.pageX: window.event.clientX + standardbody.scrollLeft;
	mouseY = (ns5)? evt.pageY: window.event.clientY + standardbody.scrollTop;
	if (tipOn) positionTip(evt);
}

/////////////////////////////////////////////////////////////
//  positionTip function
//		If tipFollowMouse set false, so trackMouse function
//		not being used, get position of mouseover event.
//		Calculations use mouseover event position, 
//		offset amounts and tooltip width to position
//		tooltip within window.
/////////////////////////////////////////////////////////////
function positionTip(evt) {
	if (!tipFollowMouse) {
		standardbody=(document.compatMode=="CSS1Compat")? document.documentElement : document.body
		mouseX = (ns5)? evt.pageX: window.event.clientX + standardbody.scrollLeft;
		mouseY = (ns5)? evt.pageY: window.event.clientY + standardbody.scrollTop;
	}
	// tooltip width and height
	var tpWd = (ie4||ie5)? tooltip.clientWidth: tooltip.offsetWidth;
	var tpHt = (ie4||ie5)? tooltip.clientHeight: tooltip.offsetHeight;
	// document area in view (subtract scrollbar width for ns)
	var winWd = (ns5)? window.innerWidth-20+window.pageXOffset: standardbody.clientWidth+standardbody.scrollLeft;
	var winHt = (ns5)? window.innerHeight-20+window.pageYOffset: standardbody.clientHeight+standardbody.scrollTop;
	// check mouse position against tip and window dimensions
	// and position the tooltip 
	if ((mouseX+offX+tpWd)>winWd) 
		tipcss.left = mouseX-(tpWd+offX)+"px";
	else tipcss.left = mouseX+offX+"px";
	if ((mouseY+offY+tpHt)>winHt) 
		tipcss.top = winHt-(tpHt+offY)+"px";
	else tipcss.top = mouseY+offY+"px";
	if (!tipFollowMouse) t1=setTimeout("tipcss.visibility='visible'",100);
}

function hideTip() {
	if (!tooltip) return;
	t2=setTimeout("tipcss.visibility='hidden'",100);
	tipOn = false;
}

document.write('<div id="tipDiv" style="position:absolute; visibility:hidden; z-index:100"></div>')

