Space out menus evenly

spacenav.js

(function($){

	// Space out menu items evenly

	$.fn.spaceNav = function() {

		var mainMenu = $(this).find('.nav-collapse').find('.nav');
		var weatherMenu = $(this).find('#nav-weather');
		var menuItems = $(this).find('li');
		var menuLinks = $(this).find('li').find('a');

		//Undo flex menu
		if(mainMenu.hasClass('has-flex')) {
			mainMenu.removeClass('has-flex');
			mainMenu.removeAttr('style');
			mainMenu.flexMenu({undo:true});
		}

		// If the menu hasn't collapsed
		if($(window).width() > 979) {

			// Restore defaults
			menuLinks.css({
		      paddingLeft : 7,
		      paddingRight: 7
		    })

		    // Get the widths
			var containerWidth = $(this).find('.container').width();
			var brandWidth = $(this).find('.brand').width() + 10; // Add 10 for the right padding on the logo
			if ($(this).find('.ad-wrapper').is(":visible") ) {
				var adWidth = 120;
			} else {
				var adWidth = 0;
			}
			// Count the number of nav items	
			var navCount = menuItems.length; 	
			// Calculate available width for the nav to fit in
			var availableWidth = containerWidth - (brandWidth+adWidth);
			// Current width is primary menu plus weather menu plus extra for the border widths
			var currentWidth = mainMenu.width() + weatherMenu.width() + navCount + 1;
			// Calculate leftover width available for padding
			var leftoverWidth = availableWidth - currentWidth;
			// Divide leftover width amongst menu items and add back the 7 default to get padding
			var padding = (Math.floor(leftoverWidth / (navCount*2)))+7;
			// If there's not enough space activate flexMenu for overflow


			if(availableWidth < currentWidth) {
				mainMenu.addClass('has-flex').css({width:availableWidth - weatherMenu.width() - navCount - 1}).flexMenu();
			// Otherwise set the padding
			} else {

				menuLinks.css({
			      paddingLeft : padding,
			      paddingRight: padding
			    });
			}

		}
	};
});