jQuery(document).ready(function() {
	jQuery('#mycarousel').jcarousel({
		scroll: 3,
		initCallback: list_controls,
		wrap: 'both'
	});
	
	jQuery('#mycarousel a').click(function(){
		var index = jQuery(this).parent().parent().find('a').index(this);
		show_image(index);
  	jQuery('.c').hide();
  	jQuery('.c').eq(index).fadeIn();
		//console.log(index);
		
		clear_interval();
		set_interval();
		return false;
	})
	
	set_interval();
}); 

var _index = 0;
var interval;

function set_interval(){
	var num = jQuery('.list-controls li').length;
	
	interval = window.setInterval(function(){
		_index++;
		if( _index == num ) _index = 0;
		show_image(_index);
	}, 3000);
}
function clear_interval(){
	window.clearInterval(interval);
}

function list_controls(carousel) {
    jQuery('.list-controls li').bind('click', function() {
    	var index = jQuery(this).parent().find('li').index(this)
        carousel.scroll( index+1 );
        show_image( index );
      	jQuery('.c').hide();
      	jQuery('.c').eq(index).fadeIn();
        
        clear_interval();
		    set_interval();
        return false;
    });
};

function show_image( index ) {
	_index  = index;
	jQuery('.picture').hide();
	jQuery('.picture').eq(index).fadeIn();
}

function change_image(carousel, item, idx, state) {
	var index = idx - 1;
    show_image( index );
};