function setBackgroundImageUrl() {
    var current = carousel.scrollable().getPageIndex() + 1;
    swapItemTitleAndSrc(current);
}

function swapItemTitleAndSrc(current) {
    var nextItem = $('div.scrollable ul li:eq(' + current + ')');
    if (nextItem.length == 0) return false;
	var itemImgLink = nextItem.find('span').attr('title');
    nextItem.removeAttr('title');
	var loadImage = $('<img>');
	loadImage.bind('load', function() {
        nextItem.css('background', 'url(' + itemImgLink + ') no-repeat 0 0');
    }).attr('src', itemImgLink);    
}

function getSetCarouselControlsInfo () {

	var carouselConf = carousel.scrollable();
	var current = carouselConf.getPageIndex() + 1;
	var total = carouselConf.getSize();
	var currentSpan = $('#feature p span#current');
	var totalSpan = $('#feature p span#total');
	var pLeft = $('#feature p.left');
	var pHit = $('#feature p.hit');
	var pRight = $('#feature p.right');

	currentSpan.text(current); 
	totalSpan.text(total);

	// arrow controls - based on current list item

	pLeft.hide(); //hides left-arrow

	if (currentSpan.text() == "1") {
		pLeft.fadeOut('slow');
	}

	else if (currentSpan.text() == "2") {
		pLeft.addClass('hit');
		if (pLeft.hasClass('hit')) {
			pLeft.show();
		}
		else {
		    pLeft.fadeIn('slow');
	    }
	}

	else {
	    pLeft.show(); 
	}

	if (currentSpan.text() == total) {
		pRight.hide('slow');
	}
	else pRight.show('slow');
	
}

function initCarouselHome (scrollableDiv){
	carousel = $(scrollableDiv);
	$(carousel).scrollable({     
		size: 1,
		loop: true,
		next: 'p.right', 
		prev: 'p.left',
		easing: 'swing',
		//interval: 10000,
		onSeek: function() { 
			setBackgroundImageUrl();
			getSetCarouselControlsInfo();
		}
	}); 
} 

$(function(){
if ( $('div.scrollable').length > 0 ) {
		initCarouselHome('div.scrollable');
		getSetCarouselControlsInfo();
	}
});