var currElem;

// Initialize
$(function () {
	init();
});

// Previous/Next Buttons, Start the Case
function init() {
	$(".prevBtn").click(function() {
		currElem = $(".current");
		if (currElem.children().is(':animated')) {
			var y = $(currElem).children(".before").height();
			var topPosition = (y*.5) + 10;
			currElem
				.children()
				.clearQueue()
				.stop(true,false)
				.hide()
				.css({
					display: "none",
					left: "110px",
					top: topPosition,
					opacity: 1
				});
			$(".before span").remove();
			$(".after span").remove();
		}
		endCase(currElem,function() {
			startCase($(currElem).prev());
		});
		return false;
	});
	$(".nextBtn").click(function() {
		currElem = $(".current");
		if (currElem.children().is(':animated')) {
			var y = $(currElem).children(".before").height();
			var topPosition = (y*.5) + 10;
			currElem
				.children()
				.clearQueue()
				.stop(true,false)
				.hide()
				.css({
					display: "none",
					left: "110px",
					top: topPosition,
					opacity: 1
				});
			$(".before span").remove();
			$(".after span").remove();
		}
		endCase(currElem,function() {
			startCase($(currElem).next());
		});
		return false;
	});
	startCase();
}

function startCase(elem) {
	if(!elem) {
		elem = $(".gallery:first");
	}
	
	$(elem)
		.addClass("current")
		.show();


	// Check to see if it's the first or last case	
	var nextElem = $(elem).next().attr("class");
	if (nextElem != "gallery") {
		$(".nextBtn").hide();
	} else {
		$(".nextBtn").show();
	}
	var prevElem = $(elem).prev().attr("class");
	if (prevElem != "gallery") {
		$(".prevBtn").hide();
	} else {
		$(".prevBtn").show();
	}


	var before=$(elem).children('.before');
	var after=$(elem).children('.after');
	
	// Add Before/After text
	$(before).append('<span></span>');
	$(after).append('<span></span>');
	
	// Measure image height to determine total gallery height and positioning
	/* var y = before.children("img").attr("height"); */
	var y = before.height();
	var ulHeight = (y*2) + 20;
	var topPosition = (y*.5) + 10;
	
	$(".current").css({
		height: ulHeight+'px'
	});
	$(".before").css({
		top: topPosition+'px'
	});
	$(".after").css({
		top: topPosition+'px'
	});
	
	// Begin Animation
	before.fadeIn("slow", function() {
		after.delay(1200).fadeIn("slow", function() {
			startMove(elem);
		});
	});
}
function endCase(elem,callback) {
	$(elem)
		.removeClass("current")
		.hide()
		.children()
			.clearQueue()
			.stop(true,false)
			.hide()
			.css({
				height: "auto",
				display: "none",
				left: "110px",
				top: "0"
			});
	$(".before span").remove();
	$(".after span").remove();
	var initCallback = callback();
}
function startMove(elem) {
	// Dynamically calculate final positions
	var y = $(elem).children().height();
	y = y * .34;
	var yBefore = "-="+y;
	var yAfter = "+="+y;
	var x = $(elem).children().width();
	x = x * .34;
	var xBefore = "-="+x;
	var xAfter = "+="+x;


	moveElemTo($(".current").children('.before'), xBefore, yBefore);
	moveElemTo($(".current").children('.after'), xAfter, yAfter);
}
function moveElemTo(elem, x, y) {
	$(elem)
		.delay(1200)
		.animate({
			top: y,
			left: x
	}, 1200, function() {
		var beforeText=$(elem).children('.before span');
		var afterText=$(elem).children('.after span');
		beforeText.fadeIn(500);
		afterText.fadeIn(500);
	});
}