var visible = 0; // is window visible
var overWindow = 0; // are we over the displayed window
var IE = document.all?true:false;

if (!IE) document.captureEvents(Event.MOUSEMOVE)
document.onmousemove = mouseMove;

function showWindow(comp, e){
	// test if window is visible
	if (visible == 1)
		tryHide(e.clientX, e.clientY, 1);
		
	// retrieve pointers to the 3 areas we need
	var imgDiv = document.getElementById('imgComponent');
	var headerDiv = document.getElementById('txtComponentName');
	var txtDiv = document.getElementById('txtComponent');
	var windowDiv = document.getElementById('componentView');
	
	// hold html text
	var newText = "";
	
	// determine component to show
	switch(comp){
		case 0: // cabinet
			imgDiv.src = "images/components/cabinets.jpg";
			headerDiv.innerHTML = "Cabinet";
			newText = "<font color=\"black\">";
			newText += "<ul class=\"componentView\"><li>Visually Attractive Durable Design. Will never rust or corrode.</li>";
			newText += "<li>U.V. resistant polymeric Materials that will never rust nor corrode.</li>";
			newText += "<li>one piece raised top features a molded fan venturi that begins at the top of the evaporator coil. This allows for maximum airflow over 100% of the coil surface, increasing efficiency even on the coldest days.</li>";
			newText += "<li>Unique 4 inch pedestal base keeps evaporator clean and out of harms way.</li>";
			newText += "<li>High strength plastic coil guard protects fins from impact and adds to the appearance of the unit.</li></ul>";
			newText += "</font>";
			txtDiv.innerHTML = newText;
			break;
		case 1: // compressor
			imgDiv.src = "images/components/compressor.jpg";
			headerDiv.innerHTML = "Compressor";
			newText = "<font color=\"black\">";
			newText += "<ul class=\"componentView\"><li><b>SCROLL</b> reciprocating compressors are proven reliable and durable. This compressor gives you the confidence that the compressor in your unit has the most proven track record in the industry.</li>";
			newText += "<li>These energy efficient compressors are standard on all Rome Heat Pump pool heaters.</li></ul>";
			newText += "</font>";
			txtDiv.innerHTML = newText;
			break;
		case 2: // Heat Exchanger
			imgDiv.src = "images/components/heat_exchanger.jpg";
			headerDiv.innerHTML = "Heat Exchanger";
			newText = "<font color=\"black\">";
			newText += "<ul class=\"componentView\"><li>Heat Exchanger features a lifetime warranty.</li></ul>";
			newText += "</font>";
			txtDiv.innerHTML = newText;
			break;
		case 3: // TurboFlow
			imgDiv.src = "images/components/heat_exchanger_inside.jpg";
			headerDiv.innerHTML = "Titanium Turbloflow Heat Exchanger";
			newText = "<font color=\"black\">";
			newText += "<ul class=\"componentView\"><li>Twisted tube gives 3 to 4  more times the surface area compared to standard round tube heat exchangers which equals more BTU/Hr heat transfer.</li>";
			newText += "<li>Coaxial design allows pool water and refrigerant to flow in opposing directions making it the most efficient titanium heat exchanger available.</li>";
			newText += "<li>Tenacious surface oxide layer makes it impervious to harsh pool chemicals.</li>";
			newText += "<li>Allows 100% water flow through heat exchanger, No water is bypassed.</li>";
			newText += "<li>Backed by limited LIFETIME Warranty.</li></ul>";
			newText += "</font>";
			txtDiv.innerHTML = newText;
			break;
		case 4: // Evaporator
			imgDiv.src = "images/blank.gif";
			headerDiv.innerHTML = "Evaporator";
			newText = "<font color=\"black\">";
			newText += "<ul class=\"componentView\"><li>The coated energy effiecient evaporator features internally rifled copper tubing and aluminum lanced fin design. The coil is fed by a thermostatic expansion valve with a brass body  and stainless steel diaphragm.  It is fed through eight separate feeder tubes.</li></ul>";
			newText += "</font>";
			txtDiv.innerHTML = newText;
			break;
		case 5: // Computer
			imgDiv.src = "images/components/board.jpg";
			headerDiv.innerHTML = "Micro Computer Control";
			newText = "<font color=\"black\">";
			newText += "<ul class=\"componentView\"><li>Powerful microcomputer control.</li>";
			newText += "<li>Push Button Operation.</li>";
			newText += "<li>Large LED Display.</li>";
			newText += "<li>Dual Pool/Spa Programmable Thermostat.</li>";
			newText += "<li>Displays temperature in Fahrenheit or Celcius.</li></ul>";
			newText += "</font>";
			txtDiv.innerHTML = newText;
			break;
	}
	
	// set location
	windowDiv.style.left = getX(e.clientX) + "px";
	windowDiv.style.top = getY(e.clientY) + "px";
	
	windowDiv.style.visibility = "visible";
	
	visible = 1;
}

function mouseMove(e){
	// if not visible then return
	if (visible == 0)
		return;
		
	// get pointer to window
	var windowDiv = document.getElementById('componentView');
	var mouseX;
	var mouseY;
	// get mouse locations
	if (IE)
		e = event
	
	// try to hide window when still overWindow = 1
	if (overWindow == 1){
		tryHide(e.clientX, e.clientY);	
	}
	
	// set location
	windowDiv.style.left = getX(e.clientX) + "px";
	windowDiv.style.top = getY(e.clientY) + "px";
}

function getX(mouseX){
	var divWidth = document.getElementById('componentView').offsetWidth;
	var screenWidth = document.body.clientWidth;
	var cursorLoc = mouseX + 15;
	
	if (cursorLoc + divWidth > screenWidth)
		cursorLoc = screenWidth - divWidth;
	
	return cursorLoc
}

function getY(mouseY){
	var divHeight = document.getElementById('componentView').offsetHeight;
	var screenHeight;
	var cursorLoc;
	
	// get offset
	if (!IE){
		screenHeight = window.innerHeight + window.pageYOffset;
		cursorLoc = mouseY + 15 + window.pageYOffset;
	}else{
		screenHeight = document.documentElement.offsetHeight + document.documentElement.scrollTop - 10;
		cursorLoc = mouseY + 15 + document.documentElement.scrollTop;
	}
	
	if (cursorLoc + divHeight > screenHeight)
		cursorLoc = screenHeight - divHeight;
	
	return cursorLoc
}

function checkOverWindow(mouseX, mouseY){
	var divWin = document.getElementById('componentView')
	
	if (mouseX >= divWin.offsetLeft && mouseX <= divWin.offsetLeft + divWin.offsetWidth){
		if (mouseY >= divWin.offsetTop && mouseY <= divWin.offsetTop + divWin.offsetHeight)
			return true;
	}
	
	return false;
}

function tryHide(mouseX, mouseY, forced){
	if (!forced && checkOverWindow(mouseX, mouseY) == true){
		overWindow = 1;
		return;
	}
	
	overWindow = 0;
		
	document.getElementById('componentView').style.visibility = "hidden";
	visible = 0;
}

// used only for event processing
function hideWindow(e){
	tryHide(e.clientX, e.clientY);
}