jQuery(function($) {
	var animationType = 'fade', // 'fade' or 'slide'
		panelFadeDuration = 600,
		panelDuration = 1000,
		featureDuration = 1500,
		featureCount = 0,
		featureLooped = true,
		feature = $('#feature'),
		features = $('.feature', feature[0]),
		featuresContainer = $('.features'),
		navButtons = $('#feature-navigation button'),
		featureWidth = features.width(),
		currentFeature,
		panelTimer,
		callToActionTimer,
		featureTimer,
		showFeature = function(feature, previousFeature) {
			currentFeature = feature;

			if(previousFeature !== undefined) {
				if(!$('#feature').hasClass('stop-animation')) {
					var featureIndex = features.index(feature);

					if(animationType == 'fade') {
						$(feature).find('li, .call-to-action').hide().end().fadeIn(panelFadeDuration);
						$(previousFeature).find('li, .call-to-action').hide().end().fadeOut(panelFadeDuration);
					} else {
						$(feature).show().find('li, .call-to-action').hide();
						featuresContainer.animate({
							marginLeft: (-1 * featureWidth * featureIndex) + 'px'
						}, {
							duration: panelFadeDuration,
							complete: function() {
								features.not(':eq(' + featureCount + ')')
									.find('li, .call-to-action').fadeOut(panelFadeDuration);
							}
						});
					}

					featureCount = features.index(feature);
				}

				if(featureCount == 0) {
					$('#feature-previous').addClass('disabled');
				} else {
					$('#feature-previous').removeClass('disabled');
				}
				if(featureCount == features.length - 1) {
					$('#feature-next').addClass('disabled');
				} else {
					$('#feature-next').removeClass('disabled');
				}

				navButtons.not($(navButtons[featureCount]).addClass('active')).removeClass('active');
			}

			var panels = $('li', feature),
				panelCount = 0,
				callToAction = $('.call-to-action', feature),
				fadeInComplete = function() {
					panelCount++;
					if(panelCount < panels.length) {
						panelTimer = setTimeout(function() {
							$(panels[panelCount - 1]).fadeOut(panelFadeDuration);
							$(panels[panelCount]).fadeIn({
								duration: panelFadeDuration,
								complete: fadeInComplete
							});
						}, panelDuration);
					} else {
						callToActionTimer = setTimeout(function() {
							callToAction.fadeIn({
								duration: panelFadeDuration,
								complete: function() {
									if($('#feature').hasClass('stop-animation')) {
										return;
									}
									featureTimer = setTimeout(function() {
										if(features.length > 1) {
											featureCount = features.length > featureCount + 1 ?
												featureCount + 1 : 0;

											if(featureCount == 0 && !featureLooped) {
												return;
											}
											var nextFeature = features[featureCount];
											showFeature(nextFeature, feature);
										}
									}, featureDuration);
								}
							});
						}, panelDuration / 2);
					}
				};

			$(panels[panelCount]).fadeIn({
				duration: panelFadeDuration,
				complete: fadeInComplete
			});
		};

	if(features.length > 1) {
		$('#feature button').css({
			display: 'block'
		});
	}


	if(animationType == 'fade') {
		features.css({
			'float': 'none',
			position: 'absolute',
			top: 0,
			left: 0
		}).not(':eq(0)').hide();
	} else {
		$('.features').width(featureWidth * features.length);
	}

	$('#feature button, #feature-navigation button').click(function(e) {
		var button = $(this),
			id = button.attr('id');

		if(button.hasClass('disabled')) {
			return;
		}

		if(panelTimer) {
			clearTimeout(panelTimer);
		}
		if(callToActionTimer) {
			clearTimeout(callToActionTimer);
		}
		if(featureTimer) {
			clearTimeout(featureTimer);
		}
		feature.removeClass('stop-animation');

		var index = features.index(currentFeature);
		if(/-previous$/.test(id) && index > 0) {
			index--;
		} else if(/-next$/.test(id) && index < features.length - 1) {
			index++;
		} else if(button.parents('#feature-navigation').length) {
			index = navButtons.index(button);
		}
		showFeature(features[index], currentFeature);
		feature.addClass('stop-animation');
	});

	showFeature(features[0]);
});