/*
 * Tiny Carousel 1.77
 *
 * Copyright (c) 2010 Maarten Baijs
 *
 * Date: 21 / 08 / 2010
 * Library: jQuery
 *
 */
 
 /*
  * Extended & altered by Harrison Shoff
  *   - Infinite Carousel: Wraps around after last element
  *	  - Play/Pause: Play or pause carousel with a button
  *   - Smart Pause: Stop carousel when user selects pager element
  *	  - Added Util Funcs: setInterval(), setPlayButton()
  *
  * Date: 09/08/2010
  * http://blog.hshoff.com
  *
  */
 
(function($){
	$.fn.tinycarousel = function(options, carouselname){
		var defaults = { 
			start: 1, // where should the carousel start?
			display: 1, // how many blocks do you want to move at 1 time?
			axis: 'x', // vertical or horizontal scroller? ( x || y ).
			controls: true, // show left and right navigation buttons.
			playpause: true, // set if you want play/pause button functionality
			smartpause: true, // set if you want to pause when user clicks pager
			pager: false, // is there a page number navigation present?
			interval: false, // move to another block on intervals.
			intervaltime: 3000, // interval time in milliseconds.
			animation: true, // false is instant, true is animate.
			duration: 1000, // how fast must the animation move in ms?
			callback: null // function that executes after every move
		};
		var options = $.extend(defaults, options);
		
		var oSlider = $(this);
		var oViewport = $('.viewport', oSlider);
		var oContent = $('.overview', oSlider);
		var oPages = oContent.children();
		var oBtnNext = $('.next', oSlider);
		var oBtnPrev = $('.prev', oSlider);
		var oPager = $('.pager', oSlider);
		var iPageSize, iSteps, iCurrent, oTimer, bForward = true, bAxis = options.axis == 'x';

		return this.each(function(){
			initialize();
		});
		function initialize(){
			// get lastchild:
			var lastChild = $(oPages).eq(oPages.size() - 1).clone();
			var secondtolastChild = $(oPages).eq(oPages.size() - 2).clone();
				
			// get first child: 
			var firstChild = $(oPages[0]).clone();
			var secondChild = $(oPages[1]).clone();
			
			
			$(oContent).prepend(lastChild);
			$(oContent).prepend(secondtolastChild);
			
			$(oContent).append(firstChild);			
			$(oContent).append(secondChild);
			
			oPages = oContent.children();
			//start = 2;
			
			iPageSize = bAxis ? $(oPages[0]).outerWidth(true) : $(oPages[0]).outerHeight(true);
			var iLeftover = Math.ceil(((bAxis ? oViewport.outerWidth() : oViewport.outerHeight()) / (iPageSize * options.display)) -1);
			iSteps = Math.max(1, Math.ceil(oPages.length / options.display) - iLeftover);
			iCurrent = Math.min(iSteps, Math.max(1, options.start)) -2;
			oContent.css(bAxis ? 'width' : 'height', (iPageSize * oPages.length));
			
			// start at number 2 (first 'normal' pic)
			var oPosition = {};
			oPosition[bAxis ? 'left' : 'top'] = -(2  * (iPageSize * options.display));
			oContent.css(oPosition);
			iCurrent = 2;
			
			move(0); // was uitgezet maar geen idee waarom
			setEvents();
		
		}
		function setEvents(){
			if(options.controls && oBtnPrev.length > 0 && oBtnNext.length > 0){
				oBtnPrev.click(function(){move(-1); return false;});
				oBtnNext.click(function(){move( 1); return false;});
			}
			if(options.pager && oPager.length > 0){
				oPager.click(setPager);
			}
			if(options.playpause) {
				// #play_toggle is the id of the div containing the
				// play/pause button. The pause class means that the 
				// play/pause button is showing pause and the carousel
				// is currently playing. The play class means that the 
				// play/pause button is showing play and the carousel 
				// is currenty paused.
				$('#play_toggle').click(function(){
					var toggle = $('#play_toggle');
					if (toggle.hasClass('pause')) {
						toggle.removeClass('pause');
						toggle.addClass('play');
						setInterval(false);
					} else {
						toggle.removeClass('play');
						toggle.addClass('pause');
						setInterval(true);
					}
				});
			}
			if(options.smartpause) {
				// if a pager element is clicked, stop carousel &
				// set play toggle button to play
				$('.pagenum', oPager).click(function(){
					setInterval(false);
					$('#play_toggle').removeClass().addClass('play');
				});	
			}
		}
		function setButtons(){
			if(options.pager){
				var oNumbers = $('.pagenum', oPager);
				oNumbers.removeClass('active');
				$(oNumbers[iCurrent]).addClass('active');
			}	
		}		
		function setPager(oEvent){
			var oTarget = oEvent.target;
			if($(oTarget).hasClass('pagenum')){
				iCurrent = parseInt(oTarget.rel) -1;
				move(1);
			}
			return false;
		}
		function setInterval(bool) {
			options.interval = bool;
		}
		function setTimer(bReset){
			var toggle = $('#play_toggle');
			if(options.interval && !bReset){
				clearInterval(oTimer);
				oTimer = window.setInterval(function(){
					// The carousel plays when play toggle shows 
					// the pause button and when interval is true.
					
					// Frank G edit:
					//if (toggle.hasClass('pause') && options.interval) {
					if (options.interval) {						
						move(1);
					}
				}, options.intervaltime);
			}
		}
		function move(iDirection, bTimerReset){
			if(iCurrent + iDirection > -1 && iCurrent + iDirection < iSteps){
				var oPosition = {};
								
				if (iCurrent == 1 && iDirection == -1) {
					oPosition[bAxis ? 'left' : 'top'] = -((oPages.length - 3)  * (iPageSize * options.display));					
					oContent.css(oPosition);
					iCurrent = oPages.length - 3;				
				}
				
				if (iCurrent == oPages.length - 2 && iDirection == 1) {
					oPosition[bAxis ? 'left' : 'top'] = -(2  * (iPageSize * options.display));
					oContent.css(oPosition);
					iCurrent = 2;
				}
				
				iCurrent += iDirection;
								
				oPosition[bAxis ? 'left' : 'top'] = -(iCurrent * (iPageSize * options.display));
				oContent.animate(oPosition, {
					queue: false,
					duration: options.animation ? options.duration : 0,
					complete: function(){
						if (typeof options.callback == 'function') 
							options.callback.call(this, oPages[iCurrent], iCurrent);
					}
				});
				setButtons();
				setTimer(bTimerReset);
				
				
				/* faden is niet netjes mogelijk door de CSS verspringing met de infinite scroller
				
				if(carouselname == 'header')
				{
					//$('ul.overview li div.tekst').fadeOut();
					var current = iCurrent + 1;
					//$('ul.overview li:nth-child(' + current + ') div.tekst').fadeIn();
				}
				*/
								

			}
		}
	};
})(jQuery);