/*
 * 	Blurred Slidshow 0.1.2 - jQuery plugin
 *	written by Adrian Osmond
 *	http://adrianosmond.com/
 *
 *	Copyright (c) 2010 Adrian Osmond (http://adrianosmond.com)
 *	Dual licensed under the MIT (MIT-LICENSE.txt)
 *	and GPL (GPL-LICENSE.txt) licenses.
 *
 *  ========= HEAVILY BASED ON: ==========
 *
 * 	Easy Slider 1.7 - jQuery plugin
 *	written by Alen Grakalic	
 *	http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding
 *
 *	Copyright (c) 2009 Alen Grakalic (http://cssglobe.com)
 *	Dual licensed under the MIT (MIT-LICENSE.txt)
 *	and GPL (GPL-LICENSE.txt) licenses.
 *
 *	Built for jQuery library
 *	http://jquery.com
 *
 */
 
/*
 *	markup example for $("#slider").blurredSlideshow();
 *	
 * <div id="slider">
 *   <ul>
 *     <li><img src="img1-blur.png" alt="image1-blur" /><img src="img1.png" alt="image1" class="noblur" /></li>
 *     <li><img src="img2-blur.png" alt="image2-blur" /><img src="img2.png" alt="image2" class="noblur" /></li>
 *     <li><img src="img3-blur.png" alt="image3-blur" /><img src="img3.png" alt="image3" class="noblur" /></li>
 *     <li><img src="img4-blur.png" alt="image4-blur" /><img src="img4.png" alt="image4" class="noblur" /></li>
 *     <li><img src="img5-blur.png" alt="image5-blur" /><img src="img5.png" alt="image5" class="noblur" /></li>
 *   </ul>
 * </div>
 *
 */

(function($) {

	$.fn.blurredSlideshow = function(options){
	    window.animating = false;
		// default configuration properties
		var defaults = {
			speed: 			800,
			showDuration:			2000,
			noBlurName: "noblur", 
			nextId: null,
			prevId: null,
			numVisible: 3, //show 3 images by default - odd numbers work best as they allow one to be in the middle
			growth: 2.5 //zoom the middle image by 150% by default
		}; 
		
		var options = $.extend(defaults, options);
				
		this.each(function() {  
			var obj = $(this); 				
			var numItems = $("li", obj).length;
			var w = $("li", obj).width(); 
			var h = $("li", obj).height(); 
			var centreObject=Math.ceil(options.numVisible/2);
			var newW = options.growth*w;
			var newH = options.growth*h;
			var wDiff = newW-w;
			var hDiff = newH-h;
			var halfWDiff = Math.round(wDiff/2);
			var halfHDiff = Math.round(hDiff/2)
			
			$("."+options.noBlurName).css({
			    position: "relative",
                top: "-"+(5+h)+"px",
                zIndex: "20",
                opacity: "0",
                display: "block",
                padding: "0px"
			});
			
			$("ul li:nth-child(" + centreObject + ") ."+options.noBlurName, obj).css({
			  opacity: 1,
			  marginTop: '-' + halfHDiff + 'px',
			  marginLeft: '-' + halfWDiff + 'px',
			  width: newW+'px',
			  height: newH+'px'
			});
			
			$("ul", obj).css({
			  width: (numItems*w),
			  paddingTop: halfHDiff,
			  paddingBottom: halfHDiff,
			  paddingLeft: 0,
			  margin: 0,
			  listStyle: "none"
			});
						
			obj.css({
			  width: (options.numVisible*w),
			  overflow: "hidden",
			  height: newH
			});
			
			// init
			if (options.showDuration != 0)
                var timeout = setTimeout(function(){ animate(); }, options.showDuration);
            
            if (options.nextId != null)
            {
                $("#" + options.nextId).click(function(){
                    if (!window.animating)
                    {
                        options.showDuration=0;
                        reverseAnimate(); 
                    }
                });
            }
                
            if (options.prevId != null)
            {
                $("#" + options.prevId).click(function(){
                    if (!window.animating)
                    {
                        options.showDuration=0;
                        animate(); 
                    }
                });
            }
			
			function adjust(){
				$("ul", obj).append($("ul li:first-child", obj));
				$("ul",obj).css("margin-left",(0));
				window.animating=false;
			};
			
			function animate() {
			    window.animating = true;
				var speed = options.speed;
				var p = (w*-1);
				
		        $("ul",obj).animate(
					{ marginLeft: p }, 
					{ queue:false, duration:speed, complete:adjust }
				);
				
				$("ul li:nth-child(" + (centreObject + 1) + ") ."+options.noBlurName, obj).animate({ 
  				  opacity: 1,
  				  marginTop: '-'+halfHDiff+'px',
  				  marginLeft: '-'+halfWDiff+'px',
  				  width: newW+'px',
  				  height: newH+'px'
  				},{ queue:false, duration:speed}
				);
        
				$("ul li:nth-child(" + centreObject + ") ."+options.noBlurName, obj).animate({ 
  				  opacity: 0,
  				  marginTop: '0px',
  				  marginLeft: '0px',
  				  width: w+'px',
  				  height: h+'px'
				  }, {queue:false, duration:speed }
				);
				
				if (options.showDuration != 0)
				    timeout = setTimeout(function(){ animate(); },options.speed+options.showDuration);
			}
			
			function reverseAdjust(){
				$("ul", obj).prepend($("ul li:last-child", obj));
				$("ul",obj).css("margin-left",(-1*w));
			};
			
			function reverseAnimate() {
			    window.animating=true;
			    reverseAdjust()
				var speed = options.speed;
				var p = w;

			    $("ul",obj).animate(
					{ marginLeft: 0 }, 
					{ queue:false, duration:speed, complete: function() {window.animating=false;} }
				);
				
				$("ul li:nth-child(" + centreObject + ") ."+options.noBlurName, obj).animate({ 
  				  opacity: 1,
  				  marginTop: '-'+halfHDiff+'px',
  				  marginLeft: '-'+halfWDiff+'px',
  				  width: newW+'px',
  				  height: newH+'px'
  				},{ queue:false, duration:speed}
				);
        
				$("ul li:nth-child(" + (centreObject+1) + ") ."+options.noBlurName, obj).animate({ 
  				  opacity: 0,
  				  marginTop: '0px',
  				  marginLeft: '0px',
  				  width: w+'px',
  				  height: h+'px'
				  }, {queue:false, duration:speed }
				);
			}
			
		});
	  
	};

})(jQuery);