/**
 * Custom button state handler for enabling/disabling button state. 
 * Called when the carousel has determined that the previous button
 * state should be changed.
 * Specified to the carousel as the configuration
 * parameter: prevButtonStateHandler
 **/
var handlePrevButtonState = function(type, args)
{
  var enabling = args[0];
  var leftImage = args[1];
  if(enabling)
  {
    leftImage.src = "images/carousel_left_enabled.gif";    
  }
  else
  {
    leftImage.src = "images/carousel_left_disabled.gif";    
  }
};

/**
 * Custom button state handler for enabling/disabling button state. 
 * Called when the carousel has determined that the next button
 * state should be changed.
 * Specified to the carousel as the configuration
 * parameter: nextButtonStateHandler
 **/
var handleNextButtonState = function(type, args)
{
  var enabling = args[0];
  var rightImage = args[1];
  
  if(enabling)
  {
    rightImage.src = "images/carousel_right_enabled.gif";
  }
  else
  {
    rightImage.src = "images/carousel_right_disabled.gif";
  }
};

var OnPageLoad = function() 
{
  carousel = new YAHOO.extension.Carousel(
    "mycarousel", 
    {
      numVisible:               3,
      animationSpeed:           0.8,
      animationMethod:          YAHOO.util.Easing.easeBoth,
      scrollInc:                1,
      navMargin:                12,
      prevElement:              "prev-arrow",
      nextElement:              "next-arrow",
      size:                     8,
      prevButtonStateHandler:   handlePrevButtonState,
      nextButtonStateHandler:   handleNextButtonState,
      wrap: true
    }
  );
};