/*

Required format:

$('#fader').vodoriContentFader({
	autoPlay: false,
	interval: 3000,
	pager: '#fader-pager',
	speed: 1000
	toggleClass: 'is-toggled'
});

<div id="fader">
	<div>Red</div>
	<div>Yellow</div>
	<div>Green</div>
	<div>Cyan</div>
	<div>Blue</div>
	<div>Magenta</div>
</div>

<ul id="fader-pager">
	<li><a href="#play">Play</a></li>
	<li><a href="#stop">Stop</a></li>
	<li><a href="#prev">&larr;</a></li>
	<li><a href="#1">R</a></li>
	<li><a href="#2">Y</a></li>
	<li><a href="#3">G</a></li>
	<li><a href="#4">C</a></li>
	<li><a href="#5">B</a></li>
	<li><a href="#6">M</a></li>
	<li><a href="#next">&rarr;</a></li>
</ul>

NOTE: Assumes predefined width and height on parents

*/

(function($) {
	$.fn.vodoriContentFader = function(options) {

		var defaults = {
			autoPlay: true,
			interval: 3000,
			pager: null,
			speed: 'slow',
			toggleClass: 'is-toggled'
		};

		var settings = $.extend({}, defaults, options);

		this.each(function() {

			var $this = $(this);

			var faderPlaying = false;
			var faderWasPlaying = false;

			if ($this.css('position') == 'static') {$this.css('position', 'relative');}

			// Set sizes of the child div tags
			$this.children('div').each(function() {
				$(this).css({
					'height': $(this).parent().height(),
					'position': 'absolute',
					'width': $(this).parent().width()
				});
			});

			// Hide all but the first
			$this.children('div').not(':first').hide();

			// Reveal a particular panel
			faderControl = function(target) {
				$current = $this.children('div:visible:last');

				if(!target || target == 'next') {
					target = $current.prevAll().length + 2;
					faderWasPlaying = true;
				} else if (target == 'prev') {
					target = $current.prevAll().length;
				} else if (target == 'play') {
					if (!faderPlaying) {faderPlay();}
					return;
				} else if (target == 'stop') {
					if (faderPlaying) {faderStop();}
					faderWasPlaying = false;
					return;
				}

				if (target < 1 || target > $this.children('div').length) {
					target = 1;
				}

				$next = $this.children('div:nth-child(' + (target) + ')');

				console.log('target: ' + target);

				$(settings.pager).each(function() {
					$(this).find('a').each(function() {
						if ($(this).attr('href').split('#')[1] == target) {
							$(this).addClass(settings.toggleClass);
						} else {
							$(this).removeClass(settings.toggleClass);
						}
					});
				});

				$current.fadeOut(settings.speed, function() {
					$next.fadeIn(settings.speed);
				});
			}

			// Start auto-fading
			faderPlay = function() {
			//	console.log('faderPlay() called');
				if (faderPlaying) {return;}
				faderOn = setInterval('faderControl()', settings.interval);
				faderPlaying = true;
			}

			// Stop auto-fading
			faderStop = function() {
			//	console.log('faderStop() called');
				clearInterval(faderOn);
				faderPlaying = false;
				faderWasPlaying = false;
			}

			// Connect the pager buttons
			$(settings.pager).each(function() {
				$(this).find('a').each(function() {
					$(this).click(function() {
						faderControl($(this).attr('href').split('#')[1]);
					});
				});
			});

			// Stop fading while we hover
			$this.add(settings.pager).hover(
				function() {
					if (faderPlaying) {
						faderStop();
						faderWasPlaying = true;
					}
				},
				function() {
					if (faderWasPlaying == true) {faderPlay();}
					faderWasPlaying = false;
				}
			);

			// Autoplay
			if (settings.autoPlay == true) {
				faderPlay();
			}

		});

		return this;

	}
})(jQuery);