/*
 *	markup example for $("#slider").navSlider();
 *	
 * 	<div id="slider">
 *		<ul>
 *			<li><img src="images/01.jpg" alt="" /></li>
 *			<li><img src="images/02.jpg" alt="" /></li>
 *			<li><img src="images/03.jpg" alt="" /></li>
 *			<li><img src="images/04.jpg" alt="" /></li>
 *			<li><img src="images/05.jpg" alt="" /></li>
 *		</ul>
 *	</div>
 *
 */

(function($) {

	$.fn.navSlider = function(options){
	  
		// default configuration properties
		var defaults = {
			totalSlides:	0,
			curSlideIndex:	1,			
			controlsBefore:	'',
			controlsAfter:	'',
			vertical:		false,
			speed: 			800,
			auto:			true,
			pause:			8000,
			continuous:		true
		}; 
		
		var options = $.extend(defaults, options);  
				
		this.each(function() {
			var obj = $(this); 				
			var s = $("li", obj).length;
			var w = $("li", obj).width(); 
			var h = $("li", obj).height(); 
			obj.width(w); 
			obj.height(h); 
			obj.css("overflow","hidden");
			$("ul", obj).css('width',s*w);	
					
			if (!options.vertical) {
				$("li", obj).css('float', 'left');			
			}
						
			// get the current index
			options.curSlideIndex 	= $("li", obj).attr('id').split('_')[0];	
					
			// init
			var timeout;
			if (options.auto) {
				timeout = setTimeout(function(){
					var nextIndex = parseInt(options.curSlideIndex) + 1;
					if (nextIndex > options.totalSlides) {
						nextIndex = 1;
					}					
					animateTo(nextIndex,false);
				},options.pause);
			}
			
			// update the controls
			$('p#controls').remove();			
			var html = options.controlsBefore;			
			for (var i=1; i<=options.totalSlides; i++) {
				var slideID = 'bt';
				
				if (options.curSlideIndex == i) {
					slideID += i + "_on";
				} else {
					slideID += i + "_off";
				}
				html += '<span id="'+ slideID +'"><a href=\"javascript:void(0);\">' + '' + '</a></span>';
			}						
			html += options.controlsAfter;			
			$(obj).after(html);	

			$("a","#bt1_on").click(function(){animateTo(1,true);});
			$("a","#bt1_off").click(function(){animateTo(1,true);});
			$("a","#bt2_on").click(function(){animateTo(2,true);});
			$("a","#bt2_off").click(function(){animateTo(2,true);});
			$("a","#bt3_on").click(function(){animateTo(3,true);});
			$("a","#bt3_off").click(function(){animateTo(3,true);});			
			
			// ******************************************************************************
			// ******************************************************************************
			var ts = s-1;
			var t = 0;			
			function animateTo(slideIndex,clicked) {
				//alert(slideIndex+"|"+clicked);
				
				if (options.curSlideIndex == slideIndex) {
					return;
				}
				
				// update to the new index
				options.curSlideIndex = slideIndex;
				
				$('p#controls').remove();				
				var html = options.controlsBefore;				
				for (var i=1; i<=options.totalSlides; i++) {
					var slideID = 'bt';
					
					if (options.curSlideIndex == i) {
						slideID += i + "_on";
					} else {
						slideID += i + "_off";
					}
					html += '<span id="'+ slideID +'"><a href=\"javascript:void(0);\">' + '' + '</a></span>';
				}				
				html += options.controlsAfter;						
				$(obj).after(html);	

				$("a","#bt1_on").click(function(){animateTo(1,true);});
				$("a","#bt1_off").click(function(){animateTo(1,true);});
				$("a","#bt2_on").click(function(){animateTo(2,true);});
				$("a","#bt2_off").click(function(){animateTo(2,true);});				
				$("a","#bt3_on").click(function(){animateTo(3,true);});
				$("a","#bt3_off").click(function(){animateTo(3,true);});					
				
				var ot = t;						
				
				t = (ot>=ts) ? (options.continuous ? 0 : ts) : t+1;
				
				var diff = Math.abs(ot-t);
				var speed = diff*options.speed;						
				if(!options.vertical) {
					p = (t*w*-1);
					$("ul",obj).animate(
						{ marginLeft: p }, 
						speed
					);				
				} else {
					p = (t*h*-1);
					$("ul",obj).animate(
						{ marginTop: p }, 
						speed
					);					
				};
												
				if (clicked) {
					clearTimeout(timeout);
				}
				
				if (options.auto) {
					timeout = setTimeout(function(){
						var nextIndex = parseInt(options.curSlideIndex) + 1;
						if (nextIndex > options.totalSlides) {
							nextIndex = 1;
						}		
						//alert("nextindex="+nextIndex);
						animateTo(nextIndex,false);
					},diff*options.speed+options.pause);
				}
				
			};						
		});	  
	};

})(jQuery);