Ext.ns('NavMenu');

/* Settings */
NavMenu.hideDelay = 300;
NavMenu.slideConfig = {
	duration: 0.2
};
NavMenu.containerId = 'Menu';




NavMenu.hideTasks = {};

NavMenu.initialize = function() {
	
	NavMenu.navEl = Ext.get(NavMenu.containerId);
	
	// process each menu link
	NavMenu.navEl.select('a', true).each( function(menuItem) {
		
		// skip items without rel
		if(!menuItem.dom.rel)
			return;

		// get subnav
		var subNav = Ext.get(menuItem.dom.rel);
		
		// position it
		subNav.position('absolute', 100, menuItem.getX(), menuItem.getY() + menuItem.getHeight());
		subNav.setWidth(menuItem.getWidth());
		
		// hide it
		subNav.hide();
		
		// rig event		
		menuItem.on('mouseover', function() {

			NavMenu.showSubNav(subNav);

		});
		
		menuItem.on('mouseout', function() {

			NavMenu.hideSubNav(subNav);

		});
		
		subNav.on('mouseover', function() {
		
			NavMenu.cancelHide(subNav);			
		
		});
		
		subNav.on('mouseout', function() {
		
			NavMenu.hideSubNav(subNav);			
		
		});
		
	});

}

NavMenu.showSubNav = function(subNav) {

	NavMenu.cancelHide(subNav);
	
	// show
	if(!subNav.isVisible())
	{
		subNav.slideIn('t', NavMenu.slideConfig);
	}
}


NavMenu.hideSubNav = function(subNav) {

	// init hide task
	if(!NavMenu.hideTasks[subNav.id])
	{
		NavMenu.hideTasks[subNav.id] = new Ext.util.DelayedTask(function() {
		
			this.slideOut('t', NavMenu.slideConfig);
			
		}, subNav);
	}
	
	// trigger hide
	NavMenu.hideTasks[subNav.id].delay(NavMenu.hideDelay);
}

NavMenu.cancelHide = function(subNav) {

	// cancel hide
	if(NavMenu.hideTasks[subNav.id])
	{
		NavMenu.hideTasks[subNav.id].cancel();
	}
}




Ext.onReady(NavMenu.initialize);