//Area to define default settings

//Scroll Container Area Settings
var ecContainerWidth = 400;
var ecContainerHeight = 110;
var ecContainerId ="ecScrollContainer";
var ecScrollAreaId = "ecScrollArea";
var ecScrollInitY = 0;
var ecScrollInitX = 0;
var ecScrollHeight = 0;
var ecScrollWidth = 0;

//Scroll Animation Settings
var ecScrollOrientation = 2;
var scrollTimer;
var ecScrollIncrement = 1;
var ecScrollSpeed = 50;


function StopRotation(){	

  	clearTimeout(scrollTimer);
	scrollTimer = setTimeout("ReInit()", ecScrollSpeed);
}
function ReInit(){
clearTimeout(scrollTimer);
if(ecScrollOrientation ==1) 
	{
		InitVerticalScroll();
	}
	else
	{
		InitHorizontalScroll();
	}
}	

function ecBuildList()
{
	var myScrollArea = document.getElementById('ecScrollArea');
	var mycontent='';
	
		for(var i=1; i<=24; i++)
		{
			var myindex;
			var mysource;
			if(i<10){
				myindex = "0" + i;
			}
			else
			{
				myindex = i;
			}
			mysource = "/SFXPictures/SFXNetProducts/cfxGauges/RotatingImgs/gaugethumb" + myindex +".gif";
			mycontent +="<div id=\"thumbnailgauge" + myindex + "\" onmouseover=\"ecSetItemMouseOver('"+myindex+"',this)\" class=\"horizontallayout\"><table class=\"tabledisplay\"><tr><td><a href=\"#\" OnClick=\"MM_openBrWindow('GaugeDetail.aspx?id="+myindex+"','','width=250,height=250'); return false\"><img src=\"" + mysource + "\" width=\"100\" height=\"100\" border=\"0\"/></a></td></tr></table></div>";
		}
	
	myScrollArea.innerHTML = mycontent + mycontent;
}

function InitecScroll()
{
	ecBuildList();
	var mycontainer=document.getElementById(ecContainerId);
	mycontainer.style.width = ecContainerWidth + "px";
	mycontainer.style.height = ecContainerHeight + "px";

	if(ecScrollOrientation ==1) 
	{
		InitVerticalScroll();
	}
	else
	{
		InitHorizontalScroll();
	}

}

function InitVerticalScroll()
{
	var containerpositionX = ecFindPositionX(document.getElementById(ecContainerId));
	var containerpositionY = ecFindPositionY(document.getElementById(ecContainerId));
	var mycontainer=document.getElementById(ecContainerId);
	var mytopFade = document.getElementById("ecFadeTop");
	var mybottomFade = document.getElementById("ecFadeBottom");	
	mytopFade.style.top = mycontainer.style.top;
	mytopFade.style.left = mycontainer.style.left;
	mytopFade.style.width = ecContainerWidth+  'px';
	mytopFade.className = 'divshow';
	mybottomFade.style.top= (parseInt(containerpositionY) + ecContainerHeight -28 ) +'px';
	mybottomFade.style.left = mycontainer.style.left;
	mybottomFade.style.width = ecContainerWidth +  'px';
	mybottomFade.className = 'divshow';	
	if(ecScrollInitY !=0) 
		document.getElementById(ecScrollAreaId).style.top = 0;
	ecScrollInitY= ecFindPositionY(document.getElementById(ecScrollAreaId));
	ecScrollHeight = document.getElementById(ecScrollAreaId).offsetHeight;
	scrollTimer= setTimeout("ecVerticalScroll()",ecScrollSpeed);
}

function InitHorizontalScroll()
{
	var mycontainer=document.getElementById(ecContainerId);
	var containerpositionX = ecFindPositionX(mycontainer);
	var containerpositionY = ecFindPositionY(mycontainer);
	var myleftFade = document.getElementById("ecFadeLeft");
	var myrightFade = document.getElementById("ecFadeRight");	
	myleftFade.style.top = mycontainer.style.top;
	myrightFade.style.top = mycontainer.style.top;
	myrightFade.style.left = (parseInt(containerpositionX) + ecContainerWidth -28 ) +'px';
	myleftFade.style.left = containerpositionX-2 ;
	myleftFade.style.height = ecContainerHeight+  'px';
	myleftFade.className = 'divshow';
	myrightFade.style.height = ecContainerHeight+  'px';
	myrightFade.className = 'divshow';	
	if(ecScrollInitX !=0) 
		document.getElementById(ecScrollAreaId).style.left = 0;

	document.getElementById("ecScrollArea").className = 'ScrollArea';
	ecScrollInitX= ecFindPositionX(document.getElementById(ecScrollAreaId));
	ecScrollWidth =  document.getElementById("ecScrollArea").offsetWidth;	
	document.getElementById("ecScrollContainer").className= 'ScrollContainer';
	//alert(ecScrollWidth);
	scrollTimer= setTimeout("ecHorizontalScroll()",ecScrollSpeed);
	//alert(ecScrollWidth);
}

function ecVerticalScroll()
{
	var mycontainer=document.getElementById(ecScrollAreaId);
	var mycontainerY= ecFindPositionY(document.getElementById(ecScrollAreaId));
	if((mycontainerY)<=(ecScrollInitY-(ecScrollHeight/2 )))
	{
		mycontainer.style.top = (mycontainerY  - (ecScrollInitY-(ecScrollHeight/2 )) -  ecScrollIncrement) + 'px';
	}
	else
	{
		mycontainer.style.top = (mycontainerY - ecScrollInitY - parseInt(ecScrollIncrement)) + 'px';
	}	
	scrollTimer= setTimeout("ecVerticalScroll()",ecScrollSpeed);
}

function ecHorizontalScroll()
{
	var mycontainer=document.getElementById(ecScrollAreaId);
	var mycontainerX= ecFindPositionX(document.getElementById(ecScrollAreaId));
	if((mycontainerX)<=(ecScrollInitX-(ecScrollWidth/2 )))
	{
		mycontainer.style.left = (mycontainerX  - (ecScrollInitX-(ecScrollWidth/2 )) -  ecScrollIncrement) + 'px';
		//		alert(mycontainerX);
			//	alert(ecScrollInitX);
				
	}
	else
	{
		mycontainer.style.left = (mycontainerX - ecScrollInitX - parseInt(ecScrollIncrement)) + 'px';

	}
	scrollTimer= setTimeout("ecHorizontalScroll()",ecScrollSpeed);
}

function ecSetItemMouseOver(index,eobj)
{
	clearTimeout(scrollTimer);
	var containerpositionX = ecFindPositionX(document.getElementById(ecContainerId));
	var containerpositionY = ecFindPositionY(document.getElementById(ecContainerId));
	//var mypositionY = ecFindPositionY(eobj);
	//var mypositionX = ecFindPositionX(eobj);
	//alert(mypositionX);
	var myzoomeditem =document.getElementById('ecZoomedItem');
	if(index)
	{
	
		ecBuildZoom(index);
		var zoomleft=0;
		var zoomtop=0;
		zoomtop = containerpositionY - (ecContainerHeight)/2;
		zoomleft = containerpositionX + (ecContainerWidth)/2 - 110 ;
		myzoomeditem.style.left = zoomleft +'px';
		myzoomeditem.style.top = zoomtop  + 'px';
	//	myzoomeditem.className='divshow';
	}
}

function ecSetItemMouseOut(index)
{
	if(ecScrollOrientation ==1)
	{
		scrollTimer= setTimeout("ecVerticalScroll()",ecScrollSpeed);
	} 
	else 
	{
		scrollTimer= setTimeout("ecHorizontalScroll()",ecScrollSpeed);
	}
	document.getElementById('ecZoomedItem').className='divhide';
}

function ecFindPositionX(obj)
{
	var curleft = 0;
	if (obj.offsetParent)
	{
		while (obj.offsetParent)
		{
			curleft += obj.offsetLeft;
			obj = obj.offsetParent;
		}
	}
	else if (obj.x) 
	{
		curleft += obj.x;
	}
	return curleft;
}

function ecFindPositionY(obj)
{
	var curtop = 0;
	if (obj.offsetParent)
	{
		while (obj.offsetParent)
		{
			curtop += obj.offsetTop;
			obj = obj.offsetParent;
		}
	}
	else if (obj.y)
	{
		curtop += obj.y;
	}
	return curtop;
}

function ecBuildZoom(index)
{
/*	var myzoomeditem = document.getElementById('ecZoomedItem');
	var itemHtml = "<img src=\"/SFXPictures/SFXNetProducts/cfxGauges/RotatingImgs/gauge" + index +".gif\" width=\"219\" height=\"219\"  />";
 	myzoomeditem.innerHTML = itemHtml;
	*/
}
function InitializeListStyle()
{
	var returnthis;
	if(ecScrollOrientation==1)
	{
		returnthis = "<style>.horizontallayout{display:block;}</style>";
	}
	else
	{
		returnthis = "<style>.horizontallayout{display:inline;}</style>";
	}
	return returnthis;
}
var myOutTimer;
function StartOutTimer(){
myOutTimer = setTimeout("ecSetItemMouseOut(-1)",200);
}
function StopOutTimer(){
clearTimeout(myOutTimer);
}