// Vehicle home javascript
window.addEvent('domready', function() {
	
	$$(".f_floating_menu").each(function(element){
		
		//don't allow the menu to be visibile until the slide is initiated
		$E('.f_content', element).setStyle('display', 'block');
		//setup parent slide and mouseenter and leave events
		var mySlide = new Fx.Slide($E('.f_content', element), {wait:false, duration: 300, fps:100, transition: Fx.Transitions.Quad.easeInOut}).hide();
		
		//setup parent slidein events and add class for keeping the heading highlighted
		element.addEvent("mouseenter", function(e) {
				new Event(e).stop();
				mySlide.slideIn();
				$E('.f_heading', element).addClass('on');
			}
		);
		element.addEvent("mouseleave", function(e) {
				new Event(e).stop();
				mySlide.slideOut();
				$E('.f_heading', element).removeClass('on');
			}
		);
		
		//loop through each menu item
		$$(".f_item").each(function(element){
			
			//if there is a sub-container, check for the need of a slide
			if($E('.f_item_container', element)) {
				
				//if the container contains a parent link, creating a slide and click event for container
				if($E('.f_item_link', element)) {
					
					var moreSlide = new Fx.Slide($E('.f_item_container', element), {wait:false, duration: 150, fps:100, transition: Fx.Transitions.Quad.easeInOut}).hide();
					
					//once the slidein for the sub-item is complete, you must chain a parent slidein to expand to the new height
					$E('.f_item_link', element).addEvent("mouseenter", function(e) {
						if($E('.f_item_link span', element).hasClass('sub_on')) {
							$E('.f_item_link span', element).addClass("arrow_hover");
						}
					});
					
					$E('.f_item_link', element).addEvent("mouseleave", function(e) {
						if($E('.f_item_link span', element).hasClass('sub_on')) {
							$E('.f_item_link span', element).removeClass("arrow_hover");
						}
					});
					
					$E('.f_item_link', element).addEvent("click", function(e) {
						new Event(e).stop();
						$E('.f_item_link span', element).toggleClass("sub_on");
						moreSlide.toggle().chain(function(){
							mySlide.slideIn();
						});
					});
					
				}
				
			}
			
		});
		
	});

});