$j = jQuery.noConflict();

$j(document).ready(function(){

	//Set custom configurations for Hover Intent
	var config = {
	     sensitivity: 2, // number = sensitivity threshold (must be 1 or higher)
	     interval: 100, // number = milliseconds for onMouseOver polling interval
	     over: megaHoverOver, // function = onMouseOver callback (REQUIRED)
	     timeout: 500, // number = milliseconds delay before onMouseOut
	     out: megaHoverOut // function = onMouseOut callback (REQUIRED)
	};
	
	$j('#nav li .sub-menu').css({'opacity':'0'}); //Fade sub nav to 0 opacity on default
	$j('#nav li').hoverIntent(config); //Trigger Hover intent with custom configurations

	var $banner_animation;
	animateBanner();
});

// Main menu functions
// On Hover Over
function megaHoverOver() {
	// $j(this).find('.sub-menu').stop().fadeTo('fast', 1).show(function(){
	$j(this).find('.sub-menu').stop().fadeTo(0, 1).show(function(){
		$j(this).parent().addClass('current_dropdown');
	}); //Find sub and fade it in
    (function($j) {
        //Function to calculate total width of all ul's
        jQuery.fn.calcSubWidth = function() {
            rowWidth = 0;
            //Calculate row
            $j(this).find('ul').each(function() { //for each ul...
                rowWidth += $j(this).width(); //Add each ul's width together
            });
        };
    })(jQuery);

    if ( $j(this).find('.row').length > 0 ) { //If row exists...
        var biggestRow = 0;	

        $j(this).find('.row').each(function() {	//for each row...
            $j(this).calcSubWidth(); //Call function to calculate width of all ul's
            //Find biggest row
            if(rowWidth > biggestRow) {
                biggestRow = rowWidth;
            }
        });

        $j(this).find('.sub-menu').css({'width' :biggestRow}); //Set width
        $j(this).find('.row:last').css({'margin':'0'});  //Kill last row's margin

    } else { //If row does not exist...

        // $j(this).find('.sub-menu').css('position','static'); //Set Width
        $j(this).calcSubWidth();  //Call function to calculate width of all ul's
        // $j(this).find('.sub-menu').css('position','absolute'); //Set Width
        $j(this).find('.sub-menu').css({'width' : rowWidth}); //Set Width
    }
};

//On Hover Out
function megaHoverOut(){
//	$j(this).find('.sub-menu').stop().fadeTo('fast', 0, function() { //Fade to 0 opactiy
	$j(this).find('.sub-menu').stop().fadeTo(0, 0, function() { //Fade to 0 opactiy
		$j(this).hide();  //after fading, hide it
		$j(this).parent().removeClass('current_dropdown');
	});
}

//	Adds current class to first banner; triggers animation
function animateBanner() {
	var $banners = $j('#banner ol .banner');
	if ($banners.length > 1) {
		createBannerSelector($banners);
		var $next = $banners.first();
		$next.addClass('current');
		// get banner-selector-[id] and addClass('active')
		var $next_id = $next.attr('id');
		var $next_id_split = $next_id.split('-');
		var $next_id_number = $next_id_split[($next_id_split.length)-1];
		var $next_selector = $j('#banner-selector-'+$next_id_number);
		$next_selector.addClass('active');
		startAnimation();
	};
};

function startAnimation() {
		$banner_animation = setInterval("changeBanner()", 10000);
};

//	Swaps classes and animates banners
function changeBanner() {
	var $current = $j('#banner ol .current');	
	if ($current.length == 0) $current = $j('#banner ol .banner:last');
	var $next = $current.next().length ? $current.next()
		: $j('#banner ol .banner:first');
	
	$current.addClass('last-current');
	
	// get banner-selector-[i] and removeClass('active')
	var $current_id = $current.attr('id');
	var $current_id_split = $current_id.split('-');
	var $current_id_number = $current_id_split[($current_id_split.length)-1];
	var $current_selector = $j('#banner-selector-'+$current_id_number);
	$current_selector.removeClass('active');
	// get banner-selector-[id] and addClass('active')
	var $next_id = $next.attr('id');
	var $next_id_split = $next_id.split('-');
	var $next_id_number = $next_id_split[($next_id_split.length)-1];
	var $next_selector = $j('#banner-selector-'+$next_id_number);
	$next_selector.addClass('active');

	$next.css({opacity: 0})
		.addClass('current')
		.animate({opacity: 1}, 1000, function() {
			$current.removeClass('current last-current');
		});
};

// create banner selector and populate with buttons for each banner
function createBannerSelector($banners) {
	$j('<ol id="banner-selector"></ol>')
		.appendTo('.home #banner')
		.mouseenter(function() {
			// stop animation
			clearInterval($banner_animation);
		})
		.mouseleave(function() {
			// restart animation
			startAnimation();
		})
	$banners.each(function(index){
		$j(this).attr('id','banner-'+index);
		$j('<li id="banner-selector-'+index+'"></li>').appendTo('#banner-selector');
		$j('<a href="#">'+(index+1)+'</a>')
			.appendTo('#banner-selector-'+index)
			.click(function(event){
				jumpToBanner(index);
				event.preventDefault();
				// get banner-[id] and change to addClass .current
			})
	});
};

// jump to banner when number is clicked/hovered
function jumpToBanner($banner_id) {
	var $current = $j('#banner ol .current');
	$current.removeClass('current');
	// get banner-selector-[i] and removeClass('active')
	var $current_id = $current.attr('id');
	var $current_id_split = $current_id.split('-');
	var $current_id_number = $current_id_split[($current_id_split.length)-1];
	var $current_selector = $j('#banner-selector-'+$current_id_number);
	$current_selector.removeClass('active');
	
	var $next = $j('#banner-'+$banner_id);
	$next.addClass('current');
	// get banner-selector-[id] and addClass('active')
	var $next_id = $next.attr('id');
	var $next_id_split = $next_id.split('-');
	var $next_id_number = $next_id_split[($next_id_split.length)-1];
	var $next_selector = $j('#banner-selector-'+$next_id_number);
	$next_selector.addClass('active');
};