/**
 * class js/ZimmerGallery.js
 * @since 27.08.2011 lutz Hoffarth
 * @since 30.08.2011 Lutz Hoffarth | Maximal 5 Bilder!
 * @since 31.08.2011 Lutz Hoffarth | Timm: ohne Animation!
 */

/**
 * Konstruktor
 * @since 28.08.2011 Lutz Hoffarth
 */
function ZimmerGallery(domContainer, images, parentB_nr) {
//	debug("ZimmerGallery(" + domContainer + ", " + images + ", " + parentB_nr + ")");
	createZimmerGallery(domContainer, images, parentB_nr);

	/**
	 * @param domContainer
	 * @param images
	 * @param parentB_nr
	 * @since 27.08.2011 Lutz Hoffarth
	 * @since 30.08.2011 Lutz Hoffarth | Maximal 5 Bilder!
	 */
	function createZimmerGallery(domContainer, images, parentB_nr) {
//		debug("createZimmerGallery(" + domContainer + ", " + images + ", " + parentB_nr + ")");
		html = "<div class=\"contentZimmerGalleryFrame\">";
		html = "<div id=\"contentZimmerGalleryFrameAtuell_" + parentB_nr + "\"></div>";
		html += "	<div class=\"contentZimmerGalleryBigImages\" id=\"contentZimmerGalleryBigImages_" + parentB_nr + "\">";
		for (i in images) {
			var image = images[i];
			html += "<img class=\"contentZimmerGalleryBigImage\" id=\"contentZimmerGalleryBigImage_" + image.nr + "\" src=\"resources/images/sites/zimmer/" + image.path + "\"/>";
		}
		html += "</div><div class=\"contentZimmerGalleryNavBar\">";
		// Nur die ersten 5 Benutzen!
		var count = 0;
		for (i in images) {
			var image = images[i];
			if (++count > 5) break;
			html += "<div class=\"contentZimmerGalleryThumbs\" id=\"contentZimmerGalleryThumbs_" + image.nr + "\">";
			html += "	<div class=\"contentZimmerGalleryThumb\">";
			html += "		<img class=\"contentZimmerGalleryThumbImage\" src=\"resources/images/sites/zimmer/thumb/" + image.path + "\" width='75' heigth='55'/>";
			html += "	</div>";
			html += "	<div class=\"contentZimmerGalleryThumb\" id=\"contentZimmerGalleryThumb_" + image.nr + "\">";
			html += "		<img class=\"contentZimmerGalleryThumbImage\" src=\"resources/images/sites/zimmer/thumbInactive/" + image.path + "\" width='75' heigth='55'/>";
			html += "</div></div>";
		}
		html += "</div></div>";

		domContainer.addClass("contentZimmerGallery");
		domContainer.html(html);
		$("#contentZimmerGalleryFrameAtuell_" + parentB_nr).hide();

		initZimmerGalleryEvents(images, parentB_nr);
	}
	;

	/**
	 * @param b_nr
	 * @param parentB_nr
	 * @since 28.08.2011 Lutz Hoffarth
	 */
	function initZimmerGalleryEvents(images, parentB_nr) {
//		debug("initZimmerGalleryEvents(" + images + ", " + parentB_nr + ")");
		// Aus und Einblenden der InactiveThumbs
		var isFirst = true;
		// Nur die ersten 5 Benutzen!
		var count = 0;
		for (i in images) {
			var image = images[i];
			if (++count > 5) break;
			Preloader.preloadImage("resources/images/sites/zimmer/" + image.path);
			Preloader.preloadImage("resources/images/sites/zimmer/thumb/" + image.path);
			Preloader.preloadImage("resources/images/sites/zimmer/thumbInactive/" + image.path);
			if (isFirst) {
				$("#contentZimmerGalleryFrameAtuell_" + parentB_nr).html(image.nr); // Selection vergeben
				$("#contentZimmerGalleryThumb_" + image.nr).css("opacity", 0); //
				new Function("fxClick", "showBigImage(" + image.nr + ", " + parentB_nr + ");");
			} else {
				$("#contentZimmerGalleryBigImage_" + image.nr).css("opacity", 0);
			}
			$("#contentZimmerGalleryThumbs_" + image.nr).hover(
					new Function("hideT_" + image.nr, "mouseOver(" + image.nr + ", " + parentB_nr + ");"), 
					new Function("showT_" + image.nr, "mouseOut(" + image.nr + ", " + parentB_nr + ");")
			).click(
					new Function("clickT_" + image.nr, "clickThumb(" + image.nr + ", " + parentB_nr + "); ")
			);
			isFirst = false;
		}
	}
;

	// ----- Priviligierte Methoden?
	/**
	 * GalleryBild wechseln.
	 * @param b_nr
	 * @param parentB_nr
	 * @since 28.08.2011
	 */
	clickThumb = function(b_nr, parentB_nr) {
		//		debug("clickThumb(" + b_nr + ", " + parentB_nr + ")");
		var frame = $("#contentZimmerGalleryFrameAtuell_" + parentB_nr);
		selectedB_nr = frame.html();
		frame.html(b_nr); // Nr in HTML merken

		mouseOut(selectedB_nr, parentB_nr);
//		showGigImage(b_nr, parentB_nr);
	};

	/**
	 * @param b_nr
	 * @param parentB_nr
	 * @since 31.08.2011 Lutz Hoffarth
	 */
	showBigImage = function(b_nr, parentB_nr) {
		//		debug("showBigImage(" + b_nr + ", " + parentB_nr + ")");
		var bigContainer = $("#contentZimmerGalleryBigImages_" + parentB_nr); // Container für BigImages
		var newImg = $("#contentZimmerGalleryBigImage_" + b_nr).css({
			opacity : 1
		});
		bigContainer.append(newImg); // Neues Image ganz nach oben legen.
	};

	/**
	 * Aktiviere Thumb und Zeige Image.
	 * @param b_nr
	 * @param parentB_nr
	 * @since 28.08.2011
	 */
	mouseOver = function(b_nr, parentB_nr) {
//				debug("mouseOver(" + b_nr + ", " + parentB_nr + ")");
//		debug("hover: "+b_nr);
		$("#contentZimmerGalleryThumb_" + b_nr).css({
			opacity : 0
		});
		showBigImage(b_nr, parentB_nr);
	};
	
	/**
	 * Deaktiviere Thumb und Zeige standartImage.
	 * @param b_nr
	 * @param parentB_nr
	 * @since 28.08.2011
	 */
	mouseOut = function(b_nr, parentB_nr) {
//		debug("mouseOut(" + b_nr + ", " + parentB_nr + ")");
		selected = $("#contentZimmerGalleryFrameAtuell_" + parentB_nr).html();
		if (b_nr != selected) { // Aktuelle Auswahl nicht ausblenden.
			$("#contentZimmerGalleryThumb_" + b_nr).css({ opacity : 1 });
		}
		showBigImage(selected, parentB_nr);
	};
}

/*
<div class="contentZimmerGalleryFrame">
	<div class="contentZimmerGalleryBigImages">
		<img class="contentZimmerGalleryBigImage" src="resources/images/sites/zimmer/Image_1.png"/>
		<img class="contentZimmerGalleryBigImage" src="resources/images/sites/zimmer/Image_2.png"/>
	</div>
	<div class="contentZimmerGalleryNavBar">
		<div class="contentZimmerGalleryThumbs">
			<div class="contentZimmerGalleryThumb">
				<img class="contentZimmerGalleryThumbImage" src="resources/images/sites/zimmer/thumb/Image_1.png"/>
			</div>
			<div class="contentZimmerGalleryThumb">
				<img class="contentZimmerGalleryThumbImage" src="resources/images/sites/zimmer/thumbInactive/Image_1.png"/>
			</div>
		</div>
		<div class="contentZimmerGalleryThumbs">
			<div class="contentZimmerGalleryThumb">
				<img class="contentZimmerGalleryThumbImage" src="resources/images/sites/zimmer/thumb/Image_2.png"/>
			</div>
			<div class="contentZimmerGalleryThumb">
				<img class="contentZimmerGalleryThumbImage" src="resources/images/sites/zimmer/thumbInactive/Image_2.png"/>
			</div>
		</div>
		<div class="contentZimmerGalleryThumbs">
		</div>
		<div class="contentZimmerGalleryThumbs">
		</div>
		<div class="contentZimmerGalleryThumbs">
		</div>
	</div>
</div>
*/