/*
 * Slider v.1.0
 * 
 * Copyright W3editor.com
 * www.w3editor.com
 */

function DynPBtnClicked(){
	var clicked = $(this);
	var id = clicked.attr('nr');
	
	var ML = parseInt($('.DynPanels').css('margin-left'));
	
	/*START setting ul width to display inline the elements*/
	var obj = $('.DynPanels');
	var liNr = $("li", obj).length;
	var w = $("li", obj).width();
	$('.DynPanels').css({'width':(w*liNr)+'px'});
	/*END setting ul width to display inline the elements*/
	
	var liVis = (ML/w);
	if(liVis<0) liVis = liVis*(-1);
	
	if(id==liVis) return;
	
	if(id>liVis){
		var diff = (id-liVis); 
		$('.DynPanels').animate({'margin-left':(ML-(diff*w))+'px'},1000);
		$('.button').removeClass('active');
		$('.button'+(id)).addClass('active');
	}
	if(id<liVis){
		var diff = (liVis-id); 
		$('.DynPanels').animate({'margin-left':(ML+(diff*w))+'px'},1000);
		$('.button').removeClass('active');
		$('.button'+(id)).addClass('active'); 
	}
}


function AutoScroll(){
	var ML = parseInt($('.DynPanels').css('margin-left'));
	
	/*START setting ul width to display inline the elements*/
	var obj = $('.DynPanels');
	var liNr = $("li", obj).length;
	if(parseInt($('.DynPanel').css('width'))>0)
		var w = parseInt($('.DynPanel').css('width'));
	else
		var w = 950;
		
	$('.DynPanels').css({'width':(w*liNr)+'px'});
	/*END setting ul width to display inline the elements*/
//	alert(liNr);
	var liVis = (ML/w);
	if(liVis<0) liVis = liVis*(-1);
	if((liVis+1) >= liNr) id=0; else id=liVis+1;
	if(id==0){
		var diff = (liVis-id);
		$('.DynPanels').animate({'margin-left':'0px'},1000);
		$('.button').removeClass('active');
		$('.button0').addClass('active');
		return;
	}
	if(id>liVis){
		var diff = (id-liVis);
		$('.DynPanels').animate({'margin-left':(ML-(diff*w))+'px'},1000);
		$('.button').removeClass('active');
		$('.button'+(liVis+1)).addClass('active');
	}
	if(id<liVis){
		var diff = (liVis-id);
		$('.DynPanels').animate({'margin-left':(ML+(diff*w))+'px'},1000);
		$('.button').removeClass('active');
		$('.button'+(liVis-1)).addClass('active');
	}
}



$('.DynPanelsNav span').live('click',DynPBtnClicked);

$(function(){
	$('.button').click(function(){
		clearInterval(auto);
	});
	//Set first nav button active - remove if you don't want'
	$('.button').eq(0).addClass('active');
	var auto = setInterval(AutoScroll,5000);
});