// execute your scripts when DOM is ready. this is a good habit 
$(function() {      
    // initialize scrollable  
    	var api = $("div.scrollable").scrollable({size:5,api: true}); 

		// select items and do something when they are clicked 
	    $("div.scrollable: div.items div").click(function() { 
			var ffName = $(this).metadata().name;
			var ffID = $(this).metadata().id;
			var ffFilename = $(this).metadata().filename;
			clearInterval(autoscroller);
		    clickThumb(ffFilename,ffName,ffID);
	    });
	
		$('div.scrollable: div.items div').mouseenter(function(event){
			var metadata = $(this).metadata();
			var content = '<strong>'+metadata.name+'</strong>';
			$('div#tooltip').hide().find('div.tooltip-content').html(content);
			tooltipMove(event);
			$('div#tooltip').show();
		});
		$('div.scrollable: div.items div').mousemove(tooltipMove);
		$('div.scrollable: div.items div').mouseleave(function(){ $('div#tooltip').hide(); });

		autoscroller = setInterval('autoAdvanceScroller(FFsArr)',10000);
});

function clickThumb(f,n,id){
	//f=filename, n=name, id=id, c = show constants bool, show visual browser button bool
	$('#bigFFImg').parent().attr("id",id);
	$('#bigFFImg').parent().attr("filename",f);
	f="/images/FastFacts/Syndication/"+f.replace(".png",".jpg");
	//alert(f+"|"+n+"|"+id);
	
	
	$("#bigFFImg img").hide();
	$("#bigFFImg img").attr("src",f).fadeIn();
	if(pageTracker){pageTracker._trackEvent("Fast Fact", "View Image",'"'+n+'"');}
}



function autoAdvanceScroller(FFsArr){
	FF = FFsArr[storyItem];
	FFArr = FF.split("^");
	//alert(FFArr[2]);
    clickThumb(FFArr[2].replace(".png",".jpg"),FFArr[1],FFArr[0]);
	
	var api = $("div.scrollable").scrollable({api: true}); 
	api.click(storyItem);
	
	storyItem = storyItem+1;
	if(storyItem>=FFsArr.length){
		storyItem = 0;
	}
}

// Project Tooltips

function tooltipMove(event)
{
	var offset = $(event.target).offset();
	offset.top = event.pageY + 16;
	offset.left = event.pageX - 14;

	$('div#tooltip').css(offset);
}

