var handlePrevButtonState = function(type, args) {

    var enabling = args[0];
    var leftImage = args[1];
    if(enabling) {
        leftImage.src = "/wp-content/themes/headless/images/left-enabled.gif";    
    } else {
        leftImage.src = "/wp-content/themes/headless/images/left-disabled.gif";
    }
    
};
var handleNextButtonState = function(type, args) {

    var enabling = args[0];
    var rightImage = args[1];
    if(enabling) {
        rightImage.src = "/wp-content/themes/headless/images/right-enabled.gif";    
    } else {
        rightImage.src = "/wp-content/themes/headless/images/right-disabled.gif";
    }
    
};
/**
 * You must create the carousel after the page is loaded since it is
 * dependent on an HTML element (in this case 'dhtml-carousel'.) See the
 * HTML code below.
 **/

var carousel; // for ease of debugging; globals generally not a good idea
var pageLoad = function() 
{
    var carousel = new YAHOO.extension.Carousel("dhtml-carousel", 
        {

                numVisible:         8,
                animationSpeed:    2,
                scrollInc:         8,
                navMargin:         40,
				revealAmount:		20,
                size:	55,
			 	prevElement:     "prev-arrow",
	   			nextElement:     "next-arrow",	
            prevButtonStateHandler:   handlePrevButtonState,
            nextButtonStateHandler:	  handleNextButtonState
        }
    );
};

YAHOO.util.Event.addListener(window, 'load', pageLoad);