/*===============================================================================
' CityShop Portal 
'===============================================================================
' Copyright © studio Netsouls Pvt. Ltd. All rights reserved.
' All rights reserved.
' THIS CODE AND INFORMATION IS PROVIDED "AS IS" WITHOUT WARRANTY
' OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT
' LIMITED TO THE IMPLIED WARRANTIES OF MERCHANTABILITY AND
' FITNESS FOR A PARTICULAR PURPOSE.
'
' The purpose of this havascript is to show the div large image of the 
' product in view on mouseover
'===============================================================================*/

// images X and Y Offset from cursor position in pixels
var OffSetFromMouseX = 0;
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 < 500) 
		{
			PositionX = e.pageX - PositionX - 286; // Move to the left side of the cursor
			PositionX -= 0;
		}
		else 
		{
			PositionX += e.pageX;
			PositionX += 20;
		}
		
		if ( (documentHeight - e.pageY )< ( 250)) 
		{
			PositionY += e.pageY - Math.max (0, ( 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 ( "DH=" + documentHeight + " - CI=" + CurrentImageHeight + " - CY=" + event.clientY);
		if ( documentHeight - event.clientY < ( 250)) 
		{
		//alert("less");
			//PositionY += event.clientY + IsBody().scrollTop - Math.max ((event.clientY - CurrentImageHeight/2), ( 110 - event.clientY - documentHeight ));
	        PositionY += IsBody().scrollTop +  event.clientY - CurrentImageHeight;		
		}
		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;
	}
	//alert(PositionX + "--" + PositionY );
	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 width="250" height="250" 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"
}