/*
 * Carter Digital Slider v1.0.0
 * Date: 25 May 2011
 *
 * Copyright 2011, Carter Digital
 * 
 
 HTML SHOULD LOOK LIKE:
 --------------------------------
 
<div class="cd_slider">
		
	<div class="slides">
		<div class="main_nav">
			<a href="javascript:;" class="prev"></a>
			<a href="javascript:;" class="next"></a>
		</div>
		<!-- JS CREATES SLIDES -->
	</div>
	
	<div class="thumbs">
		<div class="thumb_nav">
			<a href="javascript:;" class="prev"></a>
			<a href="javascript:;" class="next"></a>
		</div>
		<div class="thumb_mask">
			<ul>
				<li>
					<a href="images/uploads/gallery_large_1.jpg">
						<img src="images/uploads/gallery_thumb_1.jpg" alt="gallery_large_1" />
					</a>
				</li>
			</ul>
		</div>
		
	</div>
</div>
 
 */

(function($) {
	
	$.fn.cd_slider = function(params){

		var defaults = {
			'transition_speed'	:	'1000',
			'auto_play'			:	false,
			'pause_time'		:	'3000'
		};
		
		options = $.extend(defaults, params);
		
		var div = $(this);
		var slides = div.find('.slides');
		var thumbs = div.find('.thumbs');
		var thumb_mask = thumbs.find('.thumb_mask');
		var main_nav = slides.find('.main_nav');
		var thumb_nav = thumbs.find('.thumb_nav');
		var t = null;
		
		var active = null;
		var last_active = null;
		
		if(thumb_mask.length != 0)
		{
			var thumb_width = 100;
			var thumbs_width = thumb_mask.find('li:last').position().left - 500;
		}
		
		var generate_slides = (slides.find('.slide').length == 0) ? true : false;
		
		
		// set up slides based on thumbs
		if(generate_slides)
		{
			thumb_mask.find('a').each(function(i){
		
				$(this).attr('rel', i);
				
				slides.append('<div class="slide" rel="'+i+'"></div>');
				
			});
		}
		else
		{

			slides.find('.slide').each(function(i){
				$(this).attr('rel', i);
				
				if(thumb_mask.length != 0)
				{
					thumb_mask.find('a').eq(i).attr('rel',i);
				}
			});
			
			
		}
		
		
		
		// setup links
		if(thumb_mask.length != 0)
		{
			thumb_mask.find('a').click(function(){
				
				var rel = $(this).attr('rel');
				var href = $(this).attr('href');
				
				change_slide(rel, href);
				
				clearInterval(t);
				
				return false;
			});
			
			// trigger first image link
			thumb_mask.find('a').first().trigger('click');
		}
		else
		{
			// need to trigger first slide
			change_slide(0,"");
		}
		
		
		
		function change_slide(rel, href)
		{
			
			last_active = active;
			active = slides.find('.slide[rel="'+rel+'"]');
			
			// thumb active
			if(thumb_mask.length != 0)
			{
				thumb_mask.find('li').removeClass('active');
				thumb_mask.find('li').eq(rel).addClass('active');
			}
			
			
			// load image if neccesary
			if(generate_slides == true && active.find('img').length == 0)
			{
				active.append('<img src="'+href+'" />');
			}
			
			// change active classes
			if(last_active != null)
			{
				last_active.removeClass('active').addClass('last_active');
			}
			
			
			// fade in new active slide
			active.css({opacity: 0.0})
		        .addClass('active')
		        .animate({opacity: 1.0}, options.transition_speed, function() {
		            if(last_active != null)
					{
		            	last_active.removeClass('last_active');
		            }
		        });
			
		}
		
		
		
		// main prev / next
		main_nav.find('a.next').click(function(){
		
			var active_rel = active.attr('rel');
			var next_rel = parseInt(active_rel) + 1;
			
			if(thumb_mask.length != 0)
			{
				if(thumb_mask.find('a[rel="'+next_rel+'"]').length != 0)
				{
					// this thumb exists
					var href = thumb_mask.find('a[rel="'+next_rel+'"]').attr('href');
					change_slide(next_rel, href);
				}
			}
			else
			{
				if(slides.find('.slide[rel="'+next_rel+'"]').length != 0)
				{
					change_slide(next_rel, "");
				}
				
			}
			
			clearInterval(t);
			
			return false;
			
		});
		
		// main prev / next
		main_nav.find('a.prev').click(function(){
		
			var active_rel = active.attr('rel');
			var next_rel = parseInt(active_rel) - 1;
			
			if(thumb_mask.length != 0)
			{
				if(thumb_mask.find('a[rel="'+next_rel+'"]').length != 0)
				{
					// this thumb exists
					var href = thumb_mask.find('a[rel="'+next_rel+'"]').attr('href');
					change_slide(next_rel, href);
				}
			}
			else
			{
				if(slides.find('.slide[rel="'+next_rel+'"]').length != 0)
				{
					change_slide(next_rel, "");
				}
			}
			
			clearInterval(t);
			
			return false;
			
		});
		
		
		// thumb nav
		thumb_nav.find('a.next').click(function(){
			
			//console.log('thumb_mask='+thumb_mask.scrollLeft()+', thumbs_width='+thumbs_width);
			
			if(thumb_mask.scrollLeft() < thumbs_width)
			{
				thumb_mask.animate({'scrollLeft' : '+='+thumb_width+'px'}, 150);
			}
			else
			{
				thumb_mask.animate({'scrollLeft' : thumbs_width}, 150);
			}
			
			return false;
		});
		
		// thumb nav
		thumb_nav.find('a.prev').click(function(){
			
			if(thumb_mask.scrollLeft() > 0)
			{
				thumb_mask.animate({'scrollLeft' : '-='+thumb_width+'px'}, 150);
			}
			else
			{
				thumb_mask.animate({'scrollLeft' : '0'}, 150);
			}
			
			return false;
		});
		
		
		// auto play
		if(options.auto_play == true)
		{
			 t = setInterval(function(){
			
				main_nav.find('a.next').trigger('click');
			
			}, options.pause_time)
			
		}
		
		
	};
	
})(jQuery);