function initCarousel_html_carousel()
{
	var carousel1 = new Carousel
	(
		'carousel1', {
			animHandler:animHandler, 
			animParameters:{duration:0.5}, 
			buttonStateHandler:buttonStateHandler, 
			nextElementID:'carousel1_next', 
			prevElementID:'carousel1_previous', 
			size:8}
	);

	var carousel2 = new Carousel
	(
		'carousel2', {
			animHandler:animHandler, 
			animParameters:{duration:0.5}, 
			buttonStateHandler:buttonStateHandler, 
			nextElementID:'carousel2_next', 
			prevElementID:'carousel2_previous', 
			size:8}
	);
		
	var carousel3 = new Carousel
	(
		'carousel3', {
			animHandler:animHandler, 
			animParameters:{duration:0.5}, 
			buttonStateHandler:buttonStateHandler, 
			nextElementID:'carousel3_next', 
			prevElementID:'carousel3_previous', 
			size:16}
	);
	
	var carousel4 = new Carousel
	(
		'carousel4', {
			animHandler:animHandler, 
			animParameters:{duration:0.5}, 
			buttonStateHandler:buttonStateHandler, 
			nextElementID:'carousel4_next', 
			prevElementID:'carousel4_previous', 
			size:16}
	);
	
}

function buttonStateHandler(button, enabled) {
/*
 if (button == "prev-arrow") 
   $('prev-arrow').src = enabled ? "images/left3-enabled.gif" : "images/left3-disabled.gif"
 else 
   $('next-arrow').src = enabled ? "images/right3-enabled.gif" : "images/right3-disabled.gif"
   */
}

function animHandler(carouselID, status, direction) {
  var region = $(carouselID).down(".carousel-clip-region")
  if (status == "before") {
    //Effect.Fade(region, {to: 0.3, queue: { position:'end', scope: "carousel" }, duration: 0.2})
  }
  if (status == "after") {
    //Effect.Fade(region, {to: 1, queue: { position:'end', scope: "carousel" }, duration: 0.2})
  }
}


Event.observe(window, 'load', initCarousel_html_carousel);