function ProductExplorerHide()
{
	if (!document.getElementById)
	{
		alert("Your web browser will not properly display Product Explorer modules.");
		return;
	}
	
	var mainPageElement = document.getElementById("tblMain");
	mainPageElement = (mainPageElement == null)
		? document.body
		: mainPageElement;

	var peScrollableElement = document.getElementById("ProductExplorerScrollable");
	var peClientElement = document.getElementById("ProductExplorerClient");

	SetElementVisibility(peClientElement, "hidden");
	SetElementVisibility(peScrollableElement, "hidden");
	
	// now this property is set inline since it is not available in AcsysDhtml.js
	peClientElement.style.display = "none";
	peScrollableElement.style.display = "none";
	SetElementOpacity(mainPageElement, 100);
}

function ProductExplorerShow()
{
	if (!document.getElementById)
	{
		alert("Your web browser will not properly display Product Explorer modules.");
		return;
	}
	
	var peScrollableElement = document.getElementById("ProductExplorerScrollable");
	var peClientElement = document.getElementById("ProductExplorerClient");
	
	if (!peScrollableElement || !peClientElement || !window['productExplorerLinkImage'])
	{
		alert("Unable to display product explorer at this time.  Try again later.")
		return;
	}
	
	var peLinkImage = document.getElementById(window['productExplorerLinkImage']);
	var mainPageElement = document.getElementById("tblMain");
	mainPageElement = (mainPageElement == null)
		? document.body
		: mainPageElement;

	// now this property is set inline since it is not available in AcsysDhtml.js
	peClientElement.style.display = "";
	peScrollableElement.style.display = "";

	var iScrollableWidth = GetDocumentWidth();
	var iScrollableHeight = GetDocumentHeight();
	var peElementWidth = GetElementWidth(peClientElement);
	var peElementHeight = GetElementHeight(peClientElement);
	var peLinkImageWidth = GetElementWidth(peLinkImage);
	var peLinkImageHeight = GetElementHeight(peLinkImage);
	var peLinkImageX = GetElementPageX(peLinkImage);
	var peLinkImageY = GetElementPageY(peLinkImage);
	var centerX = peLinkImageX + parseInt(peLinkImageWidth/2);
	var centerY = peLinkImageY + parseInt(peLinkImageHeight/2);

/*
	var xMoveTo = (iScrollableWidth > peElementWidth)
		? parseInt((iScrollableWidth - peElementWidth)/2)
		: 0; // based on width
	var yMoveTo = (iScrollableHeight > peElementHeight)
		? parseInt((iScrollableHeight - peElementHeight)/2)
		: 0; // based on height
*/
	var xMoveTo = centerX - parseInt(peElementWidth/2);
	// var yMoveTo = centerY - parseInt(peElementHeight/2);
	var yMoveTo = centerY - parseInt(peElementHeight * 0.80);
		
	// set the width of the scrollable area element to achieve a "modal window"
	SetElementWidth(peScrollableElement, iScrollableWidth);
	SetElementHeight(peScrollableElement, iScrollableHeight);

	// set the width of the client element
	
	MoveElementTo(peScrollableElement, 0, 0);
	MoveElementTo(peClientElement, xMoveTo, yMoveTo);

	SetElementOpacity(peScrollableElement, 100);
	SetElementOpacity(peClientElement, 100);
	SetElementZIndex(mainPageElement, 10);
	SetElementZIndex(peClientElement, 1000);
	SetElementZIndex(peScrollableElement, 100);
	SetElementVisibility(peClientElement, "visible");
	SetElementVisibility(peScrollableElement, "visible");
	SetElementOpacity(mainPageElement, 25);
	peClientElement.focus();
}

function SetElementOpacity(element, opacity) { 
	var object = element.style; 
	object.opacity = (opacity / 100); 
	object.MozOpacity = (opacity / 100); 
	object.KhtmlOpacity = (opacity / 100); 
	object.filter = "alpha(opacity=" + opacity + ")";
}

