(function($) {
    $.fn.slider = function (options){
    		var sliderId = $(this).attr('id');	
    		
    		var itemWidth = parseInt($("#"+sliderId+"").css('width'));	
    		var items = $("#"+sliderId+" .itemSet").children().size()			
    		var itemsWidth = items * itemWidth;
    		
    		var position = 1;
    		
    		$("#"+sliderId+" .itemSet").css({'width':itemsWidth+'px'})
    		
    		if(options.numbers.actived == true){
    		
    		    setNumbering();
    				
    				$("#"+options.numbers.id+" span").click(function (){
        				var leftPosition = parseInt($("#"+sliderId+" .itemSet").css('left'));
        				var page = $(this).attr("title");
    						
    						newPosition = - ((page-1) * itemWidth);
    						$("#"+sliderId+" .itemSet").animate({'left':newPosition+'px'});
    						
    						position = page;
    						
    						selectNumber()
    						
        		})
    				
    		}
    		
    		$("#"+options.nextArrow.id+", #"+options.previousArrow.id).click(function (){
    				var leftPosition = parseInt($("#"+sliderId+" .itemSet").css('left'));
    				var direction = $(this).attr("id");
    				
    				if(direction == "next" || direction == "previous"){
        				if(direction == "next" && position < items){
        				    newPosition = leftPosition - (1 * itemWidth);
        						position++;
        				}
        				else if(direction == "previous" && position > 1){
        						newPosition = leftPosition + (1 * itemWidth);
        						position--;
        						
        				}
    				    $("#"+sliderId+" .itemSet").animate({'left':newPosition+'px'});
    						selectNumber()
    				}
    
    		})
    		
    		function setNumbering(){
    				var html = "";
    				
    				var separator = (options.numbers.separator) ? options.numbers.separator : "&nbsp;";
    				
    				for(i=0;i<items;i++){
    						if(i > 0){
    						    html += separator;
    						}
    						
    						if((i+1) == position){
    						    html += "<span title='"+(i+1)+"' class='on'>"+(i+1)+"</span>";
    						}
    						else{
    						    html += "<span title='"+(i+1)+"'>"+(i+1)+"</span>";
    						}
    				}		
    				
    				$("#"+options.numbers.id).html(html); 
    		}
    		
    		function selectNumber(){
    		    $("#"+options.numbers.id+" span[class=on]").removeClass();
    				
    				$("#"+options.numbers.id+" span:eq("+(position-1)+")").toggleClass("on");
    		}
    }

})(jQuery);

