var lis = [];
var active_li_id = 0;
var duration = 1000;
var _width = 0;
var _height = 0;

function initPage()
{
	var _ul = document.getElementById("roll-icon");

	if (_ul)
	{
		_width = _ul.offsetWidth;
		_ul.style.position = "relative";
		lis = _ul.getElementsByTagName("li");
		for (var i = 0; i < lis.length; i++)
		{ 
			lis[i].style.position = "absolute";
			lis[i].style.top = "0px";
			lis[i].style.left = _ul.offsetWidth + "px";

			lis[i].style.display = "block";			

			if(lis[i].className == "active")
			{
				active_li_id = i;
				lis[i].style.left = "0px";
			}
			
			if(lis[i].offsetHeight > _height) _height = lis[i].offsetHeight;
			
		}
		
		_ul.style.height = _height + "px";
					
	}
	
	__prev = document.getElementById('roll-previous');	
	__next = document.getElementById('roll-next');	
	
	if(__prev)
	{
		__prev.onclick = _previous;
		__prev.href = "javascript:void(0);";
	}

	if(__next)
	{
		__next.onclick = _next;
		__next.href = "javascript:void(0);";
	}
	
	var nav = document.getElementById("navigation-top");
	var list = nav.getElementsByTagName("li");
	for (i = 0; i<list.length; i++)
	{
		list[i].onmouseover = function()
		{
			if (this.className.indexOf("hover") == -1)
			{
				this.className += " hover";
			}
		}
		list[i].onmouseout = function()
		{
			this.className = this.className.replace("hover", "");
		}
	}

	
}

if (window.addEventListener){
	window.addEventListener("load", initPage, false);
}
else if (window.attachEvent){
	window.attachEvent("onload", initPage);
}


function _previous()
{
	var _prev_id = active_li_id;	
	var _now_id = active_li_id - 1;	
	if(_now_id < 0) _now_id = lis.length - 1;
	
	var eff1 = new Fx.Styles( lis[_prev_id], {duration: duration,				
				onStart: function(){},
				onComplete: function(){}				
				});
		
	eff1.custom({'left': [0,-1*_width]});	

	var eff2 = new Fx.Styles( lis[_now_id], {duration: duration,				
				onStart: function(){},
				onComplete: function(){}				
				});		
	eff2.custom({'left': [_width,0]});	

	active_li_id = _now_id;	
}

function _next()
{
	var _now_id = active_li_id + 1;	
	if(_now_id >= lis.length) _now_id = 0;
	var _prev_id = active_li_id;	
	
	var eff1 = new Fx.Styles( lis[_prev_id], {duration: duration,				
				onStart: function(){},
				onComplete: function(){}				
				});
		
	eff1.custom({'left': [0,_width]});	

	var eff2 = new Fx.Styles( lis[_now_id], {duration: duration,				
				onStart: function(){},
				onComplete: function(){}				
				});		
	eff2.custom({'left': [-1*_width,0]});	

	lis[_now_id].className = "active";
	active_li_id = _now_id;	
}

function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}