/**

*

*

* bxSlider: Content slider / fade / ticker using the jQuery javascript library.

*

* Author: Steven Wanderski

* Email: wandoledzep@gmail.com

* URL: http://bxslider.com

* 

*

**/



jQuery.fn.bxSlider = function(options){

	

	/////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Declare variables and functions

	/////////////////////////////////////////////////////////////////////////////////////////////////////////////

	var defaults = {

		mode: 'slide',

		speed: 500,

		auto: false,

		auto_direction: 'left',

		pause: 2500,

		controls: true,

		prev_text: '',

		next_text: '',

		width: $(this).children().width(),

		prev_img: '',

		next_img: '',

		ticker_direction: 'left',

		wrapper_class: 'container'

	};

	

	options = $.extend(defaults, options);

	

	if(options.mode == 'ticker'){

		options.auto = true;

	}

	

	var $this = $(this);



	var $parent_width = options.width;	

	var current = 0;

	var is_working = false;

	var child_count = $this.children().size();

	var i = 0;

	var j = 0;

	var k = 0;

		

	function animate_next(){

		

		is_working = true;

		

		$this.animate({'left':'-' + $parent_width * 2 + 'px'}, options.speed, function(){

			

			$this.css({'left':'-' + $parent_width + 'px'}).children(':first').appendTo($this);

			

			is_working = false;

			

		});		

		

	}

	

	function animate_prev(){

		

		is_working = true;

		

		$this.animate({'left': 0}, options.speed, function(){

			

			$this.css({'left':'-' + $parent_width + 'px'}).children(':last').insertBefore($this.children(':first'));

			

			is_working = false;

			

		});				

		

	}

	

	function fade(direction){

				

		if(direction == 'next'){

		

			var last_before_switch = child_count - 1;

			var start_over = 0;

			var incr = k + 1;

			

		}else if(direction == 'prev'){

			

			var last_before_switch = 0;

			var start_over = child_count -1;

			var incr = k - 1;

			

		}		

		

		is_working = true;

		

		if(k == last_before_switch){

			

			$this.children().eq(k).fadeTo(options.speed, 0, function(){$(this).hide();});

			//$this.children().eq(k).css({'left':'-9999px'});

			$this.children().eq(start_over).show().fadeTo(options.speed, 1, function(){

				

			is_working = false;

	

			k = start_over;

			

			});

			

		}else{

		

			$this.children().eq(k).fadeTo(options.speed, 0, function(){$(this).hide();});

			//$this.children().eq(k).css({'left':'-9999px'});

			$this.children().eq(incr).show().fadeTo(options.speed, 1, function(){

			

			is_working = false;

			

			k = incr;

			

			});

				

		}		

		

	}

	

	function add_controls(){

		

		/////////////////////////////////////////////////////////////////////////////////////////////////////////////

		// Check if user selected images to use for next / prev

		/////////////////////////////////////////////////////////////////////////////////////////////////////////////

	

		if(options.prev_img != '' || options.next_img != ''){

			

			$this.parent().append('<a class="slider_prev" href=""><img src="' + options.prev_img + '" alt=""/></a><a class="slider_next" href=""><img src="' + options.next_img + '" alt="" /></a>');

			

		}else{

		

			$this.parent().append('<a class="slider_prev" href="">' + options.prev_text + '</a><a class="slider_next" href="">' + options.next_text + '</a>');

		

		}

		

		$this.parent().find('.slider_prev').css({'float':'left', 'outline':'0'});

		$this.parent().find('.slider_next').css({'float':'right', 'outline':'0'});

		

		

		/////////////////////////////////////////////////////////////////////////////////////////////////////////////

		// Accomodate padding-top for controls when elements are absolutely positioned (only in fade mode)

		/////////////////////////////////////////////////////////////////////////////////////////////////////////////

		

		if(options.mode == 'fade'){

			

			$this.parent().find('.slider_prev').css({'paddingTop' : $this.children().height()})

			$this.parent().find('.slider_next').css({'paddingTop' : $this.children().height()})

			

		}		

		                                                       

		/////////////////////////////////////////////////////////////////////////////////////////////////////////////

		// Actions when user clicks next / prev buttons        

		/////////////////////////////////////////////////////////////////////////////////////////////////////////////

		                                                       

		$this.parent().find('.slider_next').click(function(){		

			

			if(!is_working){

				

				if(options.mode == 'slide'){

										 

					animate_next();

					

					if(options.auto){

						

						clearInterval($.t);

						

						$.t = setInterval(function(){animate_next();}, options.pause);

						

					}

				

				}else if(options.mode == 'fade'){

					

					fade('next');

					

					if(options.auto){

						

						clearInterval($.t);

						

						$.t = setInterval(function(){fade('next');}, options.pause);

						

					}



					

				}

				

			}

								

			return false;

					

		});	

		

		$this.parent().find('.slider_prev').click(function(){	

			

			if(!is_working){

				

				if(options.mode == 'slide'){

										 

					animate_prev();

					

					if(options.auto){

						

						clearInterval($.t);

						

						$.t = setInterval(function(){animate_prev();}, options.pause);

						

					}

						

				}else if(options.mode == 'fade'){

					

					fade('prev');

					

					if(options.auto){

					

						clearInterval($.t);

					

						$.t = setInterval(function(){fade('prev');}, options.pause);

					

					}

					

				}

				

			}

					

			return false;

					

		});	

	

	}

	

	

	function ticker() {

		

		if(options.ticker_direction == 'left'){

				

			$this.animate({'left':'-' + $parent_width * 2 + 'px'}, options.speed, 'linear', function(){

			

				$this.css({'left':'-' + $parent_width + 'px'}).children(':first').appendTo($this);

			

				ticker();

			

			});		

		

		}else if(options.ticker_direction == 'right'){

			

			$this.animate({'left': 0}, options.speed, 'linear', function(){



				$this.css({'left':'-' + $parent_width + 'px'}).children(':last').insertBefore($this.children(':first'));



				ticker();



			});				

			

		}		

		

	}

		

	

	

	/////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Create content wrapper and set CSS

	/////////////////////////////////////////////////////////////////////////////////////////////////////////////

	

	$this.wrap('<div class="' + options.wrapper_class + '"></div>');

	

	//console.log($this.parent().css('paddingTop'));

			

	if(options.mode == 'slide' || options.mode == 'ticker'){

		

		$this.parent().css({

			'overflow' : '',

			'position' : 'relative',

			'width' : options.width + 'px'

		});

			

		$this.css({		

			'width' : '999999px',

			'position' : 'relative',

			'left' : '-' + $parent_width + 'px'		

		});

			

		$this.children().css({		

			'float' : 'left',

			'width' : $parent_width

		});

		 	

		$this.children(':last').insertBefore($this.children(':first'));

	

	}else if(options.mode == 'fade'){

		

		$this.parent().css({

			'overflow' : '',

			'position' : 'relative',

			'width' : options.width + 'px'

			//'height' : $this.children().height()

		});

		

		if(!options.controls){		

			$this.parent().css({'height' : $this.children().height()});		

		}

		

		$this.children().css({		

			'position' : 'absolute',

			'width' : $parent_width,

			'listStyle' : 'none',

			'opacity' : 0,

			'display' : 'none'	

		});

		

		$this.children(':first').css({

			'opacity' : 1,

			'display' : 'block'

		});

				

	}

	

	/////////////////////////////////////////////////////////////////////////////////////////////////////////////

	// Check if user selected "auto"

	/////////////////////////////////////////////////////////////////////////////////////////////////////////////

		

	if(!options.auto){

				

		add_controls();

				

	}else{

		

		if(options.mode == 'ticker'){

			

			ticker();

			

		}else{

		

			/////////////////////////////////////////////////////////////////////////////////////////////////////////////

			// Set a timed interval 

			/////////////////////////////////////////////////////////////////////////////////////////////////////////////

			

			if(options.mode == 'slide'){

				

				if(options.auto_direction == 'left'){

							

					$.t = setInterval(function(){animate_next();}, options.pause);		

				

				}else if(options.auto_direction == 'right'){

				

					$.t = setInterval(function(){animate_prev();}, options.pause);

				

				}

		

			}else if(options.mode == 'fade'){

				

				if(options.auto_direction == 'left'){

			

					$.t = setInterval(function(){fade('next');}, options.pause);

				

				}else if(options.auto_direction == 'right'){

				

					$.t = setInterval(function(){fade('prev');}, options.pause);

				

				}

			

			}

			

			if(options.controls){

			

				add_controls();

			

			}

		

		}

	

	}

		

}

function doPost(el)
{
	var timestamp = Number(new Date());
	//jQuery.get("http://kinderbladen.sellvia.nl", { winkelwagen: el });
	$.post("/winkelkar/", { winkelwagen: el, rstr:timestamp } );
}