Event.observe(window, 'load', showSubMenu, false);
Event.observe(window, 'resize', resizeMainImage, false);
function showSubMenu()
{
	var sh = document.getElementById('subheader');
	var ov = document.getElementById('oval_brigth');
	
	resizeMainImage();
		
	if (sh.className == 'yes')
	{			
		new Effect.BlindDown(ov.id,{
			duration:0.8,
			afterFinish:function() 
		  {			  
			  new Effect.BlindDown('subheader', { 
				  duration: 0.1,
				  delay: 0.0,
				  afterFinish:function() 
		  		{
		  			new Effect.Appear('contentOverlay', {duration:0.1});
		  			if (navigator.appName.indexOf ("Explorer")!= -1)
		  				new Effect.Appear('content', { duration:0.5 })
		  			else
		  				//new Effect.BlindDown('content', { duration:0.5 })
		  				new Effect.Appear('content', { duration:0.5 })
		  		}
				});
		  }
		});
	}
	else
	{
		new Effect.BlindDown('contentOverlay', {duration:0.1});		
	  if (navigator.appName.indexOf ("Explorer")!= -1)
			new Effect.Appear('content', { duration:0.5 })
		else
			new Effect.Appear('content', { duration:0.5 })
			//new Effect.BlindDown('content', { duration:0.5 })
	}
}

function resizeMainImage()
{
	var mainpic = document.getElementById('mainImage1');
	if (mainpic)
	{
		var size = getPageSize();
		var newSize = eval(size[3]-130);		
		mainpic.style.height = newSize + 'px';
	}
}

function showSubMenuFF()
{
	var sh = document.getElementById('subheader');
	var ov = document.getElementById('oval_brigth');
	if (sh.className == 'yes')
	{			
		new Effect.BlindDown(ov.id,{
			duration:0.8,
			afterFinish:function() 
		  {			  
			  new Effect.BlindDown('subheader', { 
				  duration: 0.1,
				  delay: 0.0,
				  afterFinish:function() 
		  		{
		  			new Effect.BlindDown('contentOverlay', {duration:0.1});
		  			new Effect.SlideDown('content', { duration:0.5 })
		  		}
				});
		  }
		});
	}
	else
	{
		new Effect.BlindDown('contentOverlay', {duration:0.1});
	  new Effect.SlideDown('content', { duration:0.5 })
	}
}

function getAbsolutePosition(element) {
    var r = { x: element.offsetLeft, y: element.offsetTop };
    if (element.offsetParent) {
    var tmp = getAbsolutePosition(element.offsetParent);
    r.x += tmp.x;
    r.y += tmp.y;
    }
    return r;
};

//
//getPageScroll()
//Returns array with x,y page scroll values.
//Core code from - quirksmode.com
//
function getPageScroll(){

     var xScroll, yScroll;

     if (self.pageYOffset) {
             yScroll = self.pageYOffset;
             xScroll = self.pageXOffset;
     } else if (document.documentElement && document.documentElement.scrollTop){         // Explorer 6 Strict
             yScroll = document.documentElement.scrollTop;
             xScroll = document.documentElement.scrollLeft;
     } else if (document.body) {// all other Explorers
             yScroll = document.body.scrollTop;
             xScroll = document.body.scrollLeft;        
     }

     arrayPageScroll = new Array(xScroll,yScroll) 
     return arrayPageScroll;
}

function getPageSize() {

        var xScroll, yScroll;

        if (window.innerHeight && window.scrollMaxY) {
                xScroll = window.innerWidth + window.scrollMaxX;
                yScroll = window.innerHeight + window.scrollMaxY;
        } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
                xScroll = document.body.scrollWidth;
                yScroll = document.body.scrollHeight;
        } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
                xScroll = document.body.offsetWidth;
                yScroll = document.body.offsetHeight;
        }

        var windowWidth, windowHeight;

//        console.log(self.innerWidth);
//        console.log(document.documentElement.clientWidth);

        if (self.innerHeight) {        // all except Explorer
                if(document.documentElement.clientWidth){
                        windowWidth = document.documentElement.clientWidth;
                } else {
                        windowWidth = self.innerWidth;
                }
                windowHeight = self.innerHeight;
        } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
                windowWidth = document.documentElement.clientWidth;
                windowHeight = document.documentElement.clientHeight;
        } else if (document.body) { // other Explorers
                windowWidth = document.body.clientWidth;
                windowHeight = document.body.clientHeight;
        }

        // for small pages with total height less then height of the viewport
        if(yScroll < windowHeight){
                pageHeight = windowHeight;
        } else {
                pageHeight = yScroll;
        }

//        console.log("xScroll " + xScroll)
//        console.log("windowWidth " + windowWidth)

        // for small pages with total width less then width of the viewport
        if(xScroll < windowWidth){
                pageWidth = xScroll;
        } else {
                pageWidth = windowWidth;
        }
//        console.log("pageWidth " + pageWidth)
        //alert(pageWidth + "\n" + pageHeight + "\n" + windowWidth + "\n" + windowHeight);
        arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
        return arrayPageSize;
}

function getObjectHeight(elm)
{
   return elm.offsetHeight;
}

function getObjectWidth(elm)
{
   return elm.offsetWidth;
}

function getWindowSize (w) {
    w = w ? w : window;
    var width = w.innerWidth || (w.document.documentElement.clientWidth || w.document.body.clientWidth);
    var height = w.innerHeight || (w.document.documentElement.clientHeight || w.document.body.clientHeight);
    return [width, height];
}

var displayImageLayer = false;
var parentDiv;
function showImage(element){

	//	Sichtbaren Divlayer verstecken
	if(displayImageLayer !== false){		
		$('image_'+displayImageLayer.id).setStyle({
			display: 'none'
		});
	}
	//	Speichern welcher Divlayer jetzt angezeigt wird 
	displayImageLayer = element;
	
	//	Die Ids der Divlayer müssen immer 'image_'+IdWoraufGeklicktWurde heißen
	id = 'image_'+element.id;
	
	//	Stelle merken an die der Layer zurückkopiert werden muss
	parentDiv = $(id);	
	document.body.appendChild($(id));
	$(id).setStyle({
		visibility:'hidden'			
	});
	$(id).setStyle({
		  display: 'inline',
		  visibility: 'visible'
	});
	
	// Breite des Divlayers an die des beinhaltenden Bildes anpassen
	var image = $(id).getElementsByTagName('img')[0];
	var divLayerWidth;
	if(image){
		divLayerWidth = image.offsetWidth;
	}
	else{
		divLayerWidth = 500;
	}
	
	$(id).setStyle({
		width: (divLayerWidth)+'px'
	});	

	//	Layer in der Mitte positionieren
	var arrayPageSize = getPageSize();
    var arrayPageScroll = getPageScroll();
    var lightboxTop = arrayPageScroll[1] + (arrayPageSize[3] / 10);
    var lightboxLeft = arrayPageScroll[0];

    
    if(lightboxLeft == 0){
    	windowSize = getWindowSize()[0];
    	//	Halbe HTML-Breite - halbe Divlayerbreite - 220
    	// -220 weil position:absolute;left:0px;top:0px; nicht die äußerst linke ecke ist, sondern die äußerst linke Ecke des Contentbereichs ??
    	lightboxLeft = (windowSize/2)- (divLayerWidth/2);
    }
    
	$(id).setStyle({
		left: lightboxLeft+'px',
		top : lightboxTop+'px'
	});

	// IE6 passt die breiten der Kindelemente nicht von selbst an
	var paragraph = $(id).getElementsByTagName('p')[1];
	if(paragraph){
		$(paragraph).setStyle({
			width: (divLayerWidth)+'px'
		});
		var table = $(id).getElementsByTagName('table')[0];
		$(table).setStyle({
			width: (divLayerWidth)+'px'
		});
	}
}


Event.observe(window, "load", function() {
	if ($('main_image_frame')) var mainImage = $('main_image_frame').getElementsByTagName('img')[0];
	if(mainImage)
	{
		var cords = $$('.cords');
		var linkUrls = $$('.link_urls');
		var hiddenImages = $$('.hidden_image');
		if(linkUrls.length > 0)
		{
			for(var i = 0; i < cords.length; i++)
			{
				$('area_map').innerHTML = $('area_map').innerHTML + '<area href="'+linkUrls[i].value+'"  coords="'+cords[i].value+'" shape="rect" id="hidden_'+i+'"/>';		
			}
		}
		if(hiddenImages.length > 0)
		{
			for(var i = 0; i < cords.length; i++){
				$('area_map').innerHTML = $('area_map').innerHTML + '<area href="javascript:void(0);" onclick="javascript:showImage(this);" coords="'+cords[i].value+'" shape="rect" id="hidden_'+i+'"/>';
				hiddenImages[i].id = 'image_hidden_'+i;		
			}
		}

		$(mainImage).useMap="#agent_workspace";
	}
});

//	Der Regenbogendivlayer soll sich dynamisch mit der Höhe anpassen, wenn sich die Bildschirmbreite ändert, 
//	damit er möglichst wenig vom content überdeckt und Links immer geklickt werden können
function getBrightOvalDivLayerHeight(){
	var arrayPageSize = getPageSize();
	var windowWidth = arrayPageSize[0];
	if(windowWidth < 900){
		return 153;
	}
	if(windowWidth < 1000){
		return 157;
	}
	if(windowWidth < 1100){
		return 159;
	}
	if(windowWidth < 1200){
		return 166;
	}
	if(windowWidth < 1300){
		return 174;
	}
	if(windowWidth < 1400){
		return 180;
	}
	if(windowWidth < 1500){
		return 186;
	}
	if(windowWidth < 1600){
		return 193;
	}
	if(windowWidth < 1700){
		return 201;
	}
	if(windowWidth < 1800){
		return 211;
	}
	if(windowWidth < 1900){
		return 221;
	}
	if(windowWidth < 2000){
		return 226;
	}
}

function resizeRainbowdivs(){
	var divLayerHeight = getBrightOvalDivLayerHeight();
	$('oval_brigth').setStyle({
		height: (divLayerHeight)+'px'
	});
	$('oval_dark').setStyle({
		height: (divLayerHeight)+'px'
	});
}

Event.observe(window, "load", function() {
	//	heller Regenbogen muss erst noch erscheinen
	window.setTimeout("resizeRainbowdivs()", 1000)
});

Event.observe(document.onresize ? document : window, "resize", function() {	
	resizeRainbowdivs();
});