// JavaScript Document

(function( $ ){

	$.fn.paSlideshow = function( options ) {  
	
		var settings = {};
		
		var container;	// contains the whole thing
		var wrapper;	// wrap the carousel
		var carousel;	// the carousel itself
		var reference;	// the first content element
		var tools;		// the tools zone
		var nbPerPage = 1;
		var nbElt = 0;
		var cpt = 0;
		var nbPages = 0;
		var pageNum = 0;
		var timoutId;
		
		
		function scrollLeft() {
			if(pageNum > 0) {
				openPage(pageNum - 1);
			} else {
				openPage(nbPages - 1);
			}
		}
		
		function scrollRight() {
			if(pageNum < (nbPages-1) ) {
				openPage(pageNum + 1);
			} else {
				openPage(0);
			}
		}
		
		function openPage(i) {
			
			$('.pa-slideshow-pages a:eq(' + pageNum + ')', tools).toggleClass('active', false);
			pageNum = Number(i);
			$('.pa-slideshow-pages a:eq(' + pageNum + ')', tools).toggleClass('active', true);
			// display the "description div" content inside the info zone
			var $contentDiv = $('li:eq(' + pageNum + ') div', carousel);
			$('.pa-slideshow-infos', tools).html($contentDiv.html());
			
			carousel.stop(true);
			carousel.animate({
				marginLeft : - (reference.width() * nbPerPage * pageNum)
			}, 1500, 'easeInOutQuint');
			
			window.clearTimeout(timoutId);
			timoutId = window.setTimeout(function() { scrollRight(); }, 5000);
		}
		
		
		return this.each(function() {        
			// If options exist, lets merge them with our default settings
			if (options) { 
				$.extend(settings, options);
			}
			// Plugin code starts here.
			
			var $this = $(this);
			carousel = $(this);
			
			reference = $("li:first-child", this);
			nbElt = $("li", this).length;
			nbPages = Math.ceil(nbElt / nbPerPage);
			
			
			// wrap the carousel into the wrapper
			carousel.wrap('<div class="pa-slideshow-wrapper"></div>');
			wrapper = carousel.parent();
			wrapper.css("width",  reference.width() * nbPerPage )
					// hauteur d'une seule diapositive
					.css("height", reference.height() )
					// Blocage des débordements
					.css("overflow", "hidden");
			// wrap the wrapper into the container
			wrapper.wrap('<div class="pa-slideshow-container"></div>');
			container = wrapper.parent();
			carousel.css("width", (reference.width() * nbElt));
			// append the tools block
			container.append('<div class="pa-slideshow-tools"></div>');
			tools = $(".pa-slideshow-tools", container);
			// add the scroller
			tools.append('<div class="scroller"><div class="scrollLeft"></div><div class="scrollRight"></div></div>');
			// add the page buttons
			tools.append('<div class="pa-slideshow-pages"></div>');
			for(var i = 0; i < nbElt; i++) {
				$('.pa-slideshow-pages', tools).append('<a href="#" class="slideshow-link link-' + i + '" rel="' + i + '">' + (i+1) + '</a>');
				$('.link-' + i, tools).click(function() {
					openPage($(this).attr('rel'));
				});
			}
			// add the infos block
			tools.append('<div class="pa-slideshow-infos">hello</div>');
			// hide all the description divs
			$('li div', carousel).hide();
			
			
			if(nbPages > 1) {
				$('.scrollRight', tools).click(function() {
					scrollRight();
				});
				$('.scrollLeft', tools).click(function() {
					scrollLeft();
				});
			} else {
				$('.scroller', tools).hide();
			}
			
			
			//
			openPage(0);
			
			//updatePageNumView();
			
		});
		
	
	};
})( jQuery );