var workingWithSlider;
var sliderEffect;
var wwMoveSizes = new Array();
var wwPosition = 0;

function gforcesWorkingWithScroller() {

    var i = 0;
    var linkSizes = new Array();
    var totalLinkWidth = 0;

    // Create Array of element widths
    $$('#workingWithScroll a img').each( function (li) {
        linkSizes[i] = li.getStyle('width');
        linkSizes[i] = linkSizes[i].substr(0,linkSizes[i].length-2);
        totalLinkWidth = totalLinkWidth + Number(linkSizes[i]);  
        i++;
    });

    // Calculate how much scrolling is needed
    var containerSize = $('workingWithContainer').getStyle('width');
    var containerSize = containerSize.substr(0,containerSize.length-2);
    var needToScroll = totalLinkWidth - containerSize;

    // Create an array of the needed moves
    i = 0;
    while ( needToScroll > 0 ) {
        wwMoveSizes[i] = linkSizes[i];
        needToScroll = needToScroll - wwMoveSizes[i]; 
        i++;
    }


	workingWithSlider = $('workingWithScroll');

	$('workingWithNext').observe('click', function(event) {
		if (sliderEffect == null || sliderEffect.state == "finished") {
            if ( wwPosition != 0 ){
                wwPosition--;
                sliderEffect = new Effect.Move(workingWithSlider, { x: wwMoveSizes[wwPosition], y: 0, mode: 'relative' });
            }

		}

	});

	$('workingWithPrev').observe('click', function(event) {
		if (sliderEffect == null || sliderEffect.state == "finished") {
            var positionTemp = wwPosition; 
            if ( wwMoveSizes[ positionTemp ] != undefined ){
                var move = wwMoveSizes[wwPosition] * -1;
                sliderEffect = new Effect.Move(workingWithSlider, { x: move, y: 0, mode: 'relative' });
                wwPosition++;
            }
		}

	});
    

}