// -----------------------------------------------------------------------------------------------------------------------------
// behaviours - Handles carousel behaviors.  Builds one per page only and only on project pages
// depends: 	jQuery library;
// author:		jsn;
// -----------------------------------------------------------------------------------------------------------------------------

$().ready(function() {
	//Are we on a project page and with the need for a carousel?
	var features = $(".project .features li");
	if (features.length < 4) return;
	
	var featuresContainer = $(".features"),
		featuresList = $(".features ul"),
		features = featuresList.find("li");
		numberOfVisibleItems = 3,
		firstVisibleItem = 0,
		nextItem = $("<a href=\"#\" class=\"next\"><span>Next</span></a>"),
		previousItem = $("<a href=\"#\" class=\"previous\"><span>Previous</span></a>"),
		nextArrow = nextItem.find("span"),
		previousArrow = previousItem.find("span");
	init();
	
	function init() {
		//we dont want or need the existing header and footer - remove them
		$(".contentMainHeader").remove();
		$(".contentMain .footer").remove();
		//set the activating class on the features container
		featuresContainer.addClass("featuresCarousel");
		//remove the first class from any items
		features.removeClass("first");
		// Add span for play icon for youtube thumbnails
		features.find("a.lightbox").append("<span></span>");
		//remove any bottom padding from contentMain
		$(".contentMain").css("padding-bottom", 0);
		//add the controls
		featuresContainer.before(previousItem).after(nextItem);
		//add event handlers to controls
		previousItem.click(movePrevious);
		nextItem.click(moveNext);
		//set the initial display status
		updateFeaturesDisplay();
	}
	
	function updateFeaturesDisplay() {
		//set the "last" class on the last element
		features.removeClass("last");
		$(features[firstVisibleItem + numberOfVisibleItems - 1]).addClass("last");
		//animate everything into position
		featuresContainer.animate( {
			"height": getHeightOfFeatures()
		}, "fast" );
		featuresList.animate( {
			"top": getTopPositionOfList()
		}, "fast" );
		//change the display of the up and down arrows
		previousArrow[ (firstVisibleItem > 0 ? "remove" : "add") + "Class" ]("end");
		nextArrow[ (firstVisibleItem+numberOfVisibleItems < features.length ? "remove" : "add") + "Class" ]("end");
	}
	
	function getHeightOfFeatures() {
		var height = 0,
			i = firstVisibleItem,
			j = firstVisibleItem + numberOfVisibleItems;
		for (i; i<j; i++) {
			height += features[i].offsetHeight;
		}
		return height;
	}
	
	function getTopPositionOfList() {
		var top = 0,
			i = 0;
		for (i; i<firstVisibleItem; i++) {
			top += features[i].offsetHeight;
		}
		//if top is greater than 1 add another 2 to account for border between items
		return (top>0?top+2:top) * -1;
	}
	
	function movePrevious(e) {
		e.preventDefault();
		if (firstVisibleItem === 0) return;
		firstVisibleItem--;
		updateFeaturesDisplay();
	}
	function moveNext(e) {
		e.preventDefault();
		if (firstVisibleItem+numberOfVisibleItems >= features.length) return;
		firstVisibleItem++;
		updateFeaturesDisplay();
	}
});
