var subMenusArray = [
		'villasByRegion',
		'villasByTheme',
		'aboutItaly',
		'howToBook'
		];

	var preLoadShadow = new Asset.image('/gifimages/maps/shadowsquare.png');
	
	window.addEvent('domready',function(){
		
		
		$('columnSideShadow').addEvent('mouseover', closeSubMenus);
		
		subMenusArray.each(function(value, index){

			$(value + 'Main').addEvents({
				'mouseover': function(event){
					closeSubMenus();
					showSubMenu(value, event);
				},
				'click': function(event){
					closeSubMenus();
					showSubMenu(value, event);
				}
			});

			$(value + 'List').addEvents({
				'mouseout': function(event){
					if(positionIsOutsideList(event, $(value + 'List'))){
						closeSingleMenu(value);
					}
				},
				'click': function(){
					closeSingleMenu(value);
				}
			});

		});
		
		
		//all items in the column on the left
		var otherMenuItems = $$('a.menu');
		otherMenuItems.each(function(value, index){
			var currentId = otherMenuItems[index].get('id');
			if($defined(currentId) && currentId.indexOf('Main') > -1){
				//if we are over a link for opening a sub menu, do nothing, each
				//individual link has its own call to close the sub menus
			}else{
				//if we are over any of the menu items other than the links for opening sub menus, 
				//then close any sub menus
				otherMenuItems[index].addEvent('mouseover', closeSubMenus);
			}//end if
		});
	});
	
	function positionIsOutsideList(event, listObj){
		var eventXPos = event.page.x;
		var eventYPos = event.page.y;
		
		var listObjXPos = listObj.getPosition().x;
		var listObjYPos = listObj.getPosition().y;
		var listObjClientWidth = listObj.clientWidth;
		var listObjClientHeight = listObj.clientHeight;
		//we don't want the menu to be removed while the mouse is going over the 
		//shadow between the left column and the list so we take off the shadowWidth as well
		var shadowWidth = 5;
		//if it's in the list menu, we return false		
		if(eventXPos > listObjXPos - shadowWidth && eventXPos < (listObjXPos + listObjClientWidth)){
			if(eventYPos > listObjYPos && eventYPos < (listObjYPos + listObjClientHeight)){
				return false;
			}//end if
		}//end if
		
		return true;
		
	}//end function
	
	function showSubMenu(menuType, event){

		if(targetFromBug(event)){
			return;
		}
		
		var shadowHeight = 3;
		var shadowWidth = 5;
		$(menuType + 'List').setStyle('top', $(menuType + 'Main').getPosition().y);
//		$(menuType + 'List').setStyle('left', $(menuType + 'Main').getPosition().x + $(menuType + 'Main').clientWidth + shadowWidth);
		$(menuType + 'List').setStyle('left', $(menuType + 'Main').getPosition().x + $(menuType + 'Main').clientWidth);
		$(menuType + 'Arrow').set('src', '/ts/images/openshut/rightArrowWhite.gif');
		addMenuShadow(menuType + 'List');
	}
	
	function addMenuShadow(menuId){
		var menuObj = $(menuId);
		var innerMenuObj = $('inner' + menuId);
		//don't need z-index because the menu already has a high z-index
		var shadow = new Element('img',{
			src: preLoadShadow.src,
			id: 'shadowImg',
			styles: {
				position: 'absolute',
				width: innerMenuObj.clientWidth + 'px',
				height: innerMenuObj.clientHeight + 'px',
				top: (menuObj.getPosition().y - 3) + 'px',
				left: (menuObj.getPosition().x + 6) + 'px'
			}
		});
		shadow.inject($$('body')[0]);
	}

	function closeSubMenus(){
		subMenusArray.each(function(value, index){
			if($defined($(value + 'List'))){
				closeSingleMenu(value);
			}
		});
	}
	function closeSingleMenu(name){
		$(name + 'List').setStyle('top', '-600px');
		$(name + 'Arrow').set('src', '/ts/images/openshut/rightArrowRed.gif');
		if($defined($('shadowImg'))){
			$('shadowImg').destroy();	
		}
	}
	
	
	/**
	 * There's a bug in Firefox on mac where a relatedTarget (select object from the search parms for example did this)
	 * kept opening the About Italy menu.
	 * So we check whether either the relatedTarget id, if there is one, 
	 * matches one of the submenus or one of the other links in the SideColumn, which all must have ids with 'SideLink' in them!
	*/
	function targetFromBug(event){
		var appNamer = navigator.appName;
		if(appNamer.toLowerCase().indexOf('netscape') > -1){
			var version = navigator.appVersion;
			if (version.toLowerCase().indexOf('mac') > -1){
			
				var relatedTargetId;
				if($defined($(event.relatedTarget))){
					relatedTargetId = event.relatedTarget.id;
				}else{
					return false;
				}
		
				var targetOk = false;
				for(var i = 0; i < subMenusArray.length; i = i + 1){
					if($defined(relatedTargetId) && (relatedTargetId.indexOf(subMenusArray[i]) > -1 || relatedTargetId.indexOf("SideLink") > -1)){
						targetOk = true;
						break;
					}//end if
				}//end for
		
				if(!targetOk){
					return true;
				}
			}//end if
		}//end if
		return false;
	}//end function()