/*
 * 	Easy Slider 1.5 - 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").easySlider();
 *	
 * 	<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($) {
	// The plugin
	$.fn.image = function(src, f){
		return this.each(function(){
			var i = new Image();
					i.src = src;
					i.onload = f;
					this.appendChild(i);
			});
	}

	$.fn.switchImage = function(next){
						var cur = $("li",$("ul.large")).index($("li.selected")); 
						$("ul.large li#image"+cur)
							.animate({ 
							   opacity: 'hide' },
							   function() {
									$("ul.large li#image"+cur).removeClass('selected');
									$("ul.large li#image"+cur).css('display', 'none');
									
									$("ul.large li#image"+next).css('display', 'block');
									$("ul.large li#image"+next).addClass('selected');
								}
							); // end animate*/
	}

	$.fn.easySlider = function(options){
	  
	  	var aantalitems = $("ul.prews li").size();
		//alert(aantalitems);
		// default configuration properties
		var defaults = {			
			prevId: 		'prevBtn',
			prevText: 		'Previous',
			nextId: 		'nextBtn',	
			nextText: 		'Next',
			controlsShow:	true,
			controlsBefore:	'',
			controlsAfter:	'',	
			controlsFade:	true,
			firstId: 		'firstBtn',
			firstText: 		'First',
			firstShow:		false,
			lastId: 		'lastBtn',	
			lastText: 		'Last',
			lastShow:		false,				
			vertical:		false,
			speed: 			1000,
			auto:			false,
			pause:			3000,
			itemsarow:		1,
			continuous:		false
		}; 
		
		var options = $.extend(defaults, options);  
		
		var numanimations = 0;
		var difference = 0;
		if (aantalitems > options.itemsarow) {
			
			var numanimations 	= aantalitems - options.itemsarow;
			//alert(numanimations);
			var difference 		= options.itemsarow - 1;
			//alert(difference);			
		}
			//Juiste klasses toevoegen
			$("ul.large li").each(function(i) {
				$(this).attr('id',"image"+i);
				if (i >= 1) {
					$(this).css('display','none');				
				} else {
					$(this).addClass('selected');
				}
			});
			
			$("ul.prews li").each(function(j) {
				if (aantalitems > 1) {
					$(this).wrapInner('<a href=\"#\"></a>');
				}
			});
			
			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");
				var ts = s-1;
				var t = 0;
				$("ul", obj).css('width',s*w);			
				if(!options.vertical) $("li", obj).css('float','left');

				if (aantalitems != 1) {

					$("li",obj).click(function() {
						var n = $("li",obj).index($(this));
						if (aantalitems < options.itemsarow) {
							$("ul.large").switchImage(n);
						} else {
							animate("custom",true,n);
						}
					});
				}
				if (aantalitems > options.itemsarow) {
					if(options.controlsShow){
						var html = options.controlsBefore;
						if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>';
						html += '<span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>';
						$(obj).before(html);
						var html = "";
						html += '<span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>';
						if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>';
						html += options.controlsAfter;						
						$(obj).after(html);										
					};
					
		
					$("a","#"+options.nextId).click(function(){		
						animate("next",true);
					});
					$("a","#"+options.prevId).click(function(){		
						animate("prev",true);				
					});	
					$("a","#"+options.firstId).click(function(){		
						animate("first",true);
					});				
					$("a","#"+options.lastId).click(function(){		
						animate("last",true);				
					});		
				}
				function animate(dir,clicked,to){
					//if (aantalitems < 3 && dir != "custom" && clicked) { 
					
					//} else {
						var ot = t;
						//if (to) ot = to;
						var curimage 	= t;
						//alert(ts + "dif"+difference);
						switch(dir){
							case "next":
								t = (ot>=ts) ? (options.continuous ? 0 : ts) : t+1;						
								break; 
							case "prev":
								t = (t<=0) ? (options.continuous ? ts : 0) : t-1;
								break; 
							case "first":
								t = 0;
								break; 
							case "last":
								t = ts;
								break;
							case "custom":
								t = to;
								break; 							
							default:
								break; 
						};	
	
						
						var nextimage 	= t;
						//alert(nextimage);
						//huidig = ot
						//huidige li hide()/animeren
						//toevoegen aan het eind
						//ot+1 weergeven
						//alert("van="+curimage+"naar="+t);
						//if (aantalitems != 1)
						$("ul.large").switchImage(nextimage);

						//if (aantalitems > options.itemsarow) {	
							var diff = Math.abs(ot-t);
							var speed = diff*options.speed;						
							if(!options.vertical) {
								p = (t*w*-1);
								if (aantalitems > options.itemsarow) {
									$("ul",obj).animate(
										{ marginLeft: p }, 
										speed
									);
								}
							} else {
								p = (t*h*-1);
								if (aantalitems > options.itemsarow) {
									$("ul",obj).animate(
										{ marginTop: p }, 
										speed
									);	
								}
							};
						//}
							if(!options.continuous && options.controlsFade){					
								if(t==ts-difference){
									$("a","#"+options.nextId).hide();
									$("a","#"+options.lastId).hide();
								} else {
									$("a","#"+options.nextId).show();
									$("a","#"+options.lastId).show();					
								};
								if(t==0){
									$("a","#"+options.prevId).hide();
									$("a","#"+options.firstId).hide();
								} else {
									$("a","#"+options.prevId).show();
									$("a","#"+options.firstId).show();
								};					
							};				
							
							if(clicked) clearTimeout(timeout);
							if(options.auto && dir=="next" && !clicked){;
								timeout = setTimeout(function(){
									animate("next",false);
								},diff*options.speed+options.pause);
							};
						
						
					};
					// init
					var timeout;
					if(options.auto && aantalitems != 1){
						timeout = setTimeout(function(){
							animate("next",false);
						},options.pause);
					};		
				
					if(!options.continuous && options.controlsFade){					
						$("a","#"+options.prevId).hide();
						$("a","#"+options.firstId).hide();				
					};	
				//}
				return false;
				
			});
		//} //aantalitems > 3
	  return false;
	};

})(jQuery);