$(function() {
	var shifter = {
		width: $("#shifter").width(), //$('#castCrewContainer').width(),
		initWidth: 0,
		paneWidth: $(".pane").width(), //
		animating: false
	};

	$('a.shiftleft').click(function(e){
		e.preventDefault();
		
		if (shifter.animating == false) {
			shifter.animating = true;

			//if (shifter.initWidth > -shifter.paneWidth )
			if (shifter.initWidth > -shifter.width ){

				shifter.initWidth = shifter.initWidth - shifter.paneWidth; //shifter.width;
				$('#shifter').animate({left: shifter.initWidth});

				//if (shifter.initWidth == -shifter.paneWidth )
				if (shifter.initWidth - shifter.paneWidth == -shifter.width ){

					$('#buttonLeft').fadeOut(); //hide button when shifted
				}
			}

			$('#buttonRight').fadeIn(); //show button when shifted
			setTimeout(function() {
				shifter.animating = false;
			}, 500);
		}
	});

	// Same thing in reverse.
	$('a.shiftright').click(function(e) {
		e.preventDefault();
		
		if (shifter.animating == false) {
			shifter.animating = true;
			if (shifter.initWidth < 0 ) {
				shifter.initWidth = shifter.initWidth + shifter.paneWidth; // + shifter.width;
				$('#shifter').animate({left: shifter.initWidth});

				if (shifter.initWidth == 0 ){

					$('#buttonRight').fadeOut(); //hide button when shifted
				}
			}

			$('#buttonLeft').fadeIn(); //show button when shifted

			setTimeout(function() {
				shifter.animating = false;
			}, 500);
		}
	});
});