/*globals $, $$, assetsUrl, IFrame, window*/

var DOMWindow = window,
	menuNav,
	currentNav = 0,
	navLeavesLeft,
	isLeaf,
	navLeavesHighlight,
	navHomeBtn,
	navFeaturesBtn,
	navBuyBtn,
	navSupportBtn,
	navSignInBtn,
	soundBtn,
	overlay,
	overlayContent,
	showOverlayBtns,
	body,
	mainNavHoverImages = [
		assetsUrl + 'k/kids_website/images/nav-home-mo.png',
		assetsUrl + 'k/kids_website/images/nav-features-mo.png',
		assetsUrl + 'k/kids_website/images/nav-support-mo.png',
		assetsUrl + 'k/kids_website/images/nav-buy-now-mo.png',
		assetsUrl + 'k/kids_website/images/nav-parents-signin-mo.png',
		assetsUrl + 'k/kids_website/images/nav-dropdown-btm.png',
		assetsUrl + 'k/kids_website/images/nav-dropdown-middle.png',
		assetsUrl + 'k/kids_website/images/nav-dropdown-top.png',
		assetsUrl + 'k/kids_website/images/sound-off.png'
	];
	leavesRight = 'nav-leaves-right'
// updates nav ui based upon what page user is on
function setNavUI (navElemID) {
	if ($(navElemID)) {
		$(navElemID).addClass(navElemID + '-hover').addClass('active-nav');
	}
	
	if(navElemID === 'nav-signin'){
		$(leavesRight).setStyle('display','none');
	}
}

function imgPreload (images) {
	
	images.each(function(image) {
		var img = new Image();
		img.src = image;
	});
}


function navMO(elem, mouseEnter) {
	
	if (!elem) {
		return;
	}

	var siblingElem,
		siblingElemID,
		hoverClass,
		elemID = elem.get('id'),
		leavesHoverClass,
		hasSiblings;
		
	if (elem.getSiblings('.active-nav').length !== 0){
		hasSiblings = true;
	}
	else {
		hasSiblings = false;
	}
	
		
	if (!elem.hasClass('active-nav')) {
		
		hoverClass = elemID + '-hover';
		elem.addClass('active-nav');
		elem.addClass(hoverClass);
		
		if (hasSiblings) {
			siblingElem = elem.getSiblings('.active-nav');
			siblingElemID = siblingElem.get('id').toString();
			
		}
		if (currentNav && siblingElemID === currentNav.id){
			siblingElem.removeClass('active-nav');
		} 
		else {
			if (hasSiblings) {
				siblingElem.removeClass('active-nav').removeClass(siblingElem.get('id') + '-hover');
			}
		}
		
		if (elemID === 'nav-features' && mouseEnter) {
			$(elemID + '-dropdown').setStyle('display', 'block');
		}
		
		if (siblingElemID === 'nav-features') {
			$(siblingElemID + '-dropdown').setStyle('display', 'none');
		}
		if(elemID == 'nav-signin'){
			$(leavesRight).setStyle('visibility','hidden');
		} else{
			$(leavesRight).setStyle('visibility','visible');
		}
		
	}
	
	else {
		
	/*
	 * If Mouse Over or Mouse Off and the elem has the class active-nav.
	 */
		if (currentNav === 0){
			hoverClass = elemID + '-hover';
			$(elemID).removeClass("active-nav").removeClass(hoverClass);
		}
		
		if (elemID === 'nav-features') {
			if(mouseEnter){
				$(elemID + '-dropdown').setStyle('display', 'block');
			}
			else{
				$(elemID + '-dropdown').setStyle('display', 'none');
			}
		}
		
	}
	
	
}

function soundMouseEnter (elem) {
	var hoverOnClass = 'sound-off',
		oldClass = 'sound-on';
				
	if (!elem.hasClass(oldClass)) {
		hoverOnClass = 'sound-on';
		oldClass = 'sound-off';
	}
	
	elem.removeClass(oldClass).addClass(hoverOnClass);
}

function soundMouseLeave (elem) {	
	var oldClass = 'sound-off',
		newClass = 'sound-on',
		selectedState = 'sound-off-selected';
	
	if (!elem.hasClass(oldClass)) {
		oldClass = 'sound-on';
		newClass = 'sound-off';
		selectedState = 'sound-on-selected';
	}
	
	if (!elem.hasClass(selectedState)) {
		elem.removeClass(oldClass).addClass(newClass);
	}
}

function closeOverlay () {
	overlayContent.empty()
	overlay.setStyles({
		'height': '0px',
		'width': '0px',
		'display': 'none'
	});
}

function showOverlay (btn) {

	var _gaq = _gaq || [];
	_gaq.push(['_trackPageview', btn.get('href') || '/overlay']);

	var bodyScrollSize = body.getScrollSize(),
		windowSize = body.getSize(),
		overlaySize,
		overlayContentSize,
		iframe;	
	
	// set overlay size to body size
	overlay.setStyles({
		'height': bodyScrollSize.y + 'px',
		'width': bodyScrollSize.x + 'px',
		'display': 'block'
	});

	overlaySize = overlay.getSize();
	overlayContentSize = overlayContent.getSize();
	
	if (btn.hasClass('overlay-iframe')) {
		iframe = new IFrame({
			src: btn.get('href'),
			styles: {
				width:overlayContentSize.x + 'px',
				height:overlayContentSize.y + 'px'
			},
			scrolling: 'no'
			
		}).inject(overlayContent);
	} else {
		overlayContent.set('html', btn.get('overlayHTML'));
	}
	
	overlayContentSize = overlayContent.getSize();
	
	function f_filterResults(n_win, n_docel, n_body) {
		var n_result = n_win ? n_win : 0;
		if (n_docel && (!n_result || (n_result > n_docel)))
			n_result = n_docel;
		return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result;
	}

	function f_scrollTop() {

		return f_filterResults (
			window.pageYOffset ? window.pageYOffset : 0,
			document.documentElement ? document.documentElement.scrollTop : 0,
			document.body ? document.body.scrollTop : 0
		);
	}
	
	overlayContainer.setStyles({
		'top': f_scrollTop() + 'px'
	});
}



imgPreload(mainNavHoverImages);

DOMWindow.addEvent('domready', function () {	
	navLeavesHighlight = $('nav-leaves-highlight');
	menuNav = $('nav');
	menuNavSurfaces = $$('.nav-surface');
	soundBtn = $('sound');
	overlay = $('overlay');
	overlayBG = overlay.getElement('.overlay-bg');
	body = $$('body')[0];

	overlayContent = $('overlay-content');
	overlayContainer = $('overlay-container');
	showOverlayBtns = $$('.overlay-button');
	homeElem = $('nav-home');
	var mouseEnter;
	
				
	if (menuNav) {
		menuNav.getChildren('li').addEvent('mouseenter', function () {
			mouseEnter = true;
			navMO($(this.id.replace(/-surface/, '')), mouseEnter);
		});
		
		menuNav.getChildren('li').addEvent('mouseleave', function () {
			mouseEnter = false;
			if (currentNav){
				navMO(currentNav, mouseEnter);
			}
			else {
				navMO($(this.id.replace(/-surface/, '')), mouseEnter);
			}
		});	
	}
	

	

	
	showOverlayBtns.addEvent('click', function (e) {
		if (e) {
			e.stop();
		}
		showOverlay(this);
	});
	overlayBG.addEvent('click', function (e) {
		closeOverlay();
	});
	
	/*
	soundBtn.addEvents({
		mouseenter: function () {
			soundMouseEnter(this);
		},
		mouseleave: function () {
			soundMouseLeave(this);
		},
		click: function (e) {
			if (e) {
				e.stop();
			}
			
			var selectedClass = 'sound-on-selected',
				oldSelectedClass = 'sound-off-selected';
			
			if (!this.hasClass('sound-off-selected')) {
				selectedClass = 'sound-off-selected';
				oldSelectedClass = 'sound-on-selected';
			}
			
			this.removeClass(oldSelectedClass).addClass(selectedClass);
		}
	});
	*/
	
});

// (function(){
//  // if firefox 3.5+, hide content till load (or .5 seconds) to prevent FOUT(Flassh Of Unstyled Text)
//  //holds from redering the text until @font-face font loads, then the text loads with the desire font.
//  var d = document, 
//  	e = d.documentElement, 
//  	s = d.createElement('style');
//  	if ( e.style.MozTransform === '' ) { 
// 		s.textContent = 'body{visibility:hidden}';
// 	var r = document.getElementsByTagName('script')[0];
// 	r.parentNode.insertBefore(s, r);
// 	function f() { 
// 		s.parentNode && s.parentNode.removeChild(s);
// 	}
// 	addEventListener('load',f,false);
//     	setTimeout(f,500); 
//   }
// })();
 
  


