$(document).ready(function() {

    var scrollable = $("div.scrollable").scrollable({
		size: 4,
		vertical: false,
		clickable: false,
		loop: true,
		easing: "swing",
		api: true
	});
	
	$("#rightArrow").click(function() {
		scrollable.next();
	});
	
	$("#leftArrow").click(function() {
		scrollable.prev();
	});

	$('#columns').columnize({width:290});
	
	$(".scrollable .items img").click(function() {
		var rel = $(this).attr("rel");
		// facebox("<img src='" + rel + "' width='800' height='524'>");
		overlay(rel);
	});
	
    var api = jQuery("#overlay").overlay({
		api: true,
		expose: false,
		closeOnClick: false
	});

});

function overlay(url) {
	
	$("#overlay .container").html("<center><img src='/media/large_wait_indicator.gif' style='margin-top: 210px;'></center>");
	var api = $("#overlay").overlay();
	api.load();

	$.post(url, {}, function(result) {
		$("#overlay .container").html(result);
	});
	
}