var PrimaryNav = new Class({
	Implements:Options,
	initialize: function(options){
        this.setOptions(options);
		
		options.tabs.each(function(tabImage) {
			$extend(tabImage, new NavOpener());
		});
		
		options.menus.each(function(menu, index) {
			$extend(menu, new Nav());
			PrimaryNav.navs.push(menu);
			menu.attachTo(options.tabs[index]);
			var fistLevelElements = menu.getElements(".FirstLevelNav > li");
			menu.initItems(fistLevelElements);
		});
    }
	
});
PrimaryNav.navs = new Array();
PrimaryNav.closeAll = function() {
	PrimaryNav.navs.each(function(item, index) {
		item.slideClosed();
	});
}
window.addEvent('click', function(e) { 
	PrimaryNav.closeAll();
});

function NavOpener() {}
NavOpener.prototype.showOnButton = function() {
	this.set('src', this.get('src').replace('OffPrimary','OnPrimary'));
}
NavOpener.prototype.showOffButton = function() {
	this.set('src', this.get('src').replace('OnPrimary','OffPrimary'));
}


function Nav() {}
Nav.active = null;
Nav.prototype.initItems = function(items) {
	var nav = this;
	// SubNav init
	items.each(function(item, i) {
		item.set('id', 'firstLevelItem' + i);
		item.addEvents({ 'mouseenter':SetSubNavYPos, 'mouseleave':FirstLevelItemOff });
		
		var subNavContainer =  item.getElement('div.SubNavContainer');
		var subNavElement =  subNavContainer.getElement('div.SubNav');
		var link = subNavContainer.getElement('a');
		
		if($defined(subNavContainer)) {
			var subNav = new SubNav({ width:337, container:subNavContainer, element:subNavElement, 'link':link });
			subNav.options.container.setStyle('z-index', 100 - (i+1)); //reverse the z-index
			item.store('subNav', subNav);
			item.addEvents({ 
				'mouseover': function(event) { nav.closeSubNavs(); item.retrieve('subNav').open(); },
				'mouseout': function(event) { item.retrieve('subNav').close(); }
				
			});
			subNavContainer.addEvent('mouseleave', function(event) { 
					event.stopPropagation();
					var s = item.retrieve('subNav').options.element;			
					var localMouseYPos = Math.abs(event.page.y);
					var localMouseXPos = event.page.x;
					var mouseLeftOfNav = localMouseXPos < s.getPosition().x;	
					var CheckForClose = function() {
						var navBottomY = s.getCoordinates().height + subNavContainer.getCoordinates().top;
						var mouseBelowNav = localMouseYPos >= navBottomY;
						var mouseDirectlyBelowNav =  mouseBelowNav && (mouseLeftOfNav == false);
						
						 if(!mouseBelowNav) {
							FirstLevelItemOff.bind(item)();
						 	item.retrieve('subNav').close();
							nav.slideClosed();
						 }
					}

					if(mouseLeftOfNav) {
						FirstLevelItemOff.bind(item)();
						item.retrieve('subNav').close();
					} else { 
						//CheckForClose.delay(1500);
						CheckForClose();
					}
			});
		}
	});
}
var FirstLevelItemOff = function() {
	if(this.hasClass('openhover')) 
		this.removeClass('openhover');
	else this.removeClass('hover');
}
var SetSubNavYPos = function() {
	
	var subNavContainer = this.getElement('div.SubNavContainer');
	
	if(subNavContainer) 
		this.addClass('openhover');
	else this.addClass('hover');
	
	var itemYPos = this.getCoordinates().top;


	var navContainerHeight = subNavContainer.getCoordinates().height;
	var isShortMenu = this.getParent().getCoordinates().height > navContainerHeight;
	var navBottomPos = (navContainerHeight + 113);
	var halfofNavItems = Math.round(this.getElements('div.SubNav > div').length /2);
	
	var xPos = 219;
	var yPos = itemYPos - 113;
	//console.log('navContainerHeight:' + navContainerHeight);
	if(isShortMenu || itemYPos >= navBottomPos) {
		subNavContainer.setPosition({x:xPos, y:yPos})
	} else {
		subNavContainer.setPosition({x:xPos, y:0})
	}
}


Nav._topIndex = 100;
Nav.topIndex = function() {
	Nav._topIndex += 1;
	return Nav._topIndex;
}

Nav.prototype.positionNav = function() {
	this.setPosition({x:this.button.getCoordinates().top, y:this.button.getCoordinates().left});
}
Nav.prototype.slideOpen = function() {
	var nav = this;
	nav.show();
	this.button.showOnButton();
	if(!this.isOpening) {
		
		this.button.retrieve('navOpenEffect').start({ 
			'top':0,
			onStart:function() {
				Nav.active = nav;
			}
		
		}).chain(function() { 
			nav.isOpening = false; 
		});
	}
}
Nav.prototype.getTitle = function() {
	return this.getFirst('ul').getFirst('li').getFirst('a').text;
}
Nav.prototype.slideClosed =  function() {
	var button = this.button;
	var nav = this;
	this.button.retrieve('navOpenEffect').cancel();
	this.button.retrieve('navOpenEffect').start({ 
		'top':-400,
		onStart:function() {
			button.showOffButton();
			nav.isClosing = true;
			nav.unhighlightParent();
			nav.closeSubNavs();
		}

	}).chain(function() {
		nav.hide();
		nav.isClosing = false;

	});
}
Nav.prototype.unhighlightParent = function() {
	this.getElements(".FirstLevelNav > li").each(function(item, index) {
		FirstLevelItemOff.bind(item)();
	});
}
Nav.prototype.closeSubNavs = function() {
	var items = this.getElements(".FirstLevelNav > li");
	items.each(function(item, index) {
		var snav = item.retrieve('subNav');
		snav.close();
	});
}
Nav.prototype.closeOthers =  function() { 
	var others = this.getOthers();
	others.each(function(item, index) {
		item.slideClosed();
	});
}

Nav.prototype.getOthers =  function() { 
	var navs = PrimaryNav.navs;
	var nav = this;
	var others = navs.filter(function(item, index) {
		return item != nav;
	});
	return others;
}
Nav.prototype.setOpen = function() {
	this.button.retrieve('navOpenEffect').pause();
	this.button.retrieve('navOpenEffect').set({top:0});
}
Nav.prototype.attachTo =  function(button) {
	this.button = button; 
	var nav = this;
	this.isEngaged = false;
	this.isClosing = false;
	this.isOpening = false;
	this.positionNav();
	var navOpenEffect = new Fx.Morph(this.getElement('ul.FirstLevelNav'),	{link:'cancel', duration: 500, transition: Fx.Transitions.Pow.easeOut });
	this.button.store('navOpenEffect', navOpenEffect);

	var FlagOpen =  function () {
		nav.isEngaged = true;
	}
	var DelayedOpen = function() {
		if(Nav.active) {
			Nav.active.slideClosed();
		}
		nav.isEngaged = true;
		CheckForOpen.delay(400, this.button);
	}
	var CheckForOpen = function() {
		if(nav.isEngaged) {
			nav.setPosition({x: nav.button.getPosition().x + 1, y:nav.button.getCoordinates().bottom});
			//nav.setStyle('top', (nav.button.getPosition().x + 1));
			nav.slideOpen();
		}
	}
	var CheckForClose = function() {
		if(!nav.isEngaged) {
			nav.slideClosed();
		 }
	}
	var DelayedClose = function() {
		nav.isEngaged = false;
		CheckForClose.delay(1500, this.button);
	}

	this.button.addEvent('mouseenter', DelayedOpen);
	this.button.addEvent('mouseleave', DelayedClose);

	this.getElement('ul.FirstLevelNav').addEvent('mouseenter', FlagOpen);
	this.getElement('ul.FirstLevelNav').addEvent('mouseleave', DelayedClose);
}


window.addEvent('domready', function() { 
	
	/*
	 * If there is not already a navTempHolder element, then it is a third party site.
	 * Else, it is local, so generate the nav using html. See also head.vm.
	 */
	
	var temp = '';
	if ($("navTempHolder") == null) {
		temp = new Element('div', {'class':'navTempHolder','id':'navTempHolder'});
	    temp.set('html', navContent);
	    temp.wraps($('primaryNavigation'), 'top');
	}
	
	new PrimaryNav({
		tabs:$$('#primaryNavigation img'),
		menus:$$('.MainNavContainer')
	});

	$$('.thirdLevel:last-child').setStyle('border-bottom', '1px solid #DADCDC');
	var accordion = new Accordion($$('.toggler'),$$('.element'), {
		opacity: 0,
		display: -1,
		alwaysHide: 1,
		trigger: 'mouseenter',

		onActive: function(toggler, element) { 

			toggler.getParent().addClass('blueBarOpen');
			element.setStyle('display', 'block');
			//element.getLast().setStyle('border-bottom', '1px solid #cbcbcb');
			if(Browser.Engine.trident && Browser.Engine.version == 4) {
				toggler.setStyle('visibility','hidden');
				// var periodicSetAutoHeight = function() {
				// 									if(this.getStyle('height') == '0px') {
				// 										this.setStyle('height', 'auto');
				// 										//console.log('setting 0px to auto');
				// 									}
				// 								}
				// 								periodicSetAutoHeight.periodical(750, element);
			}
		},
		onBackground: function(toggler, element) { 

			toggler.getParent().removeClass('blueBarOpen');
			//element.getLast().setStyle('border-bottom', 'none');
			if(Browser.Engine.trident && Browser.Engine.version == 4) {
				toggler.setStyle('visibility','visible');
				element.setStyle('display', 'none');
				var delayedDisplayNone = function() {
					element.setStyle('display', 'none');
				}
				delayedDisplayNone.delay(400);
			}
		}

	});
});


var SubNav = new Class({
	Implements:Options,
	initialize: function(options){
		this.setOptions(options);
		this.items = this.options.container.getElements('.SubNav > .secondLevel');
		this.items.addEvents({ 'mouseenter':SubNavHoverOn, 'mouseleave':SubNavHoverOff });
		this.addSlideEffect(this.options);
	},
	addSlideEffect: function(options) {
		var slideEffect = new Fx.Morph(this.options.element, {
			link:'cancel',
			onComplete:function(thisItem) {
				if(thisItem.getStyle('margin-left') != '0px') {
					thisItem.setStyle('visibility', 'hidden');
					thisItem.getParent().setStyle('visibility', 'hidden');
					thisItem.getParent().setStyle('left',-(options.width));
				}
			},
			duration: 'short', 
		 	transition: Fx.Transitions.linear
		});
		this.options.element.store('slideEffect', slideEffect);
	},
	showNav: function() {
		this.options.element.setStyle('visibility', 'visible');
		this.options.container.getParent().setStyle('visibility', 'visible');
		this.options.container.getParent().setStyle('left', 0);
	},
	open: function() {
		this.showNav();
		this.options.element.retrieve('slideEffect').start({ 'margin-left':0});
		this.options.element.getParent().setStyle('visibility', 'visible');
	},
	setOpen: function() {
		this.showNav();
		this.options.element.retrieve('slideEffect').set({ 'margin-left':0});
	},
	setClose: function() {
		this.options.element.retrieve('slideEffect').set('z-index', Nav.topIndex());
		this.options.element.retrieve('slideEffect').set({ 'margin-left':-(this.options.width) });
	},
	close: function() {
		this.options.element.retrieve('slideEffect').set('z-index', Nav.topIndex());
		this.options.element.retrieve('slideEffect').pause().start({ 'margin-left':-(this.options.width) });
	},
	inBounds: function() {
		
	}
});
var SubNavHoverOn = function() {
	if(this.get('class') == 'secondLevel') 
		this.addClass('blueBarHover');
	if(this.hasClass('greyBarClosed'))
		this.addClass('blueBarClosed')
} 
var SubNavHoverOff = function() {
	if(this.hasClass('blueBarHover'))
		this.set('class', 'secondLevel');
	if(this.hasClass('blueBarClosed'))
		this.removeClass('blueBarClosed');
}
/* -- -------- */