// VARIABLES
var activePicture = 0;

var windowwidth = null;
var windowheight = null;

var minContainerWidth = null;
var minContainerHeight = null;
	
var marginTop = null;
var marginLeft = null;
var marginRight = null;
var marginBottom = null;

var marginY = null;
var marginX = null;

var maxAreaHeight = null;
var maxAreaWidth = null;

var minContainerWidth = null;
	
var containerWidth = null;
var containerHeight = null;

var areaWidth = null;
var areaHeight = null;

var GalleryElements = null;
var Gallery = null;

var resizeTimer = null;
var startResize = false;
var startInt = null;

// ------------------------------------------------------------------------ //
// FUNCTIONS
var currentAdd = 0;
var load2ImageTag = 0;

function createElements(GalleryElements) {
	var Gallery = new Array();
	var a = 0;
	for(var i = 0; i < GalleryElements.length; i++) {
		Gallery[i] = new Array();
		Gallery[i]["element"] = GalleryElements[i].id;
		Gallery[i]["loaded"] = false;
		Gallery[i]["type"] = $("#"+GalleryElements[i].id).attr("type");
	}
	return Gallery;
}

function addImage(img) {
	var Parent = $(img).parent().get(0).id;
	var ParentType = $("#"+Parent).attr("type");
	
	if(ParentType == "one") {
		addImageToElement(currentAdd);
	} else {
		if(load2ImageTag == 0) {
			load2ImageTag = 1;
		} else {
			addImageToElement(currentAdd);
			load2ImageTag = 0;
		}
	}
}

function addImageToElement(i) {
	if($("#"+Gallery[i]["element"]).attr("type") == "two")  {

		var tempArray = $("#"+Gallery[i]["element"]).find('img');

		Gallery[i]["image"] = new Array();	
		for(var j = 0; j < tempArray.length; j++) {
			var imgId = $(tempArray[j]).attr("id");
			Gallery[i]["image"][j] = imgId;
			
		}
		
		var newWidth = parseFloat($("#"+Gallery[i]["image"][0]).width()) + parseFloat($("#"+Gallery[i]["image"][1]).width());
		$("#" + Gallery[i]["element"]).css("width" , newWidth);
	} else {
		var html = trim($("#"+Gallery[i]["element"]).html());
		html = html.split('>').join(' />');
		var imgId = $(html).attr("id");
		Gallery[i]["image"] = imgId;
	}
	if(i == activePicture) resizePage();

	Gallery[i]["loaded"] = true;
	if(i == (Gallery.length-1)) checkForPrevPictureButton();
	currentAdd = (currentAdd+1);
}

function trim(str, chars) {
	return ltrim(rtrim(str, chars), chars);
}
 
function ltrim(str, chars) {
	chars = chars || "\\s";
	return str.replace(new RegExp("^[" + chars + "]+", "g"), "");
}
 
function rtrim(str, chars) {
	chars = chars || "\\s";
	return str.replace(new RegExp("[" + chars + "]+$", "g"), "");
}

function resizePage() {
	windowwidth = $(window).width();
	windowheight = $(window).height();
		
	containerWidth = windowwidth;
	containerHeight = windowheight;
	
	marginTop = 132;
	marginLeft = 40;
	marginRight = 40;
	marginBottom = 40;
	
	minContainerWidth = 570;
	
	marginY = marginTop + marginBottom;
	marginX = marginLeft + marginRight;
	
	maxAreaHeight = windowheight - marginY;
	maxAreaWidth = windowwidth - marginX;
	
	areaHeight = maxAreaHeight;
	areaWidth = maxAreaWidth;
	
	resizeImage(activePicture);
	
	if(contentWidth < minContainerWidth) {
		contentWidth = minContainerWidth;
		areaWidth = minContainerWidth-marginX;
	}

	$("#Container").animate({
		width: contentWidth+"px",
		height: contentHeight+"px"
	}, 500, function() {
		$("#Container").css("margin", "0 auto");
	});
	
	if(Gallery[activePicture]["type"] == "one") {
		if($("#"+Gallery[activePicture]["image"]).width() < areaWidth) {
			$("#"+Gallery[activePicture]["image"]).css("margin-left", ((areaWidth-$("#"+Gallery[activePicture]["image"]).width())/2)+"px");
		} else {
			$("#"+Gallery[activePicture]["image"]).css("margin-left", "0px");
		}
	}
		
	$("#Inside").animate({
		width: areaWidth+"px",
		height: (areaHeight+marginTop)+"px"
	}, 500);


	$("#Inside").css("overflow", "hidden");
	
	$("#arrowLeft").css("height", areaHeight + "px");
	$("#arrowRight").css("height", areaHeight + "px");
	$("#arrowLeft").css("margin-top", marginTop + "px");
	$("#arrowRight").css("margin-top", marginTop + "px");
	
	$("#arrowLeft_btn").css("height", areaHeight + "px");
	$("#arrowRight_btn").css("height", areaHeight + "px");
	
	startResize = true;
}


function resizeImage(id) {
	var Element = Gallery[id];
	if(Element != undefined) {
		if(typeof(Element["image"]) == "object") {
			var origPictureWidth1 = $("#"+Element["image"][0]).width();
			var origPictureHeight1 = $("#"+Element["image"][0]).height();
			
			var origPictureWidth2 = $("#"+Element["image"][1]).width();
			var origPictureHeight2 = $("#"+Element["image"][1]).height();
			
			var onePictureWidth = origPictureWidth1 + origPictureWidth2;
			var onePictureHeight = origPictureHeight1;
			if(origPictureHeight1 < origPictureHeight2) {
				onePictureHeight = origPictureHeight2;
			}
			
			//alert("maxW: " + maxAreaWidth + ", maxH: " + maxAreaHeight + "\npicW: " + onePictureWidth + ", picH: " + onePictureHeight);
			
			if(maxAreaWidth > maxAreaHeight) {
				// Transformieren nach Höhe
				var pictureWidth1 = Math.round(origPictureWidth1*(maxAreaHeight/origPictureHeight1));
				var pictureHeight1 = maxAreaHeight;
				
				var pictureWidth2 = Math.round(origPictureWidth2*(maxAreaHeight/origPictureHeight2));
				var pictureHeight2 = maxAreaHeight;
			} else {
				// Transformieren nach Breite
				var pictureWidth1 = maxAreaWidth / 2;
				var pictureHeight1 = Math.round(origPictureHeight1*((maxAreaWidth/2)/origPictureWidth1));
				
				var pictureWidth2= maxAreaWidth / 2;
				var pictureHeight2 = Math.round(origPictureHeight2*((maxAreaWidth/2)/origPictureWidth2));
			}
			
			var newFullWidth = pictureWidth1 + pictureWidth2;
			if(newFullWidth > maxAreaWidth) {
				var pictureWidth1 = maxAreaWidth / 2;
				var pictureHeight1 = Math.round(origPictureHeight1*((maxAreaWidth/2)/origPictureWidth1));
				
				var pictureWidth2= maxAreaWidth / 2;
				var pictureHeight2 = Math.round(origPictureHeight2*((maxAreaWidth/2)/origPictureWidth2));
			}
			
			newFullWidth = pictureWidth1 + pictureWidth2;
			var newFullHeight = pictureHeight1;
			if(pictureHeight1 < pictureHeight2) {
				newFullHeight = pictureHeight2;
			}
			
			$("#"+Element["image"][0]).width(pictureWidth1);
			$("#"+Element["image"][0]).height(pictureHeight1);
			
			$("#"+Element["image"][1]).width(pictureWidth2);
			$("#"+Element["image"][1]).height(pictureHeight2);
			
			$("#"+Element["element"]).css("width", newFullWidth);
			$("#"+Element["element"]).css("height", newFullHeight);
			
			contentWidth = newFullWidth + marginX;
			contentHeight = newFullHeight + marginY;
			
			areaWidth = newFullWidth;
			areaHeight = newFullHeight;

		} else {
			//alert("array no");
			var origPictureWidth = $("#"+Element["image"]).width();
			var origPictureHeight = $("#"+Element["image"]).height();

			if(maxAreaWidth > maxAreaHeight) {
				// Transformieren nach Höhe
				var pictureWidth = Math.round(origPictureWidth*(maxAreaHeight/origPictureHeight));
				var pictureHeight = maxAreaHeight;
			} else {
				// Transformieren nach Breite
				var pictureWidth = maxAreaWidth;
				var pictureHeight = Math.round(origPictureHeight*(maxAreaWidth/origPictureWidth));
			}
			
			if(pictureWidth > maxAreaWidth) {
				var pictureWidth = maxAreaWidth;
				var pictureHeight = Math.round(origPictureHeight*(maxAreaWidth/origPictureWidth));
			}
			
			$("#"+Element["image"]).width(pictureWidth);
			$("#"+Element["image"]).height(pictureHeight);
			
			//$("#"+Element["element"]).css("width", pictureWidth);
			$("#"+Element["element"]).css("height", pictureHeight);
			
			contentWidth = pictureWidth + marginX;
			contentHeight = pictureHeight + marginY;
			
			areaWidth = pictureWidth;
			areaHeight = pictureHeight;
			
		}
	}
}


function nextImage() {

	var lastImage = activePicture;
	var nextId = activePicture+1;
	
	if(nextId >= Gallery.length) {
		nextId = 0;
	}

	if(Gallery[nextId]["loaded"] == true) {
		resizeImage(nextId);
	}
	
	$("#"+Gallery[activePicture]["element"]).fadeOut('slow', function() {
		$("#"+Gallery[activePicture]["element"]).removeClass("active");
		
		$("#"+Gallery[nextId]["element"]).fadeIn("slow", function() {
			$("#"+Gallery[nextId]["element"]).addClass("active");
			activePicture = nextId;	
			checkForPrevPictureButton();
			resizePage();
		});
	});

}

function prevImage() {

	var lastImage = activePicture;
	var nextId = activePicture-1;
	
	if(nextId < 0) {
		nextId = Gallery.length-1;
	}

	if(Gallery[nextId]["loaded"] == true) {
		resizeImage(nextId);
	
		$("#"+Gallery[activePicture]["element"]).fadeOut('slow', function() {
			$("#"+Gallery[activePicture]["element"]).removeClass("active");
			
			$("#"+Gallery[nextId]["element"]).fadeIn("slow", function() {
				$("#"+Gallery[nextId]["element"]).addClass("active");
				activePicture = nextId;	
				checkForPrevPictureButton();
				resizePage();
			});
		});
	}
}

function checkForPrevPictureButton() {

	var prevId = activePicture - 1;
	if(prevId < 0) {
		prevId = Gallery.length-1;
	}

	if(Gallery[prevId]["loaded"] == true) {
		$("#arrowLeft_btn").css("display", "block");
	} else {
		$("#arrowLeft_btn").css("display", "none");
	}
}