$(document).ready(function(){
	var logo_carousel = $("<ul></ul>", {
		"class": "jcarousel-skin-red_london",
		id: "homepage_logo_carousel"
	});
	$("#homepage_banner").after(logo_carousel);
	logo_carousel.jcarousel({
		wrap: "circular",
		scroll: 8,
		visible: 8,
		animation: 2000,
		easing: "easeInOutSine",
		auto: 0,
		itemLoadCallback: {
			onBeforeAnimation: function (carousel, state){
				// Check if the requested items already exist
				if (carousel.has(carousel.first, carousel.last)) {
					return;
				}

				$.getJSON("/data_feed/homepage_logos.php", {
						position: carousel.first,
						number: 8
					},
					function(logos) {
						// Set the size of the carousel
						carousel.size(carousel.first + parseInt(logos.total));

						jQuery.each(logos.logos, function(i,logo){
							var item = $("<a></a>", {
								href: logo.uri
							}).append(
								$("<img/>", {
									alt: logo.name,
									src: logo.image
								})
							);

							carousel.add(carousel.first + i, item);
						});
					},
					'xml'
				);
			}
		},
		itemVisibleOutCallback: {
			onAfterAnimation: function(carousel, item, i, state, evt) {
				carousel.remove(i);
			}
		}
	});
});