(function($, window, undefined) {
	var height = 0,
		feature = $('#featured'),
		events = feature.find('> .event'),
		nav = $('<div id="feature-nav"><ul /></div>'),
		navList = nav.find('ul'),
		calculateHeight = function() {
			events.each(function(i, event) {
				event = $(event);
				height = Math.max(height, event.height(), event.outerHeight());
			});
		};

	if(events.length < 2) {
		return;
	}

	for(var i = 1; i <= events.length; i++) {
		navList.append('<li id="feature-nav-' + i + '"' + (i == 1 ? ' class="active"' : '') +
			'><button type="button">' + i + '</button></li>');
	}

	feature.prepend(nav);

	calculateHeight();
	feature.addClass('dynamic').height(height);

	$(window).load(function() {
		var previousHeight = height;
		calculateHeight();
		if(height != previousHeight) {
			feature.height(height);
		}
	});

	nav.find('button').click(function(e) {
		var eventActive = feature.find('.event-active'),
			itemActive = nav.find('.active'),
			button = $(this),
			buttonItem = button.closest('li'),
			selectedId = buttonItem.attr('id').replace(/^feature-nav-/, ''),
			selectedEvent = $('#featured-event-' + selectedId),
			multiplier = e.shiftKey ? 10 : 1,
			fadeSpeed = 500 * multiplier;

		if(selectedEvent[0] == eventActive[0]) {
			return;
		}

		itemActive.removeClass('active');
		buttonItem.addClass('active');
		eventActive.show().fadeOut(fadeSpeed, function() {
			eventActive.removeClass('event-active');
		});
		selectedEvent.fadeIn(fadeSpeed, function() {
			selectedEvent.addClass('event-active');
		});
	});
})(jQuery, this);