/****** map *****/
YUI().use('node','overlay','plugin','gallery-overlay-extras','gallery-outside-events', function(Y){
	
	function handleMegaMenuHotelClick(e)
	{
		var overlay = new Y.Overlay({
			plugins:[
				Y.Plugin.OverlayAutohide
			],
			x: e.pageX + 20,
			y: e.pageY - 10,
			width:"300px",
			zIndex:200,
			id: 'infoOverlay'
		});
		
		var content="";
		
		this.ancestor('.hotelsOnMap').all('a.mapMarker').each( function(n, i, l) {
			var lft1 = n.getX();
			var lft2 = parseInt(e.target.getX());
			var top1 = parseInt(n.getY());
			var top2 = parseInt(e.target.getY());
			var rad = 10;
			
			if(lft1 +rad >= lft2 && lft1 -rad <= lft2){
				if(top1 +rad >= top2 && top1 -rad <= top2){
					content +='<div class="media"><div class="img"><img height="40" src="'+n.getAttribute('hImage')+'"/></div><div class="bd"><strong>'+n.get('title')+'</strong><p><a href="'+n.get('href')+'">Beschreibung</a>, <a href="'+n.get('href')+'/angebote">Angebote</a></p></div></div>';
				}
			}
    });
		
		overlay.set("bodyContent", content);
		
		var parent = this.ancestor('.gfc-menu-item');
		overlay.render(parent);
		
		
		parent.on('mouseleave', function (e){overlay.set("bodyContent", ''); overlay.destroy();});
		//parent.on('mousedown', function (e){overlay.set("bodyContent", ''); overlay.destroy();});
		
		e.halt();
  }
	
	function handleHotelImageSelectorClick(e){
		Y.one('#stage').setStyle('background', 'url('+this.getAttribute('href')+') no-repeat top left');
		e.halt();
	}
	
	Y.on("click", handleMegaMenuHotelClick, ".hotelsOnMap a.mapMarker");
	Y.on("click", handleHotelImageSelectorClick, ".imageSelector a");
});
