var map;
var hotelids=null;



function hidemap() {
	$("#googlemap").remove();
}

function showmap(h_ids) {
	hidemap();
	$("body").append(createMap());
	hotelids=h_ids
	$("#googlemap").show();
	$("#googlemap").dragable({windowhandle: "#mapheaderContainer"});
	initializeMap();	
	$("#googlemap").center();
	$("#mapheader").html("loading...");
	$.webservice({url: "ws/ws_hotelinfo_for_map.asp", data: "ids="+escape(hotelids), 
	success: onDataForMapLoaded, 
	error: function (XMLHttpRequest, textStatus, errorThrown){ alert(XMLHttpRequest);}
	});
}

function printmap() {
	$("#printmapframe").attr("src", "hotelmap.asp?id="+hotelids);
	
}

function onDataForMapLoaded(data) {
	var dt=$(data);
	var rows=dt.find("row");
	setMapCenter(rows, map);
	rows.each(function () {
		var th=$(this);
		var center=new GLatLng(th.find("lat").text() , th.find("lng").text());
		$("#mapheader").html(th.find("name").text());		
		map.addOverlay(createMarker(th));
		$("#printlink").attr("href", "hotelmap.asp?ids="+hotelids);
		//hotel_id, name, city, address, latitude as lat, longitud
	});
	if (dt.find("row").length>1) {$("#mapheader").html("Found "+dt.find("row").length+" hotels");}
}

function findScale(coor) {
	
}

function setMapCenter(rows, mp) {	
	var minLng=99999;
	var minLat=99999;
	var maxLng=-99999;
	var maxLat=-99999;
	for(var i=0; i<rows.length; i++) {
		var it=$(rows[i])
		var lng=parseFloat(it.find("lng").text());
		var lat=parseFloat(it.find("lat").text());
		if (minLng>lng) minLng=lng;
		if (minLat>lat) minLat=lat;
		if (maxLng<lng) maxLng=lng;
		if (maxLat<lat) maxLat=lat;				
	}

	
	var centerLat=(minLat+maxLat)/2;
	var centerLng=(minLng+maxLng)/2;

	var diff=maxLat-minLat;
	var scale=12;
	if (diff<(maxLng-minLng)) diff=maxLng-minLng;
	
	if (diff<=0.3) scale=12;
	if (diff>0.3 && diff<=0.5) scale=11;
	if (diff>0.5 && diff<=0.7) scale=10;
	if (diff>0.7 && diff<=0.9) scale=9;
	if (diff>0.9 && diff<=1.1) scale=8;

	var center=new GLatLng(centerLat, centerLng);
	mp.setCenter(center, scale);	
}


function createMarker(th) {
	    var center=new GLatLng(th.find("lat").text() , th.find("lng").text());
		var marker = new GMarker(center);
		GEvent.addListener(marker, "click", function() {
			var txt='<h3>'+th.find("name").text()+'</h3>'+
			"<table width='100%'>"+
			"<tr><td>City</td><td>"+th.find("city").text()+"</td></tr>"+
			"<tr><td>Address</td><td>"+th.find("address").text()+"</td></tr>"+
			"<tr><td collspan='2'><a href='hotel.asp?hid="+th.find("hotel_id").text()+"'><img src='images/but_booknow_En.gif' border='0'></a></td></tr>"+
			"</table>";
			//var opt=new GInfoWindowOptions();
			//opt.maxWidth=200;
			marker.openInfoWindowHtml(txt, {maxWidth:200} );
		});
		return marker;
}

function initializeMap() {
		var init_center=new GLatLng(37.5481654230466 , 23.55515625);
		var init_zoom=6;

      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("mapContainer"));
		
		map.addControl(new GSmallMapControl());
		map.addControl(new GMapTypeControl());
       // map.setCenter(init_center, init_zoom);
      }
}


function createMap() {
	return '<div id="googlemap" style="display:none; top:0; left:0; ">' +    
		'<div id="mapheaderContainer">' +            
			'<table border="0" cellspacing="0" cellpadding="0">' +
				'<tr>' +
					'<td width="8" height="8" style="border-top:2px solid #006666; border-left:2px solid #006666; background-color:#006666; width:10px; height:10px"><img src="images/spacer.gif" width="10" height="8" /></td>' +
					'<td width="10" height="8" style="border-top:2px solid #006666; border-right:2px solid #006666; background-color:#006666; width:10px; height:10px"><img src="images/spacer.gif" width="10" height="8" /></td>' +
					'<td width="10" height="8"  align="left" valign="bottom" style="width:10px; height:10px"><img src="images/Shadow_Top_Right.png" width="10" height="8" /></td>' +
				'</tr>' +    
				'<tr>' +
					'<td colspan="2" style="border-left:2px solid #006666; border-bottom:2px solid #006666; background-color:#006666; border-right:2px solid #006666; width:auto; cursor: move">' +
						'<div style="float:right; margin-right: 10px; margin-top:-5px"><a target="_blank" href="" id="printlink" style="cursor:pointer;"><img src="images/printer1.png" alt="print" border="0" style="margin:0 5px 0 0" /></a><a href="javascript: hidemap();" style="color:#FFF; font-family:Verdana, Geneva, sans-serif; text-decoration:none; cursor:pointer; font-size:18px; font-weight:normal">x</a></div>' +
						'<h2 id="mapheader" style=" margin:0 0 10px 10px; color:#FFF"></h2>' +
						'<div id="mapContainer" style="width:640px; height:480px"></div>' +
					'</td>' +
					'<td width="10" height="10"  style="background-image:url(images/Shadow_Right.png); background-repeat:repeat-y; background-position:left;  width:10px; height:10px"><img src="images/spacer.gif" width="10" height="10" /></td>' +
				'</tr>' +    
				'<tr>' +
					'<td align="right" height="10" width="10" style="width:10px; height:10px"><img src="images/Shadow_Bottom_Left.png" width="10" height="10" /></td>' +
					'<td height="10" style=" width:632px; height:10px; background-image:url(images/Shadow_Bottom.png); background-repeat:repeat-x; background-position: top left; "><img src="images/spacer.gif" width="10" height="10" /></td>' +
					'<td width="10" height="10"  align="right" valign="top" style=" width:10px; height:10px"><img src="images/Shadow_Bottom_Right.png" width="10" height="10" /></td>' +
				'</tr>' +
			'</table>' +
		'</div>' +
	'</div>';
}