function mycarousel_initCallback(carousel) {
    $('.jcarousel-control a').bind('click', function() {
        // set active
        $(".slider_button").removeClass("slider_button_active");
        $(".slider_button", this).addClass("slider_button_active");
        
        // scroll to the item
        var int = $(this).attr("rel");
        carousel.scroll(jQuery.jcarousel.intval(int));
        
        // stop automatic scrolling
        carousel.startAuto(0);
        
        return false;
    });

    $('#mycarousel-next').bind('click', function() {
        carousel.next();
        carousel.startAuto(0);
        return false;
    });

    $('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        carousel.startAuto(0);
        return false;
    });
    
    // pauze automatic scrolling on mouseover
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
};

function mycarousel_itemVisibleInCallbackBeforeAnimation(carousel, item, idx, state) {
	idx = idx % jcarousel_banner_count;
	if (idx == 0) {
		idx = jcarousel_banner_count;
	}
	$(".slider_button").removeClass("slider_button_active");
	$(".slider_point").removeClass("active_point");
	$("#slider_button_" + idx).addClass("slider_button_active");
	$("#slider_point_" + idx).addClass("active_point");
	/*$("#slider_header")
		.empty()
		.append($("#slider_button_" + idx).text());*/
};

// Ride the carousel...
$(document).ready(function() {
    $("#jcarousel").jcarousel({
        scroll: 1,
        auto: 5,
        wrap: 'circular',
        initCallback: mycarousel_initCallback,
        buttonNextHTML: null,
        buttonPrevHTML: null,
        itemVisibleInCallback: {
            onBeforeAnimation:  mycarousel_itemVisibleInCallbackBeforeAnimation
        }
    });
});