var carouselBusy = false;



function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt)
{
   // The index() method calculates the index from a
   // given index who is out of the actual item range.
   var idx = carousel.index(i, mycarousel_itemList.length);
   carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));

};


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


function mycarousel_getItemHTML(item)
{
   return '<li><a href="' + item.href + '" target="' + item.target + '"><img src="' + item.url + '_small.jpg" width="194" height="158" alt="' + item.title + '" border="0" /></a></li>';
};


function mycarousel_initCallback(carousel)
{		    
	/*
	// Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function() {
        carousel.startAuto(0);
    });

    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });
	*/
	
	carousel.clip.hover(function() {
		
		$(".jcarouselButtonOverlay").show();

    }, function() {
		$(".jcarouselButtonOverlay").hide();
	
	});
	
	$(".jcarouselButtonOverlay").hover(function() {
		
		$(".jcarouselButtonOverlay").show();

    }, function() {
		$(".jcarouselButtonOverlay").hide();
	
	});
	
	$("#jcarouselButtonNext").click(function() {
		
        if(!carouselBusy)
		{
			carousel.next();
			carouselBusy = true;
		}
		
    });

	$("#jcarouselButtonPrev").click(function() {
		
		if(!carouselBusy)
		{
			carousel.prev();
			carouselBusy = true;
		}

    });
	
};

		
function fadeOutPrevImage(carousel, item, i, state, evt)
{
	//$("#debug").append( carousel );
	if(state == "next")
	{
		var idx = carousel.index(i, mycarousel_itemList.length);
		var url = mycarousel_itemList[idx - 1]['url'];
	}else{
		var idx = carousel.index(i + 2, mycarousel_itemList.length);
		var url = mycarousel_itemList[idx - 1]['url'];
	}
	

	$("#jcarouselMainImage").css('background-image', "url(" + url + ".jpg)");
	$("#jcarouselMainImage img").fadeOut();
}

function fadeInNextImage(carousel, item, i, state, evt)
{
	//$("#debug").append( carousel );
	if(state == "next")
	{
		var idx = carousel.index(i, mycarousel_itemList.length);
		var url = mycarousel_itemList[idx - 1]['url'];
		var href = mycarousel_itemList[idx - 1]['href'];
		var target = mycarousel_itemList[idx - 1]['target'];
		var title = mycarousel_itemList[idx - 1]['title'];
	}else{
		var idx = carousel.index(i + 2, mycarousel_itemList.length);
		var url = mycarousel_itemList[idx - 1]['url'];
		var href = mycarousel_itemList[idx - 1]['href'];
		var target = mycarousel_itemList[idx - 1]['target'];
		var title = mycarousel_itemList[idx - 1]['title'];
	}
	
	
	//alert(i + " " + evt + " " + state);
	
	$("#jcarouselMainImage img").attr('src', url + '.jpg').fadeIn();
	$("#jcarouselMainImage img").attr('alt', title);
	$("#jcarouselMainImage a").attr("href", href);
	$("#jcarouselMainImage a").attr("target", target);
	carouselBusy = false;
}		


jQuery(document).ready(function() {

	var preload = 0;
	var picBig = Array();
	var picSml = Array();

	for(preload = 0; preload < mycarousel_itemList.length; preload++)
	{
		picBig[preload] = new Image(776,474);
		picBig[preload].src = mycarousel_itemList[preload]["url"] + ".jpg";
		
		picSml[preload] = new Image(194,158);
		picSml[preload].src = mycarousel_itemList[preload]["url"] + "_small.jpg";
	}

    jQuery('#mycarousel').jcarousel({
        vertical: true,
		start: (mycarousel_itemList.length-3 > 0) ? mycarousel_itemList.length-3 : 3,
        scroll: 1,
		auto: 8,
		wrap: 'circular',        	
		initCallback: mycarousel_initCallback,
		itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
		itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback},
		itemFirstOutCallback: {onBeforeAnimation: fadeOutPrevImage, onAfterAnimation: fadeInNextImage},
		buttonNextHTML: null,
		buttonPrevHTML: null
    });
});