Event.observe(window, 'load', function() {
	if($$("map").length > 0){
		initializeHoverMaps();
	}
});

function initializeHoverMaps(){
	var maps = $$('map');
	//Process each map
	
	maps.each(function(map){
		var mname = map.getAttribute("name");
		var mvar = "myHoverMap" + mname;
		eval(mvar + " = new hoverMap(mname)");
		map.childElements().each(function (area){
			if(area.hasAttribute("hoversection")){
				if(eval(mvar + ".addChild(area.getAttribute(\"hoversection\"))")){
					area.setAttribute("onmouseover","hoverMapSection('"+mname+"','hoverSection"+area.getAttribute("hoversection")+"');");	
					area.setAttribute("onmouseout","hoverMapSection('"+mname+"');");
				}
			}
		});
		eval(mvar + ".finalizeSetup()");
		hoverMapSection(mname);
	});
}

function hoverMapSection(parentName, hoverSectionId){
	if(hoverSectionId == null || $(hoverSectionId) == null){
		hoverSectionId = "default"+parentName;
	}
	$('placeholder'+parentName).innerHTML = $(hoverSectionId).innerHTML;
}

function hoverMap(mapId){
	$("placeholder"+mapId).show();
	this.id = mapId;
	this.children = new Array();
	this.tallestChild = 0;
	this.addChild = function (childName){
		if($("hoverSection"+childName) != null){
			this.children.push("hoverSection"+childName);
			height = $("hoverSection"+childName).getHeight();
			if(height > this.tallestChild){
				this.tallestChild = height;
			}
			return true;
		}
		return false;
	}
	this.finalizeSetup = function (){
		if(this.tallestChild > 0){
			//I need to pass the tallest and since we cant use this, and i dont know if parent works here we are...
			tallest = this.tallestChild;
			this.children.each(function (child){
				$(child).setStyle({minHeight:tallest+"px"});
			});
			$("placeholder"+this.id).setStyle({height:this.tallestChild+"px"});
			this.children.push("placeholder"+this.id);
		}
	}
}