$(document).ready(function() {
	initializeStageBoxes();
});

// Number of complete and shown boxes is variable
// Please set the hidden boxes on display: none; in stylesheet
// Variables that can be set
var numberOfShownBoxes = 1;
var secondsBetweenChange = 9;
// Additional variables
var t;
var boxToHide = -1;
var boxToShow = boxToHide + numberOfShownBoxes;
var animateTime = 2000;
var infoAnimateTime = 300;
var imgHeight = 400;
var imgWidth = 960;
var infoHeight = 330;
var easingInfo = "easeInOutCirc";
var easingCurtains = "easeInOutCirc";
//var easingCurtains = "easeInBounce";
//var easingCurtains = "easeOutBounce";
//var easingCurtains = "easeInOutBounce";


function initializeStageBoxes() {
	// Show only first box
	$("#stage_container .stage_item").hide();
	$("#stage_container .stage_item").eq(0).show();
	$("#info_container .info").hide();
	$("#info_container .info").eq(0).show();
	
	// First Curtains Animation
	$("#curtains #top").animate({top : '-=' + (imgHeight/2)}, animateTime, easingCurtains, function(){
		$("#info_container .info").eq(0).animate({top : '+=' + infoHeight}, infoAnimateTime, easingInfo);		
	});
	$("#curtains #left").animate({left : '-=' + (imgWidth/2)}, animateTime, easingCurtains);
	$("#curtains #right").animate({left : '+=' + (imgWidth/2)}, animateTime, easingCurtains);
	$("#curtains #bottom").animate({top : '+=' + (imgHeight/2)}, animateTime, easingCurtains);
	
	// Rotate Logo Box
	$("#logo_box").rotate3Di(360, 1000, {
    	complete: function() {
    		$("#logo_box #logo").fadeIn(1000);
    		$("#logo_box p").slideDown(1000);
    	}
	});
	
	var numberOfBoxes = $("#stage_container .stage_item").size();
	if(numberOfBoxes>1) {
		changeStageBoxes();
	}
}

function changeStageBoxes() {
	if(boxToHide > -1) {
		//alert(boxToHide + " wird gegen " + boxToShow + " ausgetauscht!");
		var hide = boxToHide;
		var show = boxToShow
		$("#info_container .info").eq(hide).animate({top : '-=' + infoHeight}, infoAnimateTime, easingInfo, function(){
			$("#info_container .info").eq(hide).hide();
			$("#curtains #top").animate({top : '+=' + (imgHeight/2)}, animateTime, easingCurtains, function(){
				$("#stage_container .stage_item").eq(hide).hide();
				$("#stage_container .stage_item").eq(show).show();
				$("#curtains #top").animate({top : '-=' + (imgHeight/2)}, animateTime, easingCurtains, function(){
					$("#info_container .info").eq(show).show();
					$("#info_container .info").eq(show).animate({top : '+=' + infoHeight}, infoAnimateTime, easingInfo);				
				});
			});
			$("#curtains #left").animate({left : '+=' + (imgWidth/2)}, animateTime, easingCurtains, function(){
				$("#curtains #left").animate({left : '-=' + (imgWidth/2)}, animateTime, easingCurtains);
			});
			$("#curtains #right").animate({left : '-=' + (imgWidth/2)}, animateTime, easingCurtains, function(){
				$("#curtains #right").animate({left : '+=' + (imgWidth/2)}, animateTime, easingCurtains);
			});	
			$("#curtains #bottom").animate({top : '-=' + (imgHeight/2)}, animateTime, easingCurtains, function(){
				$("#curtains #bottom").animate({top : '+=' + (imgHeight/2)}, animateTime, easingCurtains);
			});
		});
	}
	var numberOfBoxes = $("#stage_container .stage_item").size();
	if(boxToHide == (numberOfBoxes - 1)) {
		boxToHide = -1;
	}
	if(boxToShow == (numberOfBoxes - 1)) {
		boxToShow = -1;
	}
	boxToHide++;
	boxToShow++;
	t=setTimeout("changeStageBoxes()", secondsBetweenChange * 1000);
}