jQuery.noConflict();

jQuery(document).ready(function() {

		/****************************************************
		* BUERSTNER COUNTRY SELECTOR
		*/
		
		//set current menu in dropdownlist active (compare the names with the name of the curent country)
		var currentLangText = jQuery.trim(jQuery('#countrySelector div.actlang a').text());
		jQuery('div.selectlang ul li a').each(function() {
			if (jQuery(this).text() == currentLangText) {
				jQuery(this).addClass('active');
				return false;
			}
		});
		
		// set onClick on Sselector
		jQuery('#countrySelector div.actlang a').bind('click', function(e) {
			e.stopPropagation();
			e.preventDefault();
			var pos = jQuery(this).offset();
			var height = jQuery(this).height();
			jQuery('div.selectlang').css( {"position":"absolute", "left": (pos.left) + "px", "top": (pos.top + height + 1) + "px" } );
			
			jQuery('div.selectlang').animate({height: 'toggle'},'fast');
			jQuery('div#search').animate({opacity: 'toggle'},'fast');
		});
		
		//hide list when clicking anywhwere
		jQuery(document).bind('click', function(e) {
			jQuery('div.selectlang').slideUp('fast');
			jQuery('div#search').fadeIn('fast');
		});

		/****************************************************
		* BUERSTNER QUICKFINDER
		* 
		* Main Menu is prepared by TypoScript (standard HMENU/TMENU)
		* Submenus and Quickinfos have to present in DOM. Should be inserted via EXT
		*
		* Following Markup is assumed (important parts are in []-brackets):
		* MainMenu:
		*	<ul class="dropdown">
		*	  <li>
        *	    <a class="[menu] [section]" href="/lang/section/modelle.html">Section</a>
        *	  </li>
		*	</ul>
		* [menu]: const, must be first class
		* [section]: must match the submenu and quickinfo-markup, must be second class
		*
		* Submenu:
		*	<div id="dropdown">
		*	  <div class="menu" id="menu_[section1]"  style="display:none;">
		*		<ul>
		*	    	<li class="[submenu] [model]"><a href="/lang/section1/modelle/model/360-ansichten.html">Model</a></li>
		*		</ul>
		*	  </div>
		*	  <div class="menu" id="menu_[section2]"  style="display:none;">
		*	  	<ul>
		*	   	 <li class="[submenu] [model]"><a href="/lang/section2/modelle/model/360-ansichten.html">Model</a></li>
		*	  	</ul>
		*	  </div>
		*	</div>
		* [sectionX]: Must match the main menu item
		* [submenu]: const, must be first class
		* [model]: must match the quickinfo-markup, must be second class
		*
		* Quickinfo
		*	<div id="submenu_[model]" class="quickinfo submenu_[section]" style="display:none;">
		*		some html content
		*	</div>
		* [model]: Must match the sub menu item
		* [section]: must match the mainmenu-markup, must be second class
		*/
		
		var HIDE_TIMEOUT = 500;
		
		var tmrMenuDelay;
		var tmrSubmenuDelay;
		var tmrQuickinfoDelay;
		
		var recentSubmenu ='';
		var recentMainMenu ='';
		
		/****************************************************
		* MENU ACTIONS: Main Menu (horizontal on top)
		* binds MouseEnter/MouseLeave to MainMenuItems
		*  Enter: closes all Submenus and Quickinfos and opens the assigned submenu
		*  Leave: closes all submenus (delayed with timer)
		*/
		jQuery('ul.dropdown li a.menu').bind('mouseenter', function() {
			//get id of matching submenu by reading our class (must be class="menu [section]")
			//relevant part is second class. This section name must be part of submenu id: menu_[section]
			var classes = jQuery(this).attr('class').split(' ');
			var submenuId = 'menu_' + classes[1];
			
//HACK
recentMainMenu = classes[1];
//HACK	
			
//console.log ('IN  MAIN:'+jQuery(this).attr('class'));

			//close all info-panes (3rd level)
			jQuery('div#dropdown div.quickinfo').hide();
					
			if(recentSubmenu==submenuId) {
				//mouseleave of any submenu triggered self-hiding: timer of submenu-closer can be stopped
				//if it is our Submenu
				clearTimeout(tmrSubmenuDelay);
			
			} else {
				//hide all submenus, but not our own
				jQuery('div#dropdown .menu').stop(true,true);
				jQuery('div#dropdown .menu').hide();
				
				//Set all other main menuitems to inactive
				jQuery('ul.dropdown li a.menu').removeClass('open');
			}

			
			
			//get the position of the menu item
			var pos = jQuery(this).offset();  
			var xOffset = 0;
			if (classes[1] == 'caravans') {
				xOffset = -120;
			}
			
			//calculate height of submenu: we need dropshadow of that size
			//Problem: heigth can not be obtained directly, because it is animated
			//We count LIs and use its heigt of 42px
			var liCount = jQuery('#'+submenuId+ ' ul li').size() 
			var height = liCount * 42 + liCount;
			
			

			//simulate hoverstate for menuitem
			jQuery(this).addClass('open');

			//show the menu directly below
			//jQuery('#'+submenuId).css( {"position":"absolute", "left": (pos.left + xOffset) + "px", "top": "38px" } );
			jQuery('#'+submenuId).css( {"position":"absolute", "left": (pos.left + xOffset) + "px", "top": "38px", "height": (height+4) } );
			//jQuery('#'+submenuId).show();

			left_temp = (pos.left + xOffset);

			jQuery('#'+submenuId).animate({
						height: 'show',
						opacity: 'show'
					}, 'fast', 'swing');			
		
		}).bind("mouseleave",function(){
//console.log ('OUT MAIN:'+jQuery(this).attr('class'));

			//simulate hoverstate for menuitem
			jQuery(this).removeClass('open');
			
			//get id of matching submenu by reading our class (must be class="menu [section]")
			//relevant part is second class. This section name must be part of submenu id: menu_[section]
			var classes = jQuery(this).attr('class').split(' ');
			var submenuId = 'menu_' + classes[1];

			tmrMenuDelay = setTimeout(function() {
				//jQuery('#'+submenuId).hide();

				jQuery('#'+submenuId).animate({
							height: 'hide',
							opacity: 'hide'
						}, 'fast');
			}, 20);

		});



		/****************************************************
		* MENU ACTIONS: Sub Menu (vertical below main)
		* binds MouseEnter/MouseLeave to container of submenu
		*  Enter: keeps up the highlight for main menu item
		*  Leave: closes all submenus (delayed with timer)
		*/
		jQuery('div#dropdown .menu').bind('mouseenter', function() {
//console.log ('IN   SUB:'+jQuery(this).attr('id'));
			//mouseleave of our menuitem triggered hiding us: abandon this
			clearTimeout(tmrMenuDelay);

			/* manipulate calling main menu */
			//get the class of our calling main menu item our id is "menu_[mainmenuclass]"
			var mainmenuClass = jQuery(this).attr('id').replace('menu_','');		  

			//simulate hoverstate for menuitem
			jQuery('ul.dropdown li a.menu.'+mainmenuClass).addClass('open');

		}).bind("mouseleave",function(){
//console.log ('OUT  SUB:'+jQuery(this).attr('id'));
			//get the class of our calling main menu item our id is "menu_[mainmenuclass]"
			var mainmenuClass = jQuery(this).attr('id').replace('menu_','');
			var myId = jQuery(this).attr('id');
			
			//set info on which submenu was open
			//Is checked in MainMenu.mouseover
			recentSubmenu = myId;

			tmrSubmenuDelay = setTimeout(function() {
				//simulate hoverstate for menuitem
				jQuery('ul.dropdown li a.menu.'+mainmenuClass).removeClass('open');
				//jQuery('#'+myId).hide(); //'this' is timer in this context!
				jQuery('#'+myId).animate({
							height: 'hide',
							opacity: 'hide'
						}, 'fast');
			}, HIDE_TIMEOUT);

		});


		/****************************************************
		* MENU ACTIONS: Sub Menu Item (vertical below main)
		* binds MouseEnter/MouseLeave to submenu-items
		*  Enter: opens the quickinfo
		*  Leave: closes all submenus (delayed with timer)
		*/
		jQuery('div#dropdown li.submenu').bind('mouseenter', function() {
//console.log ('IN  ITEM:'+jQuery(this).attr('class'));

			//stop timer set be quickinfo
			clearTimeout(tmrQuickinfoDelay);
			//stop timer set by submenu
			clearTimeout(tmrSubmenuDelay);
			
			//close all info-panes (3rd level)
			jQuery('div#dropdown div.quickinfo').hide();
			
			//get id of matching quickinfo by reading our class (must be class="submenu [model]")
			//relevant part is second class. This section name must be part of quickinfo id: submenu_[model]
			var classes = jQuery(this).attr('class').split(' ');
			var quickinfoId = 'submenu_' + classes[1];

			//get the position of our container
			var pos = jQuery(this).parent().offset();  
			var width = jQuery(this).parent().width();

			//show all quickinfos on the left (all on same pos)
			jQuery('#' + quickinfoId).css( {"position":"absolute", "left": (pos.left + width + 5) + "px", "top": (pos.top) + "px" } );
			jQuery('#' + quickinfoId).show();
		}).bind("mouseleave",function(){
//console.log ('OUT ITEM:'+jQuery(this).attr('class'));
			//get id of matching submenu by reading our class (must be class="submenu [model]")
			//relevant part is second class. This section name must be part of submenu id: submenu_[model]
			var classes = jQuery(this).attr('class').split(' ');
			var quickinfoId = 'submenu_' + classes[1];
			
			tmrQuickinfoDelay = setTimeout(function() {
				jQuery('#' + quickinfoId).hide();
			}, HIDE_TIMEOUT);
		});	

		
		
		/****************************************************
		* MENU ACTIONS: Quickinfo
		* binds MouseEnter/MouseLeave to Quickinfi pane
		*  Enter: keeps all menus above visible
		*  Leave: closes all submenus (delayed with timer)
		*/
		//
		jQuery('div#dropdown div.quickinfo').bind('mouseenter', function() {
//console.log ('IN  INFO:'+jQuery(this).attr('class'));

			//stop timer set be calling menuitem
			clearTimeout(tmrQuickinfoDelay);
			//stop timer set by submenu
			clearTimeout(tmrSubmenuDelay);

		}).bind("mouseleave",function(){
//console.log ('OUT INFO:'+jQuery(this).attr('class'));
			
			var myId = jQuery(this).attr('id');
			
			var classes = jQuery(this).attr('class').split(' ');
			var mainmenuClass = classes[1].replace('submenu_',''); //main menuitem has a class, that is found in our 2nd class class="quickinfo submenu_[section]"
//HACK
if (mainmenuClass.length < 1){mainmenuClass=recentMainMenu;}
//HACK			
			var submenuID = classes[1].replace('submenu_','menu_'); //submenu has an id, that is found in our 2nd class class="quickinfo submenu_[section]"
//HACK
if (submenuID == 'menu_'){submenuID='menu_' + recentMainMenu;}
//HACK

			//start the timer we stopped on mouseenter
			// using the different timers gives the according eventhandlers a chance to stop it
			tmrQuickinfoDelay = setTimeout(function() {
				jQuery('#' + myId).hide(); //'this' is timer in this context!
			}, HIDE_TIMEOUT);
			
			tmrSubmenuDelay = setTimeout(function() {
				jQuery('ul.dropdown li a.menu.'+mainmenuClass).removeClass('open');
				//jQuery('#'+submenuID).hide();
				jQuery('#'+submenuID).animate({
							height: 'hide',
							opacity: 'hide'
						}, 'fast');
			}, HIDE_TIMEOUT);
		});	
		
	});