/**
 * @since 12.05.2011
 * @auther Lutz Hoffarth
 */

var runC = false;
var oldIdCenter = "1";

/**
 * Animationsparameter für Content- und Center-Bereich
 */
var animation = new Animation(Animation.EASING_EFFECT_EXPO, Animation.EASING_LOCATION_OUT, 1000);

/**
 * @since 11.04.2011 Flexibler Bidbereich
 */
var centerImagePath = "images/center/";

/** @since 11.04.2011 */
var centerSlidePaused = false;
/** @since 11.04.2011 */
var centerAutoSlide = true;
/** @since 11.04.2011 */
var centerAutoSlideInterval = 5000;
/** @since 12.05.2011 */
var centerAutoSlideWait = 5000;

/**
 * Vergrößert und/oder Zentriert je nach min-Größe des Bildes innerhalb des HTML-Elements mit der id='contentCenterImage'.<p>
 * Das HTML-Element mit der id='container' nimmt die Gesamtgröße des Browsers ein.<br>
 * Der Center-Bereich mit der id='contentCenter' nimmt die Größe des 'container' abzüglich des South-Bereichs ein.<br>
 * Der Bereich mit der id='contentCenterImage' nimmt mindestens die Größe des Bildes ein. Ist dieser größer wird das Bild vergrößert.
 * <pre>
 * &lt;!-- MinnimalCode: --&gt;
 * &lt;div id="container" style="position: relative; "&gt;
 *   &lt;div id="contentCenter" style="overflow: hidden; position: absolute; top: 0px; z-index: 10;"&gt;
 *     &lt;div id="contentCenterImage" style="overflow: hidden; position: absolute; "&gt;
 *       &lt;img class="image_view" src="..." style="display: inline; width: 100%; height: 100%" /&gt;
 *     &lt;/div&gt;
 *   &lt;/div&gt;
 * &lt;/div&gt;
 * </pre>
 * <!-- MinnimalCode: -->
 * <div id="container" style="position: relative; background-color: #EEEEEE; ">
 *		<div id="contentCenter" style="overflow: hidden; position: absolute; top: 0px; z-index: 10; ">
 *			<div id="contentCenterImage" style="overflow: hidden; position: absolute; ">
 *				<img class="image_view" src="..." style="display: inline; width: 100%; height: 100%" />
 *			</div>
 *		</div>
 * </div>
 * @param minImgWidth Mindestbreite des Center-Bildes.
 * @param minImgHeight Mindesthöhe des Center-Bildes.
 * @param minSouthHeight Minimalhöhe des South-Bereichs.
 * @version 12.03.2011 nicht kleiner als Contentbereich. Absprache vom 11.03.2011
 * @version 08.03.2011
 * @version 26.02.2011
 * @version 12.05.2011 Umbau
 */
function setContentSize(minImgWidth, minImgHeight) {
	var wiw = getBrowserWidth();
	var wih = getBrowserHeight();
	if (wiw < minImgWidth) wiw = minImgWidth;
	if (wih < minImgHeight) wih = minImgHeight;
	var scrollLeft = $(window).scrollLeft();

	// nicht schmaler als vorgesehen.
	var imgw = wiw;
	if (imgw < minImgWidth) imgw = minImgWidth;

	// nicht niedriger als vorgesehen.
	var imgh = wih;
	if (imgh < minImgHeight) imgh = minImgHeight;

	// Seitenverhältnis bewahren
	var imgOrigVerh = minImgWidth / minImgHeight;
	var imgVerh = imgw / imgh;
	if (imgVerh > imgOrigVerh) { // breiter als original
		imgh = Math.floor(imgw / imgOrigVerh); // Höhe an die Breite anpassen
	} else if (imgVerh < imgOrigVerh) { // schmaler als original
		imgw = Math.floor(imgh * imgOrigVerh); // Breite an die Höhe anpassen
	}

	// Überstand berechnen
	var imgLeft = Math.floor((wiw - imgw) / 2);
	var imgTop = Math.floor((wih - imgh) / 2);

	//	var scrollLeft = $(window).scrollLeft();
	if (scrollLeft > 0 && scrollLeft + wiw > minImgWidth) scrollLeft = minImgWidth - wiw; // Verhindert, dass der Bereich nicht weiter scrollbar ist als nötig

	$("#contentCenter").css("width", wiw).css("height", wih).css("left", scrollLeft);
	$("#contentCenterImage").css("width", imgw).css("height", imgh).css("left", imgLeft).css("top", imgTop);

	$("#container").css("width", wiw).css("height", wih);
}

/**
 * @since 08.04.2011 // funktioniert leider nicht.
 * @version 12.04.2011 // neuer Versuch
 * @param centerIds
 */
function preloadCenterImages(path, centerIds) {
	if (jQuery.type(centerIds) === "string") {
		var preload = $('<img />').attr('src', path + "MariaRosas_" + i + ".jpg"); // 12.04.2011
		$("#preload").append(preload); // 12.04.2011
	} else if (jQuery.type(centerIds) === "array") {
		var preloads = new Array();
		for (i = 0; i < centerIds.length; i++) {
			preloads[i] = $('<img />').attr('src', path + "MariaRosas_" + centerIds[i] + ".jpg"); // 12.04.2011
			preloads[i].load(function() {
				$("#preload").append($(this)); // 12.04.2011
			});
		}
	}
};

/**
 * @since 08.04.2011
 * @since 12.05.2011
 */
function pauseCenterAutoSlide() {
	centerSlidePaused = true;
//	setTimeout(function() {
//		// Nach ablauf der Pause.
//		centerSlidePaused = false;
//		slideCenterToLeft(centerIds); // Slide ausführen
//		runCenterAutoSlide(); // Weitermachen
//	}, centerAutoSlideWait);
}

/**
 * @since 08.04.2011
 * @since 12.05.2011
 */
function runCenterAutoSlide() {
	centerSlidePaused = false;
	// Vor start der Pause zum Weitersliden des Centers
	if (!centerSlidePaused) {
		setTimeout(function() {
			// Nach ablauf der Pause.
			if (!centerSlidePaused) {
				slideCenterToLeft(centerIds); // Slide ausführen
				runCenterAutoSlide(); // Weitermachen
			}
		}, centerAutoSlideInterval);
	};
};

/**
 * Lässt den neuen Center-Bereich von links nach rechts einlaufen.
 * @param contentIds string/Array
 * @version 12.03.2011
 */
//function slideCenterToRight(contentIds) {
function slideCenterToRight() {
	if (runC) return;
	deaktivateCenterButtons();
	//	nextId = getNextElement(contentIds, true, oldIdCenter);
	nextId = getNextElement(centerIds, true, oldIdCenter);
	slideCenterTo(nextId, true);
};

/**
 * Lässt den neuen Center-Bereich von rechts nach links einlaufen.
 * @param contentIds string/Array
 * @version 12.03.2011
 */
//function slideCenterToLeft(contentIds) {
function slideCenterToLeft() {
	if (runC) return;
	deaktivateCenterButtons();
	nextId = getNextElement(centerIds, false, oldIdCenter);
	slideCenterTo(nextId, false);
};

/**
 * Der animierte Austausch der Center-Bilder erfolgt per horizontalen Scroll von
 * rechts nach links.
 * <p>
 * der Aufbau ist nach
 * {@see contentCenterSize(centerMinWidth, centerMinHeight, southMinHeight)} zu
 * erfolgen.
 * 
 * @param contentId
 *          Bild im Pfad 'images/content/' mit der Endung '.png' das von rechts
 *          eingeschoben werden soll.
 * @param right
 *          Wenn true, dann erfolgt ein Slide nach rechts.
 * @version 06.03.2011
 */
function slideCenterTo(contentId, right) {
	//	alert("Pfad("+centerImagePath+") FotoId("+contentId+")");
	if (contentId == oldIdCenter) {
		aktivateCenterButtons();
		return;
	}

	// Neues Bild erzeugen.
	var imagePath = centerImagePath + "MariaRosas_" + contentId + ".jpg";
	var image = "<img class=\"image_view\" style=\"display: inline; width: " + navi_inner_width + "; height: 100%;\" src=\"" + imagePath + "\">";

	// Richtung festlegen.
	if (right) {
		var oldPos = "right";
		var newPos = "left";
	} else {
		var oldPos = "left";
		var newPos = "right";
	}

	// Bisherigen Bildträger ermitteln
	var old_inner = $(".image_inner");
	if (old_inner == null) return;
	var navi_inner_width = old_inner.css("width");

	// Bisherigem Bildträger bewegungsstyle zuweisen
	old_inner.removeClass("image_inner").addClass("image_inner_" + oldPos).css("width", navi_inner_width);

	if (jQuery.type(image) === "string") {
		// Neuen Bildträger erstellen und Bild einbinden.
		var new_inner = "<div class=\"image_inner_" + newPos + "\">" + image + "</div>";
		// Neue Box erstellen und Bildträger mit Bild einbinden.
		var new_box = "<div class=\"image_box_" + newPos + "\" >" + new_inner + "</div>";
	} else {
		// Neuen Bildträger erstellen und Bild einbinden.
		//		var new_inner = "<div class=\"image_inner_" + newPos + "\">" + image + "</div>";		
		var new_inner = document.createElement("div");
		new_inner.setAttribute("class", "image_inner_" + newPos);
		new_inner.appendChild(image);
		// Neue Box erstellen und Bildträger mit Bild einbinden.
		//		var new_box = "<div class=\"image_box_" + newPos + "\" >" + new_inner + "</div>";
		var new_box = document.createElement("div");
		new_box.setAttribute("class", "image_box_" + newPos);
		new_box.appendChild(new_inner);
	}

	// Bisherige Box ermitteln
	var old_box = $(".image_box");
	if (old_box == null) return;
	// Bisheriger Box bewegungsstyle zuweisen
	old_box.removeClass("image_box").addClass("image_box_" + oldPos).css("width", "100%");

	// new_box am (ende Bzw.: right==true->anfang) des image_wrappers einfügen.
	if (right)
		$("#image_wrapper").prepend(new_box);
	else
		$("#image_wrapper").append(new_box);

	// Neue Box holen
	new_box = $(".image_box_" + newPos);
	//	$("#testW").html("Width:" + new_box.css("width") + " - " + navi_inner_width);
	new_inner = $(".image_inner_" + newPos).css("width", navi_inner_width);

	// Animation
	new_box.animate({
		width : navi_inner_width
	}, animation.getSpeed(), animation.getEasing(), function() {
		new_inner.removeClass("image_inner_" + newPos).addClass("image_inner").css("width", "100%");
		new_box.removeClass("image_box_" + newPos).addClass("image_box").css("width", "100%");
		$(".image_view").css("width", "100%");

		old_box.remove();
		oldIdCenter = contentId;

		aktivateCenterButtons();
	});

	old_box.animate({
		width : "0px"
	}, animation.getSpeed(), animation.getEasing());

	fadeCenterMessage(contentId);

	// Klick auch auf den neu erzeugten Button legen!
	$(".image_view_video").click(function() {
		showVideoBox(true);
	});
};

/**
 * @since 08.04.2011
 * @param contentId
 */
function fadeCenterMessage(contentId) {
	//	alert("fade:"+contentId);
	if ($("#centerImageMessage_" + contentId).hasClass("centerImageMessage")) return; // Text wird bereits angezeigt!
	var oldBox = $(".centerImageMessage").css("opacity", 1);
	var newBox = $("#centerImageMessage_" + contentId).css("display", "inline");
	newBox.css("opacity", 0);
	oldBox.animate({
		opacity : 0
	}, animation.getSpeed(), animation.getEasing(), function() {
		oldBox.css("display", "none");
		oldBox.removeClass("centerImageMessage").addClass("centerImageMessageWait");

		newBox.removeClass("centerImageMessageWait").addClass("centerImageMessage").css("opacity", 1);
	});
};

/**
 * @param contentIds
 * @param direction Richtung left = false; right = true;
 * @since 04.04.2011
 */
function getNextElement(contentIds, direction, oldId) {
	if (jQuery.type(contentIds) === "string")
		return contentIds;
	else if (jQuery.type(contentIds) === "array") {
		for (i = 0; i < contentIds.length; i++) {
			if (contentIds[i] == oldId) {
				var naechteId = 0;
				if (direction == true) {
					if (i > 0)
						naechsteId = contentIds[i - 1]; // Vorheriger Eintrag
					else
						naechsteId = contentIds[contentIds.length - 1]; // Letzter Eintrag
				} else {
					if (i < contentIds.length - 1)
						naechsteId = contentIds[i + 1]; // Nächster Eintrag
					else
						naechsteId = contentIds[0]; // Erster Eintrag
				}
				return naechsteId;
			}
		}
		// nicht im Bereich -> an den Anfang.
		return contentIds[1];
	}
};

/**
 * Wird nach dem Beenden der Animation intern aufgerufen.
 * 
 * @version 17.03.2011
 */
function deaktivateCenterButtons() {
	runC = true;
	$(".img_ecke_right_top").css("cursor", "wait");
	$(".img_ecke_left_bottom").css("cursor", "wait");
};
/**
 * Wird vor dem Starten der Animation intern aufgerufen.
 * @version 17.03.2011
 */
function aktivateCenterButtons() {
	runC = false;
	$(".img_ecke_right_top").css("cursor", "pointer");
	$(".img_ecke_left_bottom").css("cursor", "pointer");
};

/**
 * @version 08.03.2011
 * @returns int
 */
function getBrowserWidth() {
	return window.innerWidth || (window.document.documentElement.clientWidth || window.document.body.clientWidth);
};
/**
 * @version 08.03.2011
 * @returns int
 */
function getBrowserHeight() {
	return window.innerHeight || (window.document.documentElement.clientHeight || window.document.body.clientHeight);
};