/**
 * NM_ComMainNavigation.js
 *
 * @version	$Id: NM_ComMainNavigation.js 66938 2010-06-29 13:41:00Z bsteiner $
 **/
var NM_ComMainNavigation = NM_Component.extend ({

	/**
	 * @var string component name
	 **/
	strComName: '',

	/**
	 * @var element trail tab
	 **/
	elmTrailTab: null,

	/**
	 * @var string trail tab id
	 **/
	strTrailTabId: null,

	/**
	 * @var boolean initNavigation
	 **/
	blnInit: false,

	/**
	 * initialize()
	 */
	initialize: function( objParam )
	{
		this.parent( objParam );
		this.registerEventLoad( {}, { ms: 500, method: 'initNavigation' } );
	},

	/**
	 * onLoad()
	 */
	onLoad: function()
	{
		$( this.strComName ).addEvent( 'mouseover', this.initNavigation.bind( this ) );
	},

	/**
	 * initNavigation()
	 */
	initNavigation: function()
	{
		if( false == this.blnInit )
		{
			$( this.strComName ).removeEvents( 'mouseover' );

			var arrElmTabList = $ES( '.tab', $( this.strComName ) );
			arrElmTabList.each( function( elmTab )
			{
				if( true == elmTab.hasClass( 'active' ) )
				{
					this.elmTrailTab 	= elmTab;
					this.strTrailTabId 	= elmTab.getProperty( 'id' );
				}

				var elmLayer = $E( '.showroomList', elmTab );

				var closeLayerHandle = null;
				var openLayerHandle  = null;

				// mouse enter
				elmTab.addEvent( 'mouseenter', function()
				{
					this.setActiveTab( elmTab );
					if( elmLayer != null );
					{
						$clear( closeLayerHandle );
						openLayerHandle = this.openLayer.pass( elmLayer, this ).delay( 450, this );
					}

				}.bind( this ) );


				// mouse leave
				elmTab.addEvent( 'mouseleave', function()
				{
					this.unsetActiveTab( elmTab );
					if( elmLayer != null )
					{
						$clear( openLayerHandle );
						closeLayerHandle = this.closeLayer.bind( this ).pass( elmLayer ).delay( 500 );
					}

				}.bind( this ) );


				if( window.ie6 )
				{
					var elmCoverer	= new Element(
						'iframe',
						{	'id': 'mainNavCoverer_' + elmTab.getProperty('id'),
							'frameborder': '0',
							'src': '.'
						}
					);

					elmCoverer.set({
						'styles': {
							'position': 'absolute',
							'left': 0,
							'top': 0,
							'width': 0,
							'height': 0,
							'visibility': 'hidden'
						}
					});

					elmCoverer.inject( elmTab );
				}


			}.bind( this ) );

			this.blnInit = true;

		}
	},


	/**
	 * setActiveTab
	 */
	setActiveTab: function( elmTab )
	{
		elmTab.addClass( 'hovering' );
		if( elmTab.getProperty( 'id' ) != this.strTrailTabId )
		{
			this.setTrailTab();
		}
	},

	/**
	 * unsetActiveTab
	 */
	unsetActiveTab: function( elmTab )
	{
		if( elmTab.getProperty( 'id' ) != this.strTrailTabId )
		{
			elmTab.removeClass( 'hovering' );
			this.unsetTrailTab();
		}
	},

	/**
	 * setTrailTab
	 */
	setTrailTab: function()
	{
		if( this.elmTrailTab != null ) this.elmTrailTab.addClass( 'trail' );
	},

	/**
	 * unsetTrailTab
	 */
	unsetTrailTab: function()
	{
		if( this.elmTrailTab != null ) this.elmTrailTab.removeClass( 'trail' );
	},

	/**
	 * openLayer
	 */
	openLayer: function( elmLayer )
	{
		if( elmLayer != null )
		{
			elmLayer.addClass( 'active' );

			if( window.ie6 )
			{
				var coords	= elmLayer.getCoordinates();

				$( 'mainNavCoverer_' + elmLayer.getParent().getProperty('id') ).set({
					'styles': {
						'top': elmLayer.getStyle('top'),
						'left': elmLayer.getStyle('left'),
						'width': coords.width + 'px',
						'height': coords.height + 'px',
						'visibility': 'visible',
						'z-index': elmLayer.getStyle('z-index') - 1
					}
				});
			}
		}
	},

	/**
	 * closeLayer
	 */
	closeLayer: function( elmLayer )
	{
		var coords	= elmLayer.getCoordinates();

		elmLayer.removeClass( 'active' );

		if( window.ie6 )
		{
			$( 'mainNavCoverer_' + elmLayer.getParent().getProperty('id') ).set({
				'styles': {
					'left': 0,
					'top': 0,
					'width': 0,
					'height': 0,
					'visibility': 'hidden'
				}
			});
		}
	}
});