// images X and Y Offset from cursor position in pixels
var OffSetFromMouseX = 15;
var OffSetFromMouseY = 0;

// duration in seconds the image should remain visible. 0 for always
var DisplayDuration = 0;

// maximum image size 
var CurrentImageHeight = 250;

// create the div tag
if ( document.getElementById || document.all ) 
{
	document.write ( '<div Id = "PopUpImage" style = "visibility:hidden; z-index:1; display:block;">');
	document.write ( '</div>' );
}

function GetPopUpObject () 
{
	if ( document.getElementById ) 
	{
		return document.getElementById("PopUpImage").style;
	}
	else if ( document.all ) 
	{
		return document.all.PopUpImage.style;
	}	
}

function GetPopUpObjectWithoutStyle () 
{
	if ( document.getElementById ) 
	{
		return document.getElementById("PopUpImage");
	}
	else if ( document.all ) 
	{
		return document.all.PopUpImage;
	}
}

function IsBody()
{
	return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}


function MouseOnFollow ( e ) 
{
	var PositionX = OffSetFromMouseX;
	var PositionY = OffSetFromMouseY;
	
	var documentWidth = document.all ? IsBody().scrollLeft + IsBody().clientWidth : pageXOffset + window.innerWidth - 15
	var documentHeight = document.all ? Math.min( IsBody().scrollHeight, IsBody().clientHeight) : Math.min(window.innerHeight)
	
	if ( typeof e != "undefined" ) 
	{
		if ( documentWidth - e.pageX < 300) 
		{
			PositionX = e.pageX - PositionX - 286; // Move to the left side of the cursor
		}
		else 
		{
			PositionX += e.pageX;
		}
		
		if ( documentHeight - e.pageY < ( CurrentImageHeight + 10 )) 
		{
			PositionY += e.pageY - Math.max (0, ( 10 + CurrentImageHeight + e.pageY - documentHeight - IsBody().scrollTop));
		}
		else 
		{
			PositionY += e.pageY;
		}
		
	}
	else if ( typeof window.event != "undefined" ) 
	{
		if ( documentWidth - event.clientX < 300) 
		{
			PositionX = event.clientX + IsBody().scrollLeft - PositionX - 286; // Move to the left side of the cursor
		}
		else 
		{
			PositionX += IsBody().scrollLeft + event.clientX;
		}
		
		//alert ( documentHeight + " - " + CurrentImageHeight + " - " + event.clientY);
		if ( documentHeight - event.clientY < ( CurrentImageHeight + 110 )) 
		{
			PositionY += event.clientY + IsBody().scrollTop - Math.max ((event.clientY - CurrentImageHeight/2), ( 110 + CurrentImageHeight - event.clientY - documentHeight ));
		}
		else 
		{
			PositionY += IsBody().scrollTop +  event.clientY;
		}
	
	}
	
	var documentWidth = document.all ? IsBody().scrollLeft + IsBody().clientWidth : pageXOffset + window.innerWidth - 15
	var documentHeight = document.all ? Math.max( IsBody().scrollHeight, IsBody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight)
	
	if ( PositionY < 0 ) 
	{
		PositionY = PositionY*-1;
	}
	
	GetPopUpObject().left = PositionX + "px";
	GetPopUpObject().top = PositionY + "px";
}

function ShowPopUp ( ImageName ) 
{
	document.onmousemove = MouseOnFollow;
	
	newHTML = '<div style = "padding: 5px; background-color: #FFFFFF; border: 1px solid #888888;">';
	newHTML += '<div align="center" style="padding: 0px 0px 0px 0px;"><img src="' + ImageName + '" border="0"></div>';
	newHTML += '</div>';
	
	GetPopUpObjectWithoutStyle().innerHTML = newHTML;
	
	// set style 
	GetPopUpObject().visibility="visible";
	GetPopUpObject().display = 'block';
	GetPopUpObject().position = 'absolute';
}

function HidePopUp ( ) 
{
	GetPopUpObject().visibility="hidden";
	document.onmousemove = "";
	GetPopUpObject().left="-500px"
}