$(document).ready(function() {
	counter = 0;

	$('.crai_carousel').each(function() {
		counter++;
		
		id = $(this).attr('id');
		
		carouselVertical = $(this).attr('carousel-vertical'); // true o false
		carouselScroll = $(this).attr('carousel-scroll'); // numero di item da scrollare per volta
		carouselVisible = $(this).attr('carousel-visible'); // numero di item visibili
		carouselAuto = $(this).attr('carousel-auto'); // numero di item visibili
		carouselWidth = $(this).attr('carousel-width'); // numero di item visibili
		
		itemWidth = $(this).attr('item-width');
		itemHeight = $(this).attr('item-height');
		
		if (id == null || id == '') {
			id = 'carousel_' + counter;
		}
		if (carouselVertical == 'true') {
			carouselVertical = true;
		} else {
			carouselVertical = false;
		}
		if (carouselScroll == null || carouselScroll == 0) {
			carouselScroll = 1;
		}
		if (carouselVisible == null || carouselVisible == 0) {
			carouselVisible = 1;
		}
		
		if (itemWidth == null || itemWidth == 0) {
			itemWidth = 300;
		}
		if (itemHeight == null || itemHeight == 0) {
			itemHeight = 300;
		}
		
		$(this).replaceWith(function() {
			// creo la toolbar se richiesta (toolbar ha anche posizione x e y)
			out = '';
			out += '<div id="' + id + '" class="crai_carousel" style="width:' + carouselWidth + 'px;">';
			out += '<ul id="' + id + '_crai_carousel_items">';
			$(this).children().each(function() {
				out += '<li>' + $(this).html() + '</li>';
			});
			out += '</ul>';
			out += '</div>';
			return out;
		});
		
		$('#' + id + '_crai_carousel_items').jcarousel({
			vertical: carouselVertical,
			scroll: carouselScroll,
			visible: carouselVisible,
			itemFallbackDimension: itemWidth*carouselVisible,
			initCallback: function() {
				$('#' + id + ' .jcarousel-prev').css('top', (itemHeight/2)-24 + 'px');
				$('#' + id + ' .jcarousel-next').css('top', (itemHeight/2)-24 + 'px');
			}
		});
		
	});
});