(function($){	
	//declare an array to store the keys of the options object
	$.dssOptionsList = [];
	
	//main function
	$.fn.divSlideShow = function(customOptions){	
		//default options
		var options = 
		{ 
			width:700,
			height:430,
			delay:1500,
			loop:1,
			leftArrowClass:"left_slider",
			rightArrowClass:"right_slider",
			slideContainerClass:"slide-container",
			controlClass:"control",
			controlHoverClass:"control-hover"
		};
		//override options
		if(customOptions)
			$.extend(options, customOptions);
			
		//store the keys of the options object
		for(var key in options)
			$.dssOptionsList.push(key);
		
		//limit loop amount
		if(options.loop > 30)
			options.loop = 30;
		return this.each(function(){
			for(key in options)
				$(this).attr(key, options[key])
			//make slideshow
			$.divSlideShow(this);
		});
	};
	
	$.divSlideShow = function(slideShow)
	{		
	
		var options = $.divSlideShow.getOptionsObject(slideShow);	
		
		var numSlide = $(slideShow).children('.slide').length;			
		$(slideShow).css( { 'width':options.width ,  'overflow':'hidden', 'display':'block' } );
		
		//wrap all slides with inner conatiner
		$(slideShow).children().wrap('<div class="dssSlide"></div>');
		$(slideShow).children('.dssSlide').wrapAll('<div class="dssSlideContainer" page=0 max='+numSlide+'/>');
		$(slideShow).find('.dssSlide')
			.css( {'float':'left', 'width':options.width, 'height':options.height, 'overflow-y':'auto' } );

		//add controls		
		var leftArrow = '<div class="dssControl" direction=-1><span class="'+options.leftArrowClass+'"><img src="http://www.propaganda-haare.com/CMS/site/img/left.jpg" alt="Left" /></span></<div>';
		var rightArrow = '<div class="dssControl" direction=1><span class="'+options.rightArrowClass+'"><img src="http://www.propaganda-haare.com/CMS/site/img/right.jpg" alt="Right" /></span></<div>';
		$(slideShow).append(leftArrow);
		$(slideShow).append(rightArrow);
		$('.'+options.leftArrowClass+' img').attr({src:"http://www.propaganda-haare.com/CMS/site/img/none.jpg"});
		
		//styles for inner container and controls
		$(slideShow).find('.dssSlideContainer').css( {'width':options.width * numSlide, 'height':options.height, 'overflow':'hidden'} ).addClass(options.slideContainerClass);
		$(slideShow).find('.dssControl')
			.addClass(options.controlClass)
			.css('float','left')
			.hover(function(){ $(this).toggleClass(options.controlHoverClass);})
			.wrapAll('<div class="dssControlContainer"/>');
		/*$(slideShow).find('.dssControlContainer')
			.css({'height':'100%', 'overflow':'hidden'})
			.addClass(options.controlContainerClass);*/
		
		//auto-slide: queue a sequence of animation with delay
		/*for(i = 1; i < Math.floor(numSlide*options.loop)+1; i++)
		{
			$(slideShow).find('.dssSlideContainer').delay(options.delay);				
			$.divSlideShow.slideTo(slideShow, i % numSlide, true);
		}*/
		
		//controls click handler
		$(slideShow).find('.dssControl').click(function(){				
			//get max pages
			var max = $(slideShow).find('.dssSlideContainer').children().length;
			
			//get target page
			var dir = parseInt($(this).attr('direction'));
			var currentPage = parseInt($(slideShow).find('.dssSlideContainer').attr('page'));
			var gotoPage = (currentPage + dir < max && currentPage + dir >= 0) ? currentPage + dir : currentPage;
			
			//new
			if (currentPage + dir + 1 >= max){
				$('.'+options.rightArrowClass+' img').attr({src:"http://www.propaganda-haare.com/CMS/site/img/none.jpg"});
			} else {
				$('.'+options.rightArrowClass+' img').attr({src:"http://www.propaganda-haare.com/CMS/site/img/right.jpg"});
			}
			if (currentPage + dir - 1 < 0){
				$('.'+options.leftArrowClass+' img').attr({src:"http://www.propaganda-haare.com/CMS/site/img/none.jpg"});
			} else {
				$('.'+options.leftArrowClass+' img').attr({src:"http://www.propaganda-haare.com/CMS/site/img/left.jpg"});
			}
			
			//go
			$.divSlideShow.slideTo(slideShow, gotoPage);
		});		
	};
	

	$.divSlideShow.slideTo = function(slideShow, gotoPage, queue)
	{
		//remove auto-slide
		if( !queue )
			$(slideShow).find('.dssSlideContainer').clearQueue(); //REEEEEEEEEEEEEEEEEEEEEEEEEMOVE AUTO-SLIDE
		
		var options = $.divSlideShow.getOptionsObject(slideShow)
		
		//validate gotoPage
		var max = $(slideShow).find('.dssSlideContainer').children().length;
		if(gotoPage >= max){
			gotoPage = max - 1;
		}
		if(gotoPage < 0){
			gotoPage = 0;
		}
		
		
		//get width
		var width = $(slideShow).find('.dssSlideContainer .dssSlide').width();		
		
		//manage control look and store current page as attribute, to be executed just before animation
		$(slideShow).find('.dssSlideContainer').queue(function(){
			$.divSlideShow.manageControls(slideShow, gotoPage);
			$(this).attr('page', gotoPage);
			$(this).dequeue();
		});
		
		//animate
		$(slideShow).find('.dssSlideContainer').animate(	{'margin-left':-gotoPage*width}	);		
		
	};
	
	$.divSlideShow.getOptionsObject = function(slideShow)
	{
		var options = {};
		var optionsList = $.dssOptionsList;
		for (var i in optionsList)
		{
			var attribute = $(slideShow).attr(optionsList[i]);
			if( isNaN( parseInt(attribute) ) )
				options[optionsList[i]] = attribute;
			else
				options[optionsList[i]] = parseInt(attribute);			
		}
		return options;
	}
	
	$.divSlideShow.manageControls = function(slideShow, page)
	{
		var options = $.divSlideShow.getOptionsObject(slideShow)	
		var max = $(slideShow).find('.dssSlideContainer').children().length;
	};

})(jQuery);