function mycarousel_initCallback(carousel) {
	$('#sec_links li:first a').addClass('active');
	
    $('#mycarousel-next').bind('click', function() {
        carousel.next();
        return false;
    });

    $('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        return false;
    });
    
    $('.slide_link').bind('click', function() {
		var id = $(this).attr('id').replace('sl','');
		
		var pos_idx = 1;
		var cnt = 1;
		$('#mycarousel li').each(function() {
			if ($(this).attr('id').replace('slide','') == id) {
				pos_idx = cnt;
			}
			cnt ++;
		});
		
		carousel.scroll(pos_idx);												
		return false;
    });
};

function update_nav(carousel, item, i, state) {
									
	if (state != 'init') {
		$('#sec_links li a').removeClass('active');
		
		if (state == 'next') {
			var first_li = $('#sec_links li:first');
			$('#sec_links li:first').remove();
			$('#sec_links').append('<li>' + first_li.html() + '</li>');
			
			$('#main-slider .nav ul').stop().animate({
				'left' : 0
			}, 500);
		
		} else if (state == 'prev') {
			var last_li = $('#sec_links li:last');
			$('#sec_links li:last').remove();
			$('#sec_links').prepend('<li>' + last_li.html() + '</li>');
			
			$('#main-slider .nav ul').stop().animate({
				'left' : 0
			}, 100);
		}
	}

	$('.slide_link').bind('click', function() {
		var id = $(this).attr('id').replace('sl','');
		
		var pos_idx = 1;
		var cnt = 1;
		$('#mycarousel li').each(function() {
			if ($(this).attr('id').replace('slide','') == id) {
				pos_idx = cnt;
			}
			cnt ++;
		});
		
		carousel.scroll(pos_idx);												
		return false;
    });
	
	var id = $(item).attr('id').replace('slide','');
	$('#sl' + id).addClass('active');
	
	$('#sec_links li').each(function() {
		if ($(this).children('a').hasClass('active')) {
			return false;
		}
		
		var first_li = $('#sec_links li:first');
		$('#sec_links li:first').remove();
		$('#sec_links').append('<li>' + first_li.html() + '</li>');
	});
}

$(document).ready(function() {
    $('#mycarousel').jcarousel({
        wrap: 'both',
        auto: 10,
        scroll: 1,
        initCallback: mycarousel_initCallback,
        buttonNextHTML: null,
		buttonPrevHTML: null,
		itemVisibleInCallback: {onAfterAnimation: update_nav}
    });
});