/*!
 * WorryFreeLabs Three-way Slider
 *
 * @version     1.2.1
 * @category    WorryFreeLabs
 * @package     js
 * @copyright   Copyright (c) 2010 Worry Free Labs, LLC. (http://worryfreelabs.com/)
 * @author      Oleksandr Bernatskyi
 */
;(function($)
{
	$.fn.extend
	({
		drieWegSlider: function(options)
		{
			var defaults =
			{
				animationDuration: 1200,
				hoofdSlideBreedte: 627,
				hoofdSlideHoogte: 398,
				tweedeSlideBreedte: 310,
				tweedeSlideHoogte: 188,
				derdeSlideBreedte: 310,
				derdeSlideHoogte: 188,
				overlay: '.overlay',
				overlayControl: null,
				controls: false,
				controlsContainer: null,
				autoMode: true,
				pauseInterval: 3000
			};
			
			var options = $.extend(defaults, options);
			
			return this.each
			(
				function()
				{
					var o = options;
					var $this = $(this);
					var $slideList = $('ul', $this);
					
					// Number of slides
					var slidesNumber = $('> li', $slideList).length;
					
					// Slide wrapper
					var slideWrapper = '<div class="slide"></div>';
					
					// Sliders
					var $slider = $slideList.find('li:first');

					var $slidePattern = $('<div class="slider">' + slideWrapper + '</div>').css('position', 'relative');
					
					// hoofd slider
					$('div.hoofd', $slider).wrapInner
					(
						$slidePattern.clone()
							.css({
								top: 0,
								left: 0,
								width: o.hoofdSlideBreedte,
								height: o.hoofdSlideHoogte * slidesNumber
							})
					).css('position', 'relative');
					
					var $hoofdSlider = $('div.hoofd div.slider', $slider);
					
					// tweede Slider
					$('div.tweede', $slider).wrapInner
					(
						$slidePattern.clone()
							.css({
								top: (-slidesNumber + 1) * o.tweedeSlideHoogte,
								left: 0,
								width: o.tweedeSlideBreedte,
								height: o.tweedeSlideHoogte * slidesNumber
							})
					).css('position', 'relative');
					
					var $tweedeSlider = $('div.tweede div.slider', $slider);
					
					// derde Slider
					$('div.derde', $slider).wrapInner
					(
						$slidePattern.clone()
							.css({
								top: 0,
								left: 0,
								width: o.derdeSlideBreedte * slidesNumber,
								height: o.derdeSlideHoogte
							})
					).css('position', 'relative');
					
					var $derdeSlider = $('div.derde div.slider', $slider);
					
					
					// Move all images into the slider
					$('li:not(:first)', $slideList).each
					(
						function()
						{
							
							var $this = $(this);
							
							$('div.hoofd', $this).wrapInner(slideWrapper).children().appendTo($hoofdSlider);
							$('div.tweede', $this).wrapInner(slideWrapper).children().prependTo($tweedeSlider);
							$('div.derde', $this).wrapInner(slideWrapper).children().appendTo($derdeSlider);
							
							$this.remove();
						}
					);
					
					
					// Controls generator
					var $controls = null;
					
					if (o.controls)
					{
						$controls = $('<ul></ul>').appendTo($(o.controlsContainer));
						
						var controlClick = function(event)
						{
							event.preventDefault();
							disableAutoMode();
							
							var index = $(this).parent().index();
							
							animate(index);
						};
						
						var index;
						
						for (index = 0; index < slidesNumber; index++)
						{
							$('<a href="#"></a>')
								.bind('click', controlClick)
								.wrap('<li></li>')
								.parent()
									.appendTo($controls);
						}
					}
					
					
					// Current slide number, used in animation function
					var currentSlide = 0;
					
					// Set the current slide number and mark the control link as active
					function setCurrentSlide(slideIndex)
					{
						currentSlide = parseInt(slideIndex) < slidesNumber ? parseInt(slideIndex) : 0;
						
						if (o.controls)
						{
							$('a', $controls).removeClass('active');
							$('li:eq(' + currentSlide + ')', $controls).find('a').addClass('active');
						}
					}
					
					
					// Actual animation effect
					function animate(slideIndex)
					{
						setCurrentSlide(slideIndex);
						setOverlayClickable();
						
						$hoofdSlider.stop().animate({top: -currentSlide * o.hoofdSlideHoogte}, o.rewindDuration);
						$tweedeSlider.stop().animate({top: (-slidesNumber + currentSlide + 1) * o.tweedeSlideHoogte}, o.rewindDuration);
						$derdeSlider.stop().animate({left: -currentSlide * o.derdeSlideBreedte}, o.rewindDuration);
					}
					
					
					// Overlay
					var $overlay = $(o.overlay, $this);
					
					function getOverlayLink()
					{
						return $('.slide:eq(' + currentSlide + ') a:first', $hoofdSlider);
					}
					
					function setOverlayClickable()
					{
						var $link = getOverlayLink();
						
						if ($link.length)
						{
							$overlay.addClass('clickable');
						}
						else
						{
							$overlay.removeClass('clickable');
						}
					}
					
					$overlay.click
					(
						function(event)
						{
							event.preventDefault();
							
							var $link = getOverlayLink();
							
							if ($link.length)
							{
								disableAutoMode();
								window.location = $link.attr('href');
							}
						}
					);
					
					
					// Overlay control
					var $overlayControl = $(o.overlayControl, $this);
					
					$overlayControl.click
					(
						function(event)
						{
							event.preventDefault();
							event.stopPropagation();
							
							$overlayControl.blur();
							disableAutoMode();
							
							animate(currentSlide + 1);
						}
					);
					
					
					// AutoScrolling
					var autoModeIntervalId = 0;
					
					if (o.autoMode)
					{
						var autoModeFunction = function()
						{
							animate(currentSlide + 1);
						};
						
						autoModeIntervalId = setInterval(autoModeFunction, o.pauseInterval);
					}
					
					function disableAutoMode()
					{
						if (o.autoMode)
						{
							clearInterval(autoModeIntervalId);
							o.autoMode = false;
						}
					}
					
					
					// Initialization
					animate(0);
				}
			);
		}
	});
})(jQuery);