var headerArray;
var changeContentRight = false;
var animationSpeed = 600;
$(document).ready(function(){
   elements = $('div.menu2dropdown');
   elements.each(function() { 
		//$(this).css("top", -$(this).height());
		$(this).css("height", $(this).height());
		$(this).find("ul").css("height", 0);
	});
   
   elements = $('div.menu2');
   elements.each(function() { 
		$(this).css("display", "none");
		$(this).css("opacity", 0);
	});
   
   
   var menu3 = document.getElementById("menu3");
   var menu3ul = $(menu3).find("ul");
   
   // hide header images
   var header = document.getElementById("header");
   elements = $(header).find('.csc-textpic-image');
   var counter = 1;
   elements.each(function() {
		if(counter==1) {
			$(this).css("display", "");
			$(this).css("opacity", 1);
		} else {
			$(this).css("display", "none");
			$(this).css("opacity", 0);
		}
		$(this).attr("id","headerImage"+counter);
		
		if($(elements).size()>1) {
			// create menu3
			var caption = $(this).find(".csc-textpic-caption").html();
			//menu3p = document.createElement('li');
			//menu3p.setAttribute('class','');
			if(caption.length==0) {
				caption = "Bild "+counter;	
			}
			var menu3p;
			if(counter==1) {
				menu3p = '<li id="menu3li_'+counter+'" class="active"><a href="" onClick="showHeaderImage(\'headerImage'+counter+'\');return false;">'+caption+'</a></li>';
			} else {
				menu3p = '<li id="menu3li_'+counter+'"><a href="" onClick="showHeaderImage(\'headerImage'+counter+'\');return false;">'+caption+'</a></li>';	
			}
			$(menu3ul).append(menu3p);
		}
		counter++;
	});
   
   
   
   	// create Header ZoomImage-List
   	var headerZoom = document.getElementById("headerImageZoom");
   	elements = $(headerZoom).find('.csc-uploads-fileName');
   	counter = 1;
	headerArray = new Array(elements.length);
	elements.each(function() {
		var imageLink = $(this).find("a").attr("href");
		var imageDescription = $(this).find(".csc-uploads-description").html();
		var listItem = new Array(2);
		listItem[0] = imageLink;
		listItem[1] = imageDescription;
		headerArray[counter-1] = listItem;
		counter++;
	});
	if(counter>1) {
		var lupe = '<li><a href="javascript:zoomHeaderImage(0);" id="lupe" class="zoomBtn"><img src="fileadmin/templates/ebios_fire/img/lupe.png" width="15" height="13" border="0" /></a></li>';
		$(menu3ul).append(lupe);
	}
	$(headerZoom).remove();
	
	   
	// find contentRight images
   	var contentRight = document.getElementById("contentRight");
   	elements = $(contentRight).find('.csc-textpic-imagewrap');
   	counter = 1;
	if(elements.length==headerArray.length) {
		elements.each(function() {
			$(this).attr("id","contentRightImage"+counter);
			if(counter>1) {
				$(this).css("display", "none");
				//$(this).css("opacity", 0);
			}
			counter++;
		});
		changeContentRight = true;
	}
	
	
});

function zoomHeaderImage(cur) {
	jQuery.slimbox(headerArray, cur, {loop: true, counterText: "Bild {x} von {y}"});	
}

function showHeaderImage(headerImage) {
	// hide header images
   var showImage = document.getElementById(headerImage);
   var header = document.getElementById("header");
   var lupe = document.getElementById("lupe");
   elements = $(header).find('.csc-textpic-image');
   var counter = 1;
   elements.each(function() {
		var menu3p = document.getElementById("menu3li_"+counter);
		var contentRightImage = document.getElementById("contentRightImage"+counter);
		if(this == showImage) {
			$(this).css("display", "");
			//$(this).css("opacity", 1);
			$(this).stop().animate({
				opacity: 1
			}, 'slow');
			$(menu3p).attr("class", "active");
			$(lupe).attr("href", "javascript:zoomHeaderImage("+(counter-1)+")");
			
			// ContentRightImage
			if(changeContentRight) {
				$(contentRightImage).css("display", "");
				/*$(contentRightImage).stop().animate({
					opacity: 1
				}, 'slow');*/
			}
			
		} else {
			//$(this).css("display", "none");
			//$(this).css("opacity", 0);
			$(this).stop().animate({
				opacity: 0.0
			}, {
				duration: 'slow', 
				complete: function() {
					this.style.display = 'none';
				}
			});
			$(menu3p).attr("class", "");
			
			// ContentRightImage
			if(changeContentRight) {
				$(contentRightImage).css("display", "none");
				/*$(contentRightImage).stop().animate({
					opacity: 0.0
				}, {
					duration: 50, 
					complete: function() {
						this.style.display = 'none';
					}
				});*/
			}
		}
		counter++;
	});
}