var carousel = null;
    function initCarousel() {
      carousel = new Carousel('html_banner', {animHandler:animHandler, animParameters:{duration:0.4}, buttonStateHandler:buttonStateHandler, nextElementID:'next_arrow', prevElementID:'prev_arrow', size:21, scrollInc:1})
    }
    Event.observe(window, 'load', initCarousel);

    var direction = "next";
    function scroll() {
      if (carousel.currentIndex == carousel.options.size - 4) {
        direction = "prev";
      } else if (carousel.currentIndex == 0) {
        direction = "next";
      } else {
        // do nothing
      }
      
      if (direction == "next") {
        carousel.options.scrollInc = 1;
        carousel.nextScroll();
        carousel.options.scrollInc = 3;
      } else {
        carousel.options.scrollInc = 1;
        carousel.prevScroll();
        carousel.options.scrollInc = 3;
      }
    }
    new PeriodicalExecuter(scroll, 3.7);
    
    
    function buttonStateHandler(button, enabled) {
      if (button == "prev_arrow") {
        $('prev_arrow').src = enabled ? "images/public/lt-enabled.gif" : "images/public/lt-disabled.gif"
      } else {
        $('next_arrow').src = enabled ? "images/public/rt-enabled.gif" : "images/public/rt-disabled.gif"
      }
    }
    
    function animHandler(carouselID, status, direction) {
      var region = $(carouselID).down(".banner_clip_region")
      if (status == "before") {
        Effect.Fade(region, {to: 0.3, queue: { position:'end', scope: "banner" }, duration: 0.5})
      }
      if (status == "after") {
        Effect.Fade(region, {to: 1, queue: { position:'end', scope: "banner" }, duration: 0.6})
      }
    }
  //]]>