

function RolldownMenu()
{
	var menus = $$('div[rel^="rolldown_menu_"]');
	
	var i;
	
	for(i = 0; i < menus.length; ++i)
	{
		var mid = menus[i].readAttribute('rel');
		$(mid).setStyle({display:'none'});
		$(mid)._vis = false; 
		
		menus[i].observe('mouseover', function(event) {
			var arrayPageScroll = document.viewport.getScrollOffsets();
			var offset = $(this).viewportOffset();
			var x = offset.left + arrayPageScroll[0] - 10;
			var y = offset.top + arrayPageScroll[1] + this.getHeight();
			
			var mid = $(this).readAttribute('rel');
			mid = $(mid);
			
			mid._bover = true;
			if(mid.getStyle('display'))
				mid.setStyle({left: x + 'px', top: y + 'px'});
				
			
			rolldownMenu.prettyShow(mid);
		});
		
		
		$(mid).observe('mouseover', function(event) {
			this._mover = true;
		});
		
		$(mid)._tout = function() {
			
			if(!this._mover && !this._bover)
				rolldownMenu.prettyHide(this);

		};
		
			
		menus[i].observe('mouseout', function(event) {
			var mid = $(this).readAttribute('rel');
			$(mid)._bover = false;
			setTimeout($(mid)._tout.bind($(mid)), rolldownMenu.mtimeout);
			
		});
		
		
		$(mid).observe('mouseout', function(event) {
			if(this._mover)
			{
				this._mover = false;
				setTimeout(this._tout.bind(this), rolldownMenu.mtimeout);
			}
		});
		
	}
	
	this.menus = menus;	
	this.mtimeout = 100;
	
}

RolldownMenu.prototype.prettyShow = function(obj)
{
	if(!$(obj)._vis)
	{
		//$(obj).setStyle({display: 'block'});
		new Effect.Appear($(obj), {duration: 0.2, queue: { position: 'end', scope: obj.id }});
		//new Effect.BlindDown($(obj), {duration: 0.2, queue: { position: 'end', scope: obj.id }});
		$(obj)._vis = true;
	}	
}

RolldownMenu.prototype.prettyHide = function(obj)
{
	if($(obj)._vis)
	{
		//$(obj).setStyle({display: 'none'});
		new Effect.Fade($(obj), {duration: 0.2, queue: { position: 'end', scope: obj.id }});
		//new Effect.BlindUp($(obj), {duration: 0.2, queue: { position: 'end', scope: obj.id }});
		$(obj)._vis = false;
	}	
}

var rolldownMenu;

document.observe('dom:loaded', function ()
{
	rolldownMenu = new RolldownMenu();
});
