/*! HACKED TO BITS FOR RIPLPEFFECT "DOCK" USE
##
##	swooshGallery
##	
##  Author: Liam Potter
##	Email:	liam@designedbyevo.com
##
##	Version:		0.7
##	Created:		27/05/09
##	Updated:		10/07/09
##
##
##	Change List:
##	0.1 - First Version (rewrite of old gallery script)
##	0.2 - Fixed pause to pause as soon as clicked
##	0.3 - Automatically insert fist large image, no need for markup
##	0.4 - Fixed auto-scroll to scroll when the last thumbnail had finished it's time
##		  Removed some useless code which put the thumbnails into groups using classes
##	0.5 - Fixed problem with finding correct offset for the hover image to appear
##	0.6 - Remembered about nth-child, got rid of now useless code
##	0.7 - a few fixes, scrolling the thumbnails now pauses
##		  Clicking a thumbnail honors the current state, if paused, it will be paused, if playing, it will play through
##
##	
##	Copyright © 2009 Liam Potter
##	
##	This file is part of swooshGallery.
##
##  swooshGallery is free software: you can redistribute it and/or modify
##  it under the terms of the GNU General Public License as published by
##  the Free Software Foundation, either version 3 of the License, or
##  (at your option) any later version.
##
##  swooshGallery is distributed in the hope that it will be useful,
##  but WITHOUT ANY WARRANTY; without even the implied warranty of
##  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
##  GNU General Public License for more details.
##
##  You should have received a copy of the GNU General Public License
##  along with swooshGallery.  If not, see <http://www.gnu.org/licenses/>.
##	
*/

(function($) {

	$.fn.swoosh = function(options) {
		var defaults = {
			delay: 5000,
			autoPlay: false,
			hover: true,
			arrow: '/assets/images/swoosh/arrow.gif',
			thumbs: '/assets/images/content/thumbs/',
			thumbsHover: '/assets/images/content/thumbs/hover/',
			largeImg: '/assets/images/content/'
		};
		var settings = $.extend(defaults, options);
		
		var autoPlay = settings.autoPlay;
		
		this.each(function() {
						   
			/**********************************************************
			* Setup vars etc and wrap images in container			  *
			**********************************************************/
			var thumbs = $(this).find("div.slider")		    
			var thumbCount = thumbs.children("a").size();
			var thumbWidth = thumbs.children("a").width();
			var sliderWidth = $(this).find("div.slider").width();
			var thumbsShown = (Math.round(sliderWidth/thumbWidth)-1);
			
			if ($.browser.msie && $.browser.version.substr(0,1)<7) {
				var containerWidth = ((thumbWidth+8) * thumbCount);	
			} else {
				var containerWidth = ((thumbWidth+6) * thumbCount);
			}
			var widthOfThumbs = ((thumbWidth+6) * thumbsShown)
			var pages = ((thumbWidth * thumbCount)/(thumbWidth * thumbsShown));
			var pages = Math.ceil(pages);
			
			thumbs.children("a").wrapAll('<div class="container" style="position:absolute;width:'+containerWidth+'px"></div>');
			
			var imgIndex = $(this).index(this)	
			
			thumbs.find("img:last").addClass("lastImage");
			
			//counter
			countIndex = 0
			
			
			
			
			
			var scrollCount = 1;
			function scrollRight() {
				if ( scrollCount < pages ) {				
					thumbs.find("div.container").animate({left:'-='+(widthOfThumbs)+'px'},800);
					scrollCount++
				}
			}
			
			function scrollLeft() {
				if ( scrollCount > 1 ) {
					thumbs.find("div.container").animate({left:'+='+(widthOfThumbs)+'px'},800);
					scrollCount--
				}
			}
		

			
			
		
			
			$("div#controls div#thumbnails a.left").click(function(){
				scrollLeft();
				return false;
			});
			$("div#controls div#thumbnails a.right").click(function(){
				scrollRight();
				return false;
			});
			
			/**********************************************************
			* hover thumbnail                                         *
			**********************************************************/
			
				
				$("div#controls div#thumbnails div.slider div.container").find("img").each(function(){
					$(this).attr("id",countIndex++);
					
					$(this).hoverIntent(
						function()
						{
							var offsetSwoosh = $(this).parents("div#swoosh").offset().left;
							var offset = (($(this).offset().left - offsetSwoosh)-21);
							
							var hoverThumb = $(this).attr("src");
							
							$(this).parents("div#swoosh").append('<div class="hover" style="left:'+offset+'px;display:none;"><span></span><img src="'+settings.arrow+'" class="arrow" width="29" height="15" alt="" /></div>')
							.find('div.hover')
							.css({display:'block',opacity:0})
							.animate({opacity:1},400);
							
							
							zIndex = 100;  
							fadeIndex = 0;  
							var otherImgs = $(this).parents("a").find("img");
							
							otherImgs.each(function(){
								var srcImg = $(this).attr("src")
								imgs = '<img id="'+ fadeIndex++ +'" src="'+srcImg+'" width="120" height="72" alt="" class="hoverImg" style="z-index:'+ zIndex-- +'display:none;">'
								$("div.hover span").append(imgs);
							});
							
							$("div.hover span img:last").addClass('last');
							
							imgFade = 1;
							console.log(imgFade);
							play();
							function play(){
									
								
								//$("div.hover img.arrow").css({opacity:1,display:'block'});
								
								$("div.hover span img").css({display:'block',opacity:0});									
								$("div.hover span img").eq(imgFade).animate({opacity:1},450).animate({left:0},2000,function(){
								imgFade++																																
								console.log(imgFade);
									if($(this).hasClass("last")){
										$(this).animate({opacity:0},450);
										imgFade = 0;
										console.log('last');
										play();
									} else {
										$(this).animate({opacity:0},450);
										play();
									}
									
								});
							}
							
						}
						,
						function()
						{
							
								
								
								$("div.hover * *").stop();
								$("div.hover").fadeOut(200,function(){$(this).remove();});
							
					
						});
				});
			
			
		});
		
		
		return this; //keep chain ability
	}//close jquery function
	
})(jQuery);