var currentBox=1;		//which box is showing now (1,2,3,..)

$(document).ready(function() {  
  
        //options( 1 - ON , 0 - OFF)  
        var auto_slide = 1;  
            var hover_pause = 1;  
  
        //speed of auto slide(  
        var auto_slide_seconds = 3300;  
        /* IMPORTANT: i know the variable is called ...seconds but it's 
        in milliseconds ( multiplied with 1000) '*/  
  
        /*move the last list item before the first item. The purpose of this is 
        if the user clicks to slide left he will be able to see the last item.*/  
       // $('#carousel_ul li:first').before($('#carousel_ul li:last'));  
  
        //check if auto sliding is enabled  
        if(auto_slide == 1){  
            /*set the interval (loop) to call function slide with option 'right' 
            and set the interval time to the variable we declared previously */  
            var timer = setInterval('slide()', auto_slide_seconds);  
  
            /*and change the value of our hidden field that hold info about 
            the interval, setting it to the number of milliseconds we declared previously*/  
            $('#scroll_seconds').val(auto_slide_seconds);  
        }  
  
        //check if hover pause is enabled  
        if(hover_pause == 1){  
            //when hovered over the list  
            $('#scrollbox_in').hover(function(){  
                //stop the interval  
                clearInterval(timer)  	
            },function(){  
                //and when mouseout start it again  
                timer = setInterval('slide()', auto_slide_seconds);  
            });  
  
        }

	$('#sc_link1').hover(function() {
				clearInterval(timer); 
				slide(1, 200);
			}, function() {
				timer = setInterval('slide()', auto_slide_seconds);	
			});	  	
	$('#sc_link2').hover(function() {
				clearInterval(timer); 
				slide(2, 200);
			}, function() {
				timer = setInterval('slide()', auto_slide_seconds);	
			});	  					
	$('#sc_link3').hover(function() {
				clearInterval(timer); 
				slide(3, 200);
			}, function() {
				timer = setInterval('slide()', auto_slide_seconds);	
			});	  					
	$('#sc_link4').hover(function() {
				clearInterval(timer); 
				slide(4, 200);
			}, function() {
				timer = setInterval('slide()', auto_slide_seconds);	
			});	  				
	$('#sc_link5').hover(function() {
				clearInterval(timer); 
				slide(5, 200);
			}, function() {
				timer = setInterval('slide()', auto_slide_seconds);	
			});	
	$('#sc_link6').hover(function() {
				clearInterval(timer); 
				slide(6, 200);
			}, function() {
				timer = setInterval('slide()', auto_slide_seconds);	
			});  						

  });  
  
//FUNCTIONS BELLOW  
  
//slide function  
function slide(slideTo, time){  

            if (!slideTo) {
		var slideTo = currentBox+1;
		if (slideTo>6) { slideTo=1; }
            }
	    if (!time) { var time=450; }

	    switch(currentBox) {
		case 1:
		$('#sc_link1').removeClass("sc_link_active");
		break;
		case 2:
		$('#sc_link2').removeClass("sc_link_active");
		break;
		case 3:
		$('#sc_link3').removeClass("sc_link_active");
		break;
		case 4:
		$('#sc_link4').removeClass("sc_link_active");
		break;
		case 5:
		$('#sc_link5').removeClass("sc_link_active");
		break;
		case 6:
		$('#sc_link6').removeClass("sc_link_active");
		break;
	    }
	    switch(slideTo) {
		case 1:
		$('#sc_link1').addClass("sc_link_active");
		break;
		case 2:
		$('#sc_link2').addClass("sc_link_active");
		break;
		case 3:
		$('#sc_link3').addClass("sc_link_active");
		break;
		case 4:
		$('#sc_link4').addClass("sc_link_active");
		break;
		case 5:
		$('#sc_link5').addClass("sc_link_active");
		break;
		case 6:
		$('#sc_link6').addClass("sc_link_active");
		break;
	    }


            //item width 
            var item_width = 624;		
             
            var left_indent = 624-(slideTo*item_width);
  
            //make the sliding effect using jQuery's animate function... '  
            $('#scrollbox_in:not(:animated)').animate({'left' : left_indent},time,function(){  
  
                
            });  
        
       currentBox=slideTo;
}
