/* ------
This script initializes the work teaser carousels on work.html and index.html, both full-width
and half-width, and implements the hovering functionality on the info modules contained therein.
------ */

function tinyInit(carousel, carouselDiv) {
	carouselDiv.prev(".dotCounter").children("img").bind('click', function() {
		carousel.scroll(jQuery.jcarousel.intval($(this).attr("class")));
		return false;
	});
};

function flipCounter(carousel, item, idx, state, carouselDiv) {
	if(state === "next") {
		carouselDiv.prev(".dotCounter").children("img:first").attr("src", "/img/lightdot.png");
		carouselDiv.prev(".dotCounter").children("img:last").attr("src", "/img/darkdot.png");
	} else if(state === "prev") {
		carouselDiv.prev(".dotCounter").children("img:first").attr("src", "/img/darkdot.png");
		carouselDiv.prev(".dotCounter").children("img:last").attr("src", "/img/lightdot.png");
	}
};

$(document).ready(function() {
	// Initialize all work carousels.
	$("#fullWidthCarousel").jcarousel({
		scroll:4,
		animation:600,
		initCallback: function (carousel) {tinyInit(carousel, $("#fullWidthCarousel"))},
		itemFirstOutCallback: function (carousel, item, idx, state) {flipCounter(carousel, item, idx, state, $("#fullWidthCarousel"))}
	});

	$("#firstHalfCarousel").jcarousel({
		scroll:2,
		animation:400,
		initCallback: function (carousel) {tinyInit(carousel, $("#firstHalfCarousel"))},
		itemFirstOutCallback: function (carousel, item, idx, state) {flipCounter(carousel, item, idx, state, $("#firstHalfCarousel"))}
	});

	$("#secondHalfCarousel").jcarousel({
		scroll:2,
		animation:400,
		initCallback: function (carousel) {tinyInit(carousel, $("#secondHalfCarousel"))},
		itemFirstOutCallback: function (carousel, item, idx, state) {flipCounter(carousel, item, idx, state, $("#secondHalfCarousel"))}
	});

	// Preload the infomodule shadow image and rollover link images for the feature carousel.
	if (document.images) {
		imageUrl = new Array(5);
		imageUrl[0] = "/img/readmore_over.png";
		imageUrl[1] = "/img/viewwork_over.png";
		imageUrl[2] = "/img/readnews_over.png";
		imageUrl[3] = "/img/over-box.png";
		imageUrl[4] = "/img/indexbg.png";
		for(var n = 0; n <= 4; n++) {
			preloadWorkImgs = new Image();
			preloadWorkImgs.src = imageUrl[n];
		}
	}

	// Implement info module onHover functionality on all carousels with work content. Simple!
	$(".contentCarousel .jcarousel-clip ul li").hover(
		function() {
			$(this).css("background-image","url(/_img/over-box.png)");
			$(this).children(".smallTeaserWrapper").children(".projectDesc").css("display","block");
		},
		function() {
			$(this).css("background-image","none");
			$(this).children(".smallTeaserWrapper").children(".projectDesc").css("display","none");
		}
	);
});