var ns = (document.layers) ? true : false; 
var ie = (document.all) ? true : false;
var mz = (document.getElementById && (window.innerWidth > 0)) ? true : false; //Mozilla/Opera
if(mz) ie = false;

if (mz){
	myoffset = 0;
	document.getElementsByTagName("body")[0].style.marginLeft = myoffset+"px";
}

var menuArray = new Array();
var breitenArray = new Array();

// *******************************************************
//  Dropdown Object
// *******************************************************
function dropdown(name,offX,offY,layerWidth, bgc,hic,txtc,txts,bwidth,menueRichtung,comcolor){
	this.theName = name;
	this.offsetX = offX;
	this.offsetY = offY;
	this.dropdownWidth = layerWidth;
	this.popupCoord = offY;
	this.bgfarbe = bgc;
	this.highfarbe = hic;
	this.txtfarbe = txtc;
	this.commentfarbe = comcolor;
	this.txtsize = txts;
	this.leerwidth = bwidth;
	this.menueRichtung = menueRichtung;
	this.dataSize = eval(this.theName+'Data.length');
	
	this.expand = dropdown_expand;
	this.high = dropdown_high;
	this.unhigh = dropdown_unhigh;
	this.constuct = dropdown_constructor;
	// Other : Get the width of the Reiter, to count the width of the topPullDown Line
	breitenArray[breitenArray.length] = this.offsetY;
	this.constuct();
}

// *******************************************************
//  Objects are declared here
//  dropdown (name, Pos top, Pos left, backgroundcolor, highlightcolor, 
//  fontcolor, fontsize, buttonwidth, menueRichtung)
// *******************************************************

var modelle 			= new dropdown('modelle',130,0,120, '','E9E4E0','000000',9,74,'r');
var beratungkauf		= new dropdown('beratungkauf',130,77,150,'','E9E4E0','000000',9,150,'r');
var mobileservices		= new dropdown('mobileservices',130,233,140,'','E9E4E0','000000',9,140,'r');

// *******************************************************
//  Dropdown Popup
//  the Menu is displayed
// *******************************************************
function dropdown_expand(){
		menuCollaps();
		this.unhigh();
		if(ns)	{
			switch(this.theName)
			{
				case 'modelle': 			this.popupCoord = (document.images['mod'].x - 1); break;
				case 'beratungkauf': 		this.popupCoord = (document.images['beratung'].x - 1); break;
				
				case 'mobileservices': 		this.popupCoord = (document.images['mobile'].x - 1); break;
				
			}
			document.layers[this.theName+'Container'].visibility = "show";
			
		}
		if(ie) {
			this.popupCoord = start.offsetLeft+this.offsetY;			
			document.all[this.theName+'Container'].style.visibility = "visible";
		}
		if(mz){
			this.popupCoord = document.getElementById('start').offsetLeft+this.offsetY;			
			document.getElementById(this.theName+'Container').style.visibility = "visible";
		}
}


// *******************************************************
//  Dropdown Highlight Functions 
// ******************************************************* 
function dropdown_high(x){
	if (ns) {this.unhigh(); eval('window.document.'+this.theName+'Container.document.layers[\''+this.theName+x+'\'].bgColor = \'#'+this.highfarbe+'\''); return;}
	if (ie) {this.unhigh(); eval(this.theName+x+'.style.backgroundColor = \'#'+this.highfarbe+'\'');}
	if (mz) {this.unhigh(); document.getElementById(this.theName+x).style.backgroundColor = '#'+this.highfarbe;}	
}

function dropdown_unhigh(){
	for(i=0;i<this.dataSize;i++){
		if (ns) eval('window.document.'+this.theName+'Container.document.layers[\''+this.theName+i+'\'].bgColor = \''+this.bgfarbe+'\'');
		if (ie) eval(this.theName+i+'.style.backgroundColor = \''+this.bgfarbe+'\'');
		if (mz) document.getElementById(this.theName+i).style.backgroundColor = this.bgfarbe;
	}
}


// *******************************************************
//  Object Constructor
//  HTML Code and Styles are generated
// ******************************************************* 

function dropdown_constructor(){
	// HTML-Layers	

	this.codeString = '<div id=\"'+this.theName+'Container\" onMouseOver=\"window.clearTimeout(zu);\">\n';

	for(i=0;i<this.dataSize;i++){
		var divalign = 'align=\"left\"';	
		var classimage =  '';
		if (eval(this.theName+'Data['+i+'][1]') == ""){
			divalign = 'align=\"center\"';
			classimage =  ' class=\"backgroundcomment'+this.theName+'\" ';			
		}	
		
		
		this.codeString += '<div id=\"'+this.theName+i+'\"  '+divalign+''+classimage+' onMouseOver=\"window.clearTimeout(zu);\">';		
		this.codeString += '<a href=\"'+eval(this.theName+'Data['+i+'][1]')+'\" '+eval(this.theName+'Data['+i+'][2]')+' onMouseOver=\"'+ this.theName+'.high('+i+'); window.clearTimeout(zu);\" class="alink_menu">';
		this.codeString += '<img src=\"pics/leer.gif\" width=\"3\" height=\"10\" border=\"0\">';
		this.codeString += eval(this.theName+'Data['+i+'][0]');
		this.codeString += '</a>';
		this.codeString += '</div>\n';		
	}

	this.codeString += '</div>\n\n';

	// HTML-Styles
	// ********************************************
	this.styleString = '<style type=\"text/css\">\n';
	this.styleString += '#'+this.theName+'Container{position: absolute; top:'+this.offsetX+'px; left:'+this.offsetY+'px; width:'+this.dropdownWidth+'px; height:225px; visibility:hidden; z-index:99;';
	this.styleString += (ns)? ' layer-background-image:url(\"pics/motiv' + motiv_aktiv + '/' + this.theName + '.gif\");}\n':' background:url(\"pics/motiv' + motiv_aktiv + '/' + this.theName + '.gif\");}\n';	

	for(i=0;i<this.dataSize;i++){
		if(ns) this.styleString += '#'+this.theName+i+'{position: relative; left:1px; font-size: '+this.txtsize+'px; layer-background-color:#'+this.bgfarbe+'; z-index:5;}\n'
		if(ie) this.styleString += '#'+this.theName+i+'{position: relative; width:'+this.dropdownWidth+'px; font-size: '+this.txtsize+'px; background-color:#'+this.bgfarbe+';cursor:hand; z-index:5;}\n'
		if(mz) this.styleString += '#'+this.theName+i+'{position: relative; width:'+this.dropdownWidth+'px; left:1px; font-size: '+this.txtsize+'px; backgroundColor:#'+this.bgfarbe+';cursor:hand; z-index:5;}\n'
	}

	this.styleString += '</style>\n';
	
	// Other
	//*************************************
	menuArray[menuArray.length] = this.theName;
	document.writeln(this.styleString);
	document.writeln(this.codeString);
	
	if(ns){
		eval('window.document.layers[\''+this.theName+'Container\'].captureEvents(Event.MOUSEOUT|Event.MOUSEMOVE)');
		eval('window.document.layers[\''+this.theName+'Container\'].onMouseOut = dropdown_mouseLeave');
	}
	if(ie) eval('document.all[\''+this.theName+'Container\'].onmouseout = dropdown_mouseLeave;');
	if(mz) eval("document.getElementById('"+this.theName+"Container').onmouseout = dropdown_mouseLeave");
}


// **********************************************************************
var zu;
function dropdown_mouseEnter() {window.clearTimeout(zu)}
function dropdown_mouseLeave() {zu = window.setTimeout('menuCollaps()',50);}

function menuCollaps(){
	for(i=0;i < menuArray.length; i++){
		if(ns){eval('document.layers[\''+menuArray[i]+'Container\'].visibility = "hide"');}
		if(ie){eval('document.all[\''+menuArray[i]+'Container\'].style.visibility = "hidden"');}
		if(mz){document.getElementById(menuArray[i]+'Container').style.visibility = "hidden";}
		unhighlightHeadMenu();
		window.clearTimeout(zu);
	}
}	
	
// **********************************************************************

mod00 = new Image(); 		mod00.src = "pics/menu_top/modelle_f.gif";					mod01 = new Image(); 		mod01.src = "pics/menu_top/modelle_n.gif";		
beratung00 = new Image(); 	beratung00.src = "pics/menu_top/beratungkauf_f.gif";		beratung01 = new Image(); 	beratung01.src = "pics/menu_top/beratungkauf_n.gif";		
mobile00 = new Image(); 	mobile00.src = "pics/menu_top/mobileservices_f.gif";		mobile01 = new Image(); 	mobile01.src = "pics/menu_top/mobileservices_n.gif";		

function highlightHeadMenu(which){
		unhighlightHeadMenu();
		document.images[which].src = eval(which+'01.src');		
}

function unhighlightHeadMenu(){
		document.images["mod"].src = mod00.src;
		document.images["beratung"].src = beratung00.src;
		document.images["mobile"].src = mobile00.src;

}