var IsMouseOverDiv = 0;	
var tempX = 0;
var tempY = 0;	
var opacity = 0;
var itemNoFromScreen;

function SetXY(event)
{
	tempX = event.clientX;
	tempY = event.clientY;
}

// Hides the item details div after a second delay
function HideDetailDivAfterDelay()
{
	IsMouseOverDiv = 0;
	setTimeout("HideDetailOnDelay()", 500);	
}	

// Hides the item details div only if the mouse is not over it
function HideDetailOnDelay()
{
	if (document.getElementById("itemId").innerHTML != itemNoFromScreen || IsMouseOverDiv == 0)
	{
		HideDetailDiv();
	}
}					

function HideDetailDiv()
{
	IsMouseOverDiv = 0;
	
	document.getElementById("ItemDetail").style.top = -300;
	document.getElementById("ItemDetail").style.left = 0;
	document.getElementById("ItemDetail").style.visibility = 'hidden';
		
	document.getElementById("itemNo_1").style.visibility = 'hidden';
	document.getElementById("basePrice_1").style.visibility = 'hidden';	
	document.getElementById("features_1").style.visibility = 'hidden';
	document.getElementById("specifications_1").style.visibility = 'hidden';
	document.getElementById("longDesc_1").style.visibility = 'hidden';		
	document.getElementById("desc1_1").style.visibility = 'hidden';
	document.getElementById("desc2_1").style.visibility = 'hidden';
	document.getElementById("desc3_1").style.visibility = 'hidden';
	document.getElementById("desc4_1").style.visibility = 'hidden';
	document.getElementById("desc5_1").style.visibility = 'hidden';
	
	document.getElementById("itemNo").style.visibility = 'hidden';
	document.getElementById("shortDesc").style.visibility = 'hidden';
	document.getElementById("basePrice").style.visibility = 'hidden';	
	document.getElementById("features").style.visibility = 'hidden';
	document.getElementById("specifications").style.visibility = 'hidden';
	document.getElementById("longDesc").style.visibility = 'hidden';
	document.getElementById("desc1").style.visibility = 'hidden';
	document.getElementById("desc2").style.visibility = 'hidden';
	document.getElementById("desc3").style.visibility = 'hidden';
	document.getElementById("desc4").style.visibility = 'hidden';
	document.getElementById("desc5").style.visibility = 'hidden';	
}

function ShowDetailDiv()
{
	IsMouseOverDiv = 1;
	if (document.getElementById("ItemDetail").style.visibility == 'hidden')
		document.getElementById("ItemDetail").style.visibility = 'visible';
}	

function ShowDetailOnMouseOverDiv()
{
	IsMouseOverDiv = 1;
	if (document.getElementById("ItemDetail").style.visibility == 'hidden')
		document.getElementById("ItemDetail").style.visibility = 'visible';			
}

function HideDetailOnMouseOutDiv()
{
	IsMouseOverDiv = 0;
	HideDetailDivAfterDelay();
}			

function ShowDetail(itemNo, url)
{
	IsMouseOverDiv = 1;	
	itemNoFromScreen = 	itemNo;	
	Item.LoadHoverColumns(LoadColumns_callback);
	Item.ShowDetail(itemNo, url, ShowDetail_callback);
}

function LoadColumns_callback(res)
{
	for (var count = 0; count < res.value.length; count++)
	{
		if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'ProductAliasId')
		{
			document.getElementById("itemNo_1").innerHTML = res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			document.getElementById("itemNo_1").style.visibility = 'visible';
			document.getElementById("itemNo").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'ShortDescription')
		{
			document.getElementById("shortDesc").style.visibility = 'visible';
		}		
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'LongDescription')
		{
			//document.getElementById("longDesc_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			//document.getElementById("longDesc_1").style.visibility = 'visible';		
			document.getElementById("longDesc").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'BasePrice')
		{
			document.getElementById("basePrice_1").innerHTML = "<br><br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			document.getElementById("basePrice_1").style.visibility = 'visible';		
			document.getElementById("basePrice").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Features')
		{
			document.getElementById("features_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			document.getElementById("features_1").style.visibility = 'visible';			
			document.getElementById("features").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Specifications')
		{
			document.getElementById("specifications_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			document.getElementById("specifications_1").style.visibility = 'visible';			
			document.getElementById("specifications").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'SellUM')
		{
			document.getElementById("sellum_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			document.getElementById("sellum_1").style.visibility = 'visible';			
			document.getElementById("sellum").style.visibility = 'visible';
		}			
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Desc1')
		{
			//document.getElementById("desc1_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			//document.getElementById("desc1_1").style.visibility = 'visible';			
			document.getElementById("desc1").style.visibility = 'visible';
		}		
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Desc2')
		{
			//document.getElementById("desc2_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			//document.getElementById("desc2_1").style.visibility = 'visible';			
			document.getElementById("desc2").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Desc3')
		{
			//document.getElementById("desc3_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			//document.getElementById("desc3_1").style.visibility = 'visible';			
			document.getElementById("desc3").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Desc4')
		{
			//document.getElementById("desc4_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			//document.getElementById("desc4_1").style.visibility = 'visible';			
			document.getElementById("desc4").style.visibility = 'visible';
		}	
		else if (res.value[count].substring(0, res.value[count].indexOf('|')) == 'Desc5')
		{
			//document.getElementById("desc5_1").innerHTML = "<br>" + res.value[count].substring(res.value[count].indexOf('|')+1) + " : ";
			//document.getElementById("desc5_1").style.visibility = 'visible';			
			document.getElementById("desc5").style.visibility = 'visible';
		}														
	}
}

function ShowDetail_callback(res)
{
	// get details from server-side and fill div
	if(res.error == null)
	{	
		opacity = 0;	
		document.getElementById("itemId").innerHTML = res.value[0];
		document.getElementById("itemNo").innerHTML = res.value[1];
		document.getElementById("shortDesc").innerHTML = "<br>" + res.value[2];
		document.getElementById("longDesc").innerHTML = "<br><br>" + res.value[3];
		document.getElementById("basePrice").innerHTML = res.value[4];
		document.getElementById("features").innerHTML = res.value[5];
		document.getElementById("specifications").innerHTML = res.value[6];
		document.getElementById("sellum").innerHTML = res.value[7];
		
		if (res.value.length > 9 && res.value[8].length > 0 && document.getElementById("desc1").style.visibility == 'visible')
			document.getElementById("desc1").innerHTML = "<br><br>" + res.value[8];
		else
			document.getElementById("desc1").innerHTML = "";
		if (res.value.length > 10 && res.value[9].length > 0 && document.getElementById("desc2").style.visibility == 'visible')
			document.getElementById("desc2").innerHTML = "<br><br>" + res.value[9];
		else
			document.getElementById("desc2").innerHTML = "";			
		if (res.value.length > 11 && res.value[10].length > 0 && document.getElementById("desc3").style.visibility == 'visible')		
			document.getElementById("desc3").innerHTML = "<br><br>" + res.value[10];	
		else
			document.getElementById("desc3").innerHTML = "";			
		if (res.value.length > 12 && res.value[11].length > 0 && document.getElementById("desc4").style.visibility == 'visible')	
			document.getElementById("desc4").innerHTML = "<br><br>" + res.value[11];
		else
			document.getElementById("desc4").innerHTML = "";			
		if (res.value.length > 13 && res.value[12].length > 0 && document.getElementById("desc5").style.visibility == 'visible')
			document.getElementById("desc5").innerHTML = "<br><br>" + res.value[12];	
		else
			document.getElementById("desc5").innerHTML = "";	
				document.getElementById("itemImage").setAttribute("src", res.value[13]);			
		if (document.getElementById)
		{
			this.obj = document.getElementById('ItemDetail');
			this.style = document.getElementById('ItemDetail').style;
		}
		else if(document.all)
		{
			this.obj = document.all['ItemDetail'];
			this.style = document.all['ItemDetail'].style;
		}
		else if(document.layers)
		{
			this.obj = document.layers['ItemDetail'];
			this.style = document.layers['ItemDetail'].style;
		}
		
		document.getElementById("itemIdUrl1").setAttribute('href', res.value[14]);
		document.getElementById("itemIdUrl2").setAttribute('href', res.value[14]);		
		
		if (tempX > document.body.clientWidth / 2)
			tempX = tempX - 380;
		else
			tempX = tempX + 20;
		this.style.left = tempX;
		
		if (tempY > screen.height / 2)
			this.style.top = tempY - 100 + document.body.scrollTop;
		else
			this.style.top = tempY + document.body.scrollTop;
		
		this.style.visibility = 'visible';
		this.style.zIndex = 25;				

		MakeDivVisible();				
	}		
}	

// Fucntion to fade the popup into view
function MakeDivVisible()
{
	if (document.getElementById)
	{
		this.obj = document.getElementById('ItemDetail');
		this.style = document.getElementById('ItemDetail').style;
	}
	else if(document.all)
	{
		this.obj = document.all['ItemDetail'];
		this.style = document.all['ItemDetail'].style;
	}
	else if(document.layers)
	{
		this.obj = document.layers['ItemDetail'];
		this.style = document.layers['ItemDetail'].style;
	}	
	
	opacity = opacity + 1;
	this.style.opacity = opacity/10;
	this.style.filter = 'alpha(opacity=' + opacity*10 + ')';		
	
	if (opacity <= 10)
		setTimeout("MakeDivVisible()",80);	
}