var Navigation = new Class({
	getOptions: function(){
		return {
			initialHeight: 23,
			animationSpeed: 500,
			hideBreadcrumbDelay: 150
		};

	},
	
	initialize: function(_id, _ulClassName){
		this._id = _id;
		this._startHeight = $(this._id).offsetHeight;
		this._openSubNav = new Array();
		this.setMouseEvents();
		
		var subNavBG = new Fx.Morph('subNav1Background',
			{
				duration: this.getOptions().animationSpeed
			}
		);
		
		subNavBG = new Fx.Morph('subNav2Background',
			{
				duration: this.getOptions().animationSpeed
			}
		);
		
		this.mainNavEffect = new Fx.Morph(this._id,
			{
				duration: this.getOptions().animationSpeed
			}
		);
	},

	// v2
	setMouseEvents: function(){
		var animationSpeed = this.getOptions().animationSpeed;
		var navigation = $('navi_wrapper');
		var children = navigation.getChildren('div');
		var numChildren = children.length;
		var homeButton = children[0];
		var homeAnchor = homeButton.getChildren('a')[0];
		homeAnchor.addEvent('mouseenter', this.showHomeNavTree.bind(this));
		var child;
		var list;
		var listElements;
		var numListElements;
		var listMorph;
		var listEntry;
		var anchor;
		for(var i=0;i<numChildren-1;i++){
			child = children[i+1];
			if(child.id != 'subNav1Background' && child.id != 'subNav2Background'){
				list = child.getChildren('ul')[0];
				listElements = list.getChildren('li');
				numListElements = listElements.length;
				if(child.id != 'breadcrumb'){
					listMorph = new Fx.Morph(list.id,
						{
							duration: animationSpeed,
							link: 'cancel',
							transition: 'quint:out'
						}
					);
					list.addEvent('mouseleave', this.resetBackground.bind(list));
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						listEntryMorph = new Fx.Morph(listEntry.id,
							{
								duration: animationSpeed,
								link: 'cancel'
							}
						);
						// listEntry.addEvent('mouseenter', this.moveBackground.bind(listEntry, j));
						anchor = listEntry.getChildren('a')[0];
						anchor.addEvent('mouseenter', this.moveBackground.bind(listEntry, j));
						anchor.addEvent('mouseleave', this.closeTimer.bind(this));
						anchor.addEvent('mouseenter', this.resetTimer.bind(this));
						if($('subNav'+anchor.rel)){
							//anchor.addEvent('mouseenter', this.showSubNavi.bind(this, anchor.rel));
							anchor.addEvent('mouseenter', this.moveBackground.bind(listEntry, j));
						//	anchor.addEvent('mouseenter', this.closeSubNavi.bind(this, anchor)); // öffnet subNavi anschließend, wenn vorhanden
						//	anchor.addEvent('click', this.setBreadcrumb.bind(this, anchor.rel));
							// anchor.addEvent('click', this.highlightSubNavi.bind(listElements, listEntry));
						}else{
						//	anchor.addEvent('mouseenter', this.closeSubNavi.bind(this, anchor));
						//	anchor.addEvent('click', this.setBreadcrumb.bind(this, anchor.rel));							
						}
						anchor.addEvent('mouseenter', this.closeSubNavi.bind(this, anchor));
						//if(anchor.get('rel') != '168'){ // Ausnahme für die id 168, 15.12.2010
							anchor.addEvent('click', this.setBreadcrumb.bind(this, anchor.rel));
						//}else{
						//	anchor.addEvent('click', function(){ return false; });
						//}
					}
				}else{
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						anchor = listEntry.getChildren('a')[0];
						if(anchor){
							anchor.addEvent('mouseenter', this.showHomeNavTree.bind(this));
						}
					}	
				}
			}
		}
	},
	// v2
	moveBackground: function(position){
		var list;
		var backgroundPosition;
		list = this.getParent('ul');
		backgroundPosition = '0px '+(position*23)+'px';
		list.set('morph', {duration: 200, link: 'cancel'});
		list.get('morph').start({ 'background-position': backgroundPosition });
	},
	// v2
	resetBackground: function(){
		var backgroundPosition;
		backgroundPosition = '0px -23px';
		this.get('morph').start({ 'background-position': backgroundPosition });
	},
	
	closeTimer: function(){
		var fx = function(){
			this.closeHomeNavTree();
		}

		this._closeTimer = fx.bind(this).delay(2000);
	},
	
	resetTimer: function(){
		clearTimeout(this._closeTimer);
	},
	
	highlightSubNavi: function(clickedElement){
		var numListElements = this.length;
		var listEntry;
		var anchor;
		for(var i=0;i<numListElements;i++){
			listEntry = this[i];
			if(listEntry.id != clickedElement.id){
				listEntry.className = '';
				anchor = listEntry.getChildren('a')[0];
				anchor.className = '';
			}else{
				// listEntry.className = 'aktiv';
				anchor = listEntry.getChildren('a')[0];
				anchor.className = 'aktiv';	
			}
		}
	},

	showMainNavi: function(){
		var newHeight;
		var listElements;
		var numListElements;
		var listEntry;
		
		listElements = $('mainnav').getChildren('ul')[0].getChildren('li');
		numListElements = listElements.length;
		newHeight = this.getOptions().initialHeight * numListElements + 10;
		for(var i=0;i<numListElements;i++){
			listEntry = listElements[i];
			if(listEntry.className.indexOf('aktiv') > -1){
				listEntry.getChildren('a')[0].style.visibility = 'visible';
			}
			listEntry.get('morph').start({ 'height': 23, 'opacity': [1,1] }).chain(
				function(){
					// this.start({ 'opacity': [1,1] });
					// listEntry.style.overflow = 'visible';
				}
			);
		}
		var startHeight = this.getOptions().initialHeight * numListElements + 10;
		var bgHeight = startHeight-200;
		var newBgPos = '0px '+bgHeight+'px';
		this.mainNavEffect.start(
			{
				'height': [32,newHeight], 'background-position': ['0px 32px',newBgPos]
			}
		);

		var hideBreadcrumb = function(){
			$('breadcrumbItem_0').style.visibility = 'hidden';
			$('breadcrumb').style.display = 'none';
		}
		hideBreadcrumb.delay(this.getOptions().hideBreadcrumbDelay);
		
		return false;
	},

	showSubNavi: function(eRel){
		var newSubNavs;
		var subNavs;
		var animationSpeed;
		var startHeight;
		var hideBreadcrumbDelay;
		var endHeight;
		var closeRest;
		var navLayer;
		var list;
		var listElements;
		var numListElements;
		var listEntry;
		var newBgPos;
		var className;
		var navIndex;
		var breadcrumbItem;
		var bgHeight;
		var bgImage;
		if($('subNav'+eRel)){
			// subNav
			newSubNavs = new Array();
			subNavs = this._openSubNav;

			animationSpeed = this.getOptions().animationSpeed;
			startHeight = this.getOptions().initialHeight;
			hideBreadcrumbDelay = this.getOptions().hideBreadcrumbDelay;
			endHeight = this.getOptions().initialHeight * $('subNav'+eRel).getElementsByTagName('li').length + 10;

			this.subNavEffect = new Fx.Morph('subNav'+eRel,
				{
					duration: animationSpeed,
					onStart: function(){
						className = $('subNav'+eRel).className;
						navIndex = className.substring(className.length-1);
						breadcrumbItem = 'breadcrumbItem_' + navIndex;
					
						bgHeight = endHeight-200;
						newBgPos = '0px '+bgHeight+'px';
						var hideBreadcrumb = function(){
							$(breadcrumbItem).style.visibility = 'hidden';
						}
						hideBreadcrumb.delay(hideBreadcrumbDelay);
						navLayer = $('subNav'+eRel);
						if(className == 'subNav1'){
							bgImage = $('subNav1Background');
						}
						if(className == 'subNav2'){
							bgImage = $('subNav2Background');
						}
						// bgImage = 'url(../pics/'+bgImage+')';
						list = navLayer.getChildren('ul')[0];
						listElements = list.getChildren('li');
						numListElements = listElements.length;
					
						navLayer.style.backgroundImage = 'url(../pics/'+bgImage+')';
					
						for(var i=0;i<numListElements;i++){
							listEntry = listElements[i];
							listEntry.get('morph').start( { 'height':startHeight } ).chain(
								function(){
									this.start( {'opacity': 1} );
								}
							);
						}
						if(className != ''){
							var currentBgPosition = bgImage.style.backgroundPosition;
							if(currentBgPosition == ''){
								bgImage.style.backgroundPosition = '0px -200px';
							}
							bgImage.get('morph').start({ 'height': endHeight, 'background-position': newBgPos });
						}
						navLayer.get('morph').start({ 'height': endHeight, 'opacity': 1 });
					}
				}
			);

			this.subNavEffect.start({ });
			
			// this._openSubNav = newSubNavs;
			if($('subNav'+eRel).className == 'subNav1'){
				this._openSubNav[0] = eRel;
			}
			if($('subNav'+eRel).className == 'subNav2'){
				this._openSubNav[1] = eRel;
				var parentDiv = $('navItem_'+eRel).getParents('div')[0];
				this._openSubNav[0] = parentDiv.id.substr(6);
			}
			if($('subNav'+eRel).className == 'subNav3'){
				this._openSubNav[2] = eRel;
			}
		}
		return false;
	},
	
	closeSubNavi: function(hoveredAnchor){
		var navLayer;
		var list;
		var listElements;
		var listEntry;
		var newBgPos;
		var numListElements;
		var startHeight = this.getOptions().initialHeight;
		var subNavs = this._openSubNav;
		var numSubNavs = subNavs.length;
		var parentLevel = hoveredAnchor.getParent('div').className;
		if(parentLevel == 'subNav1' && $('subNav'+subNavs[1])){ //  && subNavs[1] != hoveredAnchor.rel
			var listEntry;
			var newBgPos;
			navLayer = $('subNav'+subNavs[1]);
			list = navLayer.getChildren('ul')[0];
			listElements = list.getChildren('li');
			numListElements = listElements.length;
			for(var j=0;j<numListElements;j++){
				listEntry = listElements[j];
				listEntry.get('morph').start( { 'height':startHeight, 'opacity': 0  } ).chain(
					function(){
						this.start( {'opacity': 1} );
					}
				);
			}
			newBgPos = '0px -168px';
			if(navLayer.className == 'subNav1'){
				$('subNav1Background').get('morph').start({ 'height': 0, 'background-position': newBgPos });
			}
			if(navLayer.className == 'subNav2'){
				$('subNav2Background').get('morph').start({ 'height': 0, 'background-position': newBgPos });
			}
			navLayer.get('morph').start({ 'height': 0, 'opacity': 0 });
			//this._openSubNav[0] = hoveredAnchor.rel;
		}
		if(parentLevel == ''){
			var navDiv;
			var navDivs = $('navi_wrapper').getChildren('div');
			var numNavDivs = navDivs.length;
			for(var i=0;i<numNavDivs;i++){
				navDiv = navDivs[i];
				if(navDiv.className == 'subNav1'){ //  && navDiv.id != 'subNav'+hoveredAnchor.rel
					navLayer = navDiv;
					list = navLayer.getChildren('ul')[0];
					listElements = list.getChildren('li');
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						listEntry.set('morph',{ link: 'chain'});
						listEntry.get('morph').start( { 'height':startHeight } ).chain(
							function(){
								this.start( {'opacity': 1} );
							}
						);
					}
					newBgPos = '0px -168px';
					if(navLayer.className == 'subNav1'){
						$('subNav1Background').get('morph').start({ 'height': 0, 'background-position': newBgPos });
					}
					if(navLayer.className == 'subNav2'){
						$('subNav2Background').get('morph').start({ 'height': 0, 'background-position': newBgPos });
					}
					navLayer.get('morph').start({ 'height': 0, 'opacity': 0 }).chain(
						function(){
							this.start({ 'opacity': [1,1] });
						}
					);
				}
				if(navDiv.className == 'subNav2' && navDiv.id != 'subNav'+hoveredAnchor.rel){
					navLayer = navDiv;
					list = navLayer.getChildren('ul')[0];
					listElements = list.getChildren('li');
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						listEntry.set('morph',{ link: 'chain'});
						listEntry.get('morph').start( { 'height':startHeight } ).chain(
							function(){
								this.start( {'opacity': 1} );
							}
						);
					}
					newBgPos = '0px -168px';
					if(navLayer.className == 'subNav1'){
						$('subNav1Background').get('morph').start({ 'height': 0, 'background-position': newBgPos });
					}
					if(navLayer.className == 'subNav2'){
						$('subNav2Background').get('morph').start({ 'height': 0, 'background-position': newBgPos });
					}
					navLayer.get('morph').start({ 'height': 0, 'opacity': 0 }).chain(
						function(){
							this.start({ 'opacity': [1,1] });
						}
					);
				}
			}
		}
		this.showSubNavi.bind(this, hoveredAnchor.rel).delay(0);
		return false;
	},

	showNavTree: function(){
		var subNavs = new Array();
		this.showMainNavi();
		breadcrumbElements = $('breadcrumb').getElementsByTagName('li');
		for(var i=0;i<breadcrumbElements.length;i++){
			element = breadcrumbElements[i].getElementsByTagName('a')[0];
			if(element){
				navLayer = $('subNav'+element.rel);
				if(navLayer){
					list = navLayer.getChildren('ul')[0];
					listElements = list.getChildren('li');
					numListElements = listElements.length;
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						if(listEntry.className.indexOf('aktiv') > -1){
							listEntry.getChildren('a')[0].style.visibility = 'visible';
						}
						listEntry.get('morph').start( { 'height': this.getOptions().initialHeight } ).chain(
							function(){
								this.start( {'opacity': 1} );
							}
						);
					}
					subNavs[i] = element.rel;
					startHeight = this.getOptions().initialHeight * $('subNav'+element.rel).getElementsByTagName('li').length + 10;
					bgHeight = startHeight-200;
					newBgPos = '0px '+bgHeight+'px';
					
					if(navLayer.className == 'subNav1'){
						$('subNav1Background').get('morph').start({ 'height': [32,startHeight], 'background-position': newBgPos });
					}
					if(navLayer.className == 'subNav2'){
						$('subNav2Background').get('morph').start({ 'height': [32,startHeight], 'background-position': newBgPos });
					}
					
					navLayer.get('morph').start({ 'height': [32,startHeight] });
				}

				element.style.visibility = 'hidden';
			}
		}
		this._openSubNav = subNavs;
		return false;
	},
	
	showHomeNavTree: function(){
		animQuickFinder(29);
		var navigation = $('navi_wrapper');
		children = navigation.getChildren('div');
		numChildren = children.length;
		var homeButton = children[0];
		var homeAnchor = homeButton.getChildren('a')[0];
		homeAnchor.removeEvents('mouseenter');
		homeAnchor.addEvent('click', this.closeHomeNavTree.bind(this, homeAnchor.rel));

		var startHeight;
		var bgHeight;
		var newBgPos;
		
		var subNavs = new Array();
		var navLayer;

		this.showMainNavi();
		var breadcrumbElements = $('breadcrumb').getElementsByTagName('li');
		for(var i=0;i<breadcrumbElements.length;i++){
			element = breadcrumbElements[i].getElementsByTagName('a')[0];
			if(element){
				navLayer = $('subNav'+element.rel);
				if(navLayer){
					list = navLayer.getChildren('ul')[0];
					listElements = list.getChildren('li');
					numListElements = listElements.length;
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						if(listEntry.className.indexOf('aktiv') > -1){
							listEntry.getChildren('a')[0].style.visibility = 'visible';
						}
						var curHeight = listEntry.getSize().y;
						listEntry.get('morph').start( { 'height': [curHeight,this.getOptions().initialHeight] } ).chain(
							function(){
								this.start( {'opacity': [1,1]} );
							}
						);
					}
					subNavs[i] = element.rel;
					startHeight = this.getOptions().initialHeight * numListElements + 10;
					bgHeight = startHeight-200;
					newBgPos = '0px '+bgHeight+'px';
					
					if(navLayer.className == 'subNav1'){
						$('subNav1Background').get('morph').start({ 'height': [32,startHeight], 'background-position': ['0px 32px', newBgPos] });
					}
					if(navLayer.className == 'subNav2'){
						$('subNav2Background').get('morph').start({ 'height': [32,startHeight], 'background-position': ['0px 32px', newBgPos] });
					}
					
					navLayer.get('morph').start({ 'height': [32,startHeight] });
				}

				element.style.visibility = 'hidden';
			}
		}
		this._openSubNav = subNavs;
		this._currentSubNavTree = subNavs;
		return false;
	},
	
	closeHomeNavTree: function(eRel){
		var navigation = $('navi_wrapper');
		children = navigation.getChildren('div');
		numChildren = children.length;
		var homeButton = children[0];
		var homeAnchor = homeButton.getChildren('a')[0];
		homeAnchor.removeEvents('click');
		homeAnchor.addEvent('mouseenter', this.showHomeNavTree.bind(this));
		
		var breadcrumbElements = $('breadcrumb').getElementsByTagName('li');
		var subNavs = this._currentSubNavTree;
		var numSubNavs = subNavs.length;
		var height = 32;
		var newBgPos = '0px -168px';
		var navLayer;
		var list;
		var listElements;
		var numListElements;
		var listEntry;
		var animationSpeed = this.getOptions().animationSpeed;
		var breadcrumbCounter = -1;
		var showBreadcrumb = function(){
			for(var i=0;i<breadcrumbElements.length;i++){
				listEntry = breadcrumbElements[i].getElementsByTagName('a')[0];
				if(listEntry){
					listEntry.style.visibility = 'visible';
				}
			}
			$('breadcrumb').style.display = 'block';
		}
		showBreadcrumb.delay(500);
		for(var i=0;i<breadcrumbElements.length;i++){
			listEntry = breadcrumbElements[i].getElementsByTagName('a')[0];
			if(listEntry){
				breadcrumbCounter++;
			}
		}

		var mainNavEffect = new Fx.Morph('mainnav',
			{
				duration: animationSpeed,
				onStart: function(){
					if(breadcrumbCounter < 1){
						height = 0;
						newBgPos = '0px -200px';
					}
					$('mainnav').get('morph').start({ 'height': height, 'background-position': newBgPos });
					$('subNav1Background').get('morph').start({ 'height': height, 'background-position': newBgPos });
					if(breadcrumbCounter < 2){
						height = 0;
						newBgPos = '0px -200px';
					}
					$('subNav2Background').get('morph').start({ 'height': height, 'background-position': newBgPos });
					list = $('mainnav').getChildren('ul')[0];
					listElements = list.getChildren('li');
					numListElements = listElements.length;
					for(var i=0;i<numListElements;i++){
						listEntry = listElements[i];
						// if(listEntry.id != 'navItem_'+subNavs[0] && listEntry.id != 'navItem_'+subNavs[1] && listEntry.id != 'navItem_'+subNavs[2]){
							listEntry.style.overflow = 'hidden';
							listEntry.get('morph').start({ 'height': 0 }).chain(
								function(){ 
									this.start( {'opacity': [1,1] });
								}
							);
						// }
					}
					var numChildren = children.length; // nav_wrapper child divs
					var child;
					for(var i=0;i<numChildren;i++){
						child = children[i];
						if(child.id.indexOf('subNav') > -1 && child.id.indexOf('Background') < 0){
							list = child.getChildren('ul')[0];
							listElements = list.getChildren('li');
							numListElements = listElements.length;
							for(var j=0;j<numListElements;j++){
								listEntry = listElements[j];
								// if(listEntry.id != 'navItem_'+subNavs[0] && listEntry.id != 'navItem_'+subNavs[1] && listEntry.id != 'navItem_'+subNavs[2]){
									listEntry.get('morph').start({ 'height': 0 }).chain(
										function(){ 
											this.start( {'opacity': [1,1] });
										}
									);
								// }
							}
						}
					}
				},
				onComplete: function(){
					if(eRel == 'mainnav'){
						window.location.href = homeAnchor.href;
					}
				}
			}
		);
		if(breadcrumbCounter < 0){
			height = 0;
		}
		mainNavEffect.start(
			{
				'height': height, 'background-position': '0px -168px'
			}
		);
		return false;
	},
	
	setBreadcrumb: function(eRel){
		var url;
		var anchor;
		if(eRel == 'mainnav'){
			url = $('homenav').href;
			anchor = $('homenav');
		}else{
			url = $('navItem_'+eRel).getElementsByTagName('a')[0].href;
			anchor = $('navItem_'+eRel).getElementsByTagName('a')[0];
		}
		var list = anchor.getParents('ul')[0];
		var listElements = list.getChildren('li');
		var numListElements = listElements.length;
		for(var i=0;i<numListElements;i++){ // events löschen, damit beim Einfahren keine mehr ausgelöst werden
			anchor = listElements[i].getChildren('a')[0];
			anchor.removeEvents('mouseleave');
			anchor.removeEvents('mouseenter');
		}
		this.changePage(url, eRel);
		return false;
	},
	
	// v2
	changePage: function(url, eRel){
		var subNavs = this._openSubNav;
		var clickedListElement = 'navItem_'+eRel;
		
		var animationSpeed = this.getOptions().animationSpeed;
		mainNavEffect = new Fx.Morph('mainnav',
			{
				duration: animationSpeed,
				onStart: function(){
					var listEntry = null;
					var navLayer = null;
					var closeNav = function(){
						height = 32;
						newBgPos = '0px -168px';
						$('mainnav').get('morph').start( {'height': height, 'background-position': newBgPos });
						for(var i=0;i<subNavs.length;i++){
							navLayer = $('subNav'+subNavs[i]);
							if($(clickedListElement).getParent('div').id == 'mainnav'){
								height = 0;
							}
							if(navLayer.className == 'subNav1'){
								$('subNav1Background').get('morph').start({ 'height': height, 'background-position': newBgPos });
							}
							if(navLayer.className == 'subNav2'){
								$('subNav2Background').get('morph').start({ 'height': height, 'background-position': newBgPos });
							}
							navLayer.get('morph').start( {'height': height }); // , 'background-position': newBgPos
							if($(clickedListElement).getParent('div').id == navLayer.id){
								height = 0;
							}
						}
					}
					// mainNavElements
					navLayer = $('mainnav');
					list = navLayer.getChildren('ul')[0];
					listElements = list.getChildren('li');
					numListElements = listElements.length;
					for(var j=0;j<numListElements;j++){
						listEntry = listElements[j];
						doMorph = true;
						if($(clickedListElement).getParent('div').id == 'mainnav'){
							if(clickedListElement == listEntry.id){
								doMorph = false;
							}
						}else{
							for(var k=0;k<subNavs.length;k++){
								if((listEntry.id == 'navItem_'+subNavs[k] || clickedListElement == listEntry.id )){
									doMorph = false;
								}
								if( listEntry.getParent('div').id == $(clickedListElement).getParent('div').id && listEntry.id != clickedListElement){
									doMorph = true;
								}							
							}
						}
						if(doMorph){
							listEntry.get('morph').start({ 'opacity': 0 }).chain(
								function(){ 
									this.start( {'height': 0 });
								}
							);
						}
					}
					// subNavElements
					for(var i=0;i<subNavs.length;i++){
						navLayer = $('subNav'+subNavs[i]);
						if(navLayer){
							list = navLayer.getChildren('ul')[0];
							listElements = list.getChildren('li');
							numListElements = listElements.length;
							for(var j=0;j<numListElements;j++){
								listEntry = listElements[j];
								doMorph = true;
								for(var k=0;k<subNavs.length;k++){
									if((listEntry.id == 'navItem_'+subNavs[k] || clickedListElement == listEntry.id ) && $(clickedListElement).getParent('div').id != 'mainnav' ){
										doMorph = false;
									}
									if( listEntry.getParent('div').id == $(clickedListElement).getParent('div').id && listEntry.id != clickedListElement){
										doMorph = true;
									}
								}
								if(doMorph){
									listEntry.get('morph').start({ 'opacity': 0 }).chain(
										function(){ 
											this.start( {'height': 0 });
											closeNav();
										}
									);
								}
							}
						}
					}
				},
				onComplete: function(){
					redirect = function(){
						window.location.href = url;
					}
					redirect.delay(animationSpeed*3);
				}
			}
		);
		mainNavEffect.start(
			{

			}
		);
	}
});
