var prevCValue = 0;

function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt) {
    var idx = carousel.index(i, mycarousel_itemList.length);
    carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));
    switch (state) {
    	case 'next' :
    		if (document.getElementById('img_page_'+(idx-2))) {
    			document.getElementById('img_page_'+(idx-2)).src = '/design/img/bt-pg-inact.gif';
    			document.getElementById('img_page_'+prevCValue).src = '/design/img/bt-pg.gif';
    			prevCValue = idx - 2;
    		} else if (idx == 1) {
    			document.getElementById('img_page_'+(caruyserl_size-1)).src = '/design/img/bt-pg-inact.gif';
    			document.getElementById('img_page_'+prevCValue).src = '/design/img/bt-pg.gif';
    			prevCValue = caruyserl_size - 1;
    		}
    		break;
    	case 'prev' :
    		if (document.getElementById('img_page_'+(idx-1))) {
    			document.getElementById('img_page_'+(idx-1)).src = '/design/img/bt-pg-inact.gif';
    			document.getElementById('img_page_'+prevCValue).src = '/design/img/bt-pg.gif';
    			prevCValue = idx - 1;
    		}
    		break;
    }
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt) {
    carousel.remove(i);
};

function mycarousel_getItemHTML(item) {
    return item.value;
};

function mycarousel_initCallback(carousel) {
    jQuery('#mycarousel-next').bind('click', function() {
        carousel.next();
        return false;
    });

    jQuery('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        return false;
    });
};

jQuery(document).ready(function() {
    jQuery('#mycarousel').jcarousel({
        size: caruyserl_size,
        scroll: 1,
        wrap: 'circular',
        itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
        itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback},
        initCallback: mycarousel_initCallback
    });
});