var infowindowLevel = 0;
var infoWindow;

/**
 * Initialize Map. The map markers are loaded by extra XMLHTTPRequests. The
 * cb_customsearch plugin provides markers as XML via a special eID-Mode.
 * 
 * @author martelo
 * @see http://code.google.com/intl/de-DE/apis/maps/articles/phpsqlajax_v3.html
 */
 

function loadMap(){
		
	var imgPath = "/fileadmin/sys/img/googlemap/markers/";
	var markerRedImg = imgPath + "pin_red.png";
	var markerShadowImg = imgPath + "shadow50.png";
	var infoWindowBg = imgPath + "infowindow_bg.png";
	var rand_no = Math.random();
	var markersXMLUrl = "/ansprechpartner?eID=go&rnd=" + rand_no;
	
	var markerSize = new google.maps.Size(29, 55);
	var iconAnchor = new google.maps.Point(5, 53);
	var infoAnchor = new google.maps.Point(16, 0);
	var markerShadowSize = new google.maps.Size(37, 55);
	var imageMap = {coord: [0,11, 0,17, 6,27, 4,51, 12,29, 20,27, 27,19, 28,10, 19,1, 7,1],type: 'poly'};
	var latlng = new google.maps.LatLng(53.550099314556185, 9.986572265625); // hamburg
	 
	var navControlOptions = {
		style: google.maps.NavigationControlStyle.DEFAULT
	};
	
	
	var mapMarkersArray = Array();
	
	// google map
	var mapOptions = {
	  zoom: 8,
	  center: latlng,
	  mapTypeId: google.maps.MapTypeId.ROADMAP,
	  navigationControl: true,
	  navigationControlOptions: navControlOptions
	};
	var myMap = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
	
	// marker images
	var markerImage = new google.maps.MarkerImage(markerRedImg, markerSize, null, iconAnchor);
	var markerImageShadow = new google.maps.MarkerImage(markerShadowImg, markerShadowSize, null , iconAnchor);
	
	// get markers
	downloadUrl(markersXMLUrl, function(data, status) {
		var xml = parseXml(data);
		var markers = xml.documentElement.getElementsByTagName("marker");
		
		var myBounds = new google.maps.LatLngBounds();

		var markersTable = '<table class="scrollingTableBody" cellspacing="0" summary=""><thead><tr><th class="start"><div class="startTop ">Name</div></th><th class="col2"><div class="midTop ">Fachbetrieb f&uuml;r</div></th><th class="last"><div class="endTop ">Kontaktinformation</div></th></tr></thead><tbody>';
		
		
		for (var i = 0; i < markers.length; i++) {
			var username = markers[i].getAttribute("username");
			var name = markers[i].getAttribute("name");
			var company = markers[i].getAttribute("company");
			var address = markers[i].getAttribute("address");
			var telephone = markers[i].getAttribute("telephone");
			var fax = markers[i].getAttribute("fax");
			var email = markers[i].getAttribute("email");
			var zip = markers[i].getAttribute("zip");
			var city = markers[i].getAttribute("city");
			var type = markers[i].getAttribute("type");
			var www = markers[i].getAttribute("www");
			var taetigkeitsbereiche = markers[i].getAttribute("taetigkeitsbereiche");
			var point = new google.maps.LatLng( parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
			
			var emailString = email? '<a href="mailto:' + email + '" class="icon mail">' + email + '</a>' : '';
			var wwwString = www ? '<a class="icon arrow homelink" target="_blank" href="http://' + www + '">' + www + '</a>' : '';
			
			var htmlContent = "<span class='infoWinClose'></span><div class='infoWinContent'><h3>" + name + "</h3><p>" + (company?company+"<br/>":"") + address + "<br />" + zip + "&nbsp;" + city + "<br />Tel.: " + telephone + "<br />Telefax: " + fax + emailString + wwwString + "</p></div>";
		    
			// fit all markers into viewport
			myBounds.extend(point);
			myMap.fitBounds(myBounds);
		
			markersTable += '<tr><td><a href="#" class="icon arrow" onclick="locationMap.triggerInfoWindow('+i+');return false;">'+name+'</a>'+ (company?company+'<br/>':'') +address+'<br/>'+zip+' '+city+'</td><td>'+taetigkeitsbereiche+'</td><td class="last">'+'Tel.: ' + telephone + '<br/>Telefax: ' + fax + emailString + wwwString;
			
			
			// create map marker
			var marker = new google.maps.Marker({
				map: myMap,
				position: point,
				icon: markerImage,
				shadow: markerImageShadow,
				shape: imageMap
			});


			var infoWindowOptions = {

			};

			bindInfoWindow(marker, myMap, infoWindowOptions, htmlContent);

			mapMarkersArray[i] = marker;
		    
		  }
		  
		  markersTable+='</tbody></table>';
		  
		  if($("markersTable")){
		  	var mt = $("markersTable");
		  	mt.update(markersTable);
		  	
		  	// needed for IE7
		  	if(mt.down('table').getHeight()>mt.getHeight()){
		  		mt.style.overflowY="scroll";
		  	}
		  	else{
		  		mt.style.height=mt.down('table').getHeight()+'px';
		  		mt.style.borderBottom=0;
		  	}
		  }
		  
		});

		this.triggerInfoWindow = function(n){
			google.maps.event.trigger(mapMarkersArray[n], 'click');
		}
}

/**
 * Binds an infoWindo to given marker and map. Window contains data about the ansprechpartner marker.
 */
function bindInfoWindow(marker, map, infoWindowOptions, htmlContent) {
    google.maps.event.addListener(marker, 'click', function() {
    	if (infoWindow) {
    		infoWindow.close();
    	}
    	infoWindow = new google.maps.InfoWindow(infoWindowOptions);
    	infoWindow.setContent(htmlContent);
    	infoWindow.setZIndex(++infowindowLevel);
    	infoWindow.open(map, marker);
    });
}


/**
 * Function calls a callback method with the result of a HTTPRequests.
 * 
 * @see http://code.google.com/intl/de-DE/apis/maps/articles/phpsqlajax_v3.html
 */
function downloadUrl(url,callback) {
	
	 var request = window.ActiveXObject ?  new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest;

	 request.onreadystatechange = function() {
	   if (request.readyState == 4) {
	     request.onreadystatechange = doNothing;
	     callback(request.responseText, request.status);
	   }
	 };

	 request.open('GET', url, true);
	 request.send(null);
}

/**
 * Parse XML
 */
function parseXml(str) {
	if (window.ActiveXObject) {
		var doc = new ActiveXObject('Microsoft.XMLDOM');
		doc.loadXML(str);
		return doc;
	} else if (window.DOMParser) {
		return (new DOMParser).parseFromString(str, 'text/xml');
	}
}

/**
 * Does everything.
 */
function doNothing() {
	//testsvn3
	//testsvn3
}


// initialize map
//document.observe("dom:loaded", function() {
	//locationMap = new loadMap();
	//loadMap();/
//});

Event.observe(document, "dom:loaded", function()  {
	locationMap = new loadMap();
});

function printMapPage(){
	var map_canvas = $("map_canvas");

	map_canvas.select('img[src*="iws3.png"]','div[controlwidth]','div[controlheight]','div[style*="black 1px solid"]').each(function(i){
		i.addClassName('noprint');	
	});

	map_canvas.select('img[src*="iw_close.gif"]').each(function(i){
		i.addClassName('noprint');
		var p = Element.up(i,0);
		var pDims = p.getDimensions();
		Element.insert(i,{before:'<img src="/fileadmin/sys/img/googlemap/bg_print_white.gif" alt="" style="height:'+pDims.height+'px;width:'+(pDims.width+1)+'px;" class="printBg" />'});
	});
	
	map_canvas.select('div[style*="pin_red"]').each(function(el){
		if(el.getStyle('opacity')<1){
			el.addClassName('noprint');
		}else{
			el.innerHTML='<img src="/fileadmin/sys/img/googlemap/markers/pin_print_red.gif" class="print-pin" alt="" />';
			el.addClassName("pin-holder");
		}
		
	});

	map_canvas.select('div[style*="width: 25px"]').each(function(i){
		i.addClassName('corner');
	});

	//IE only
	map_canvas.select('div[style*="transparent.png"]').each(function(i,n){
		if(n==0){
			Element.up(i,'div.gmnoprint').addClassName('shadowWrapper');
		}
		i.addClassName('nofilter');
		Element.select(i,'div[style*="filter"]').each(function(d){
			d.addClassName('nofilter');
			var par = Element.up(d,0);
			if(par.select('img.yesprint').length<1){
				//var posX = parseInt(d.style.left);
				//var posY = parseInt(d.style.top);
				//d.insert('<img src="/fileadmin/sys/img/googlemap/iw3_print.gif" alt="" style="top:'+posY+'px;left:'+posX+'px;" class="yesprint" />');
				d.insert('<img src="/fileadmin/sys/img/googlemap/iw3_print.gif" alt="" class="yesprint" />');
			}
		});
	});	
	map_canvas.select('img[src*="shadow50.png"]').each(function(el){
		el.addClassName("pin-shadow");
	});
	map_canvas.select('img[src*="pin_red.png"]').each(function(el){
		el.addClassName("noprint");
		var par = Element.up(el,0);
		if(par.select('img.yesprint').length<1){
			par.insert('<img src="/fileadmin/sys/img/googlemap/markers/pin_print_red.gif" alt="" class="yesprint" />');
		}
	});
	map_canvas.select('div[style*="alpha(opacity=1)"]').each(function(el){
		el.addClassName("nofilter");
	});
	
	// for IE6
	map_canvas.select('div[style*=shadow50]').each(function(el){
		el.addClassName("pin-shadow");
	});


	// FF, Webkit
	map_canvas.select('div[style*="http://mt"]').each(function(el){
		if(el.empty()){
			el.addClassName('tileBlock');
			var imgSrc=el.style.backgroundImage;
			var fixedImgSrc=imgSrc.substring(4,imgSrc.length-1);
			el.innerHTML='<img src='+fixedImgSrc+' alt="" />'
		}
	});
	
	window.print();
	
	return false;
}