var map;
var resultText = "";
var markers = new Array();
var htmls = new Array();
var i=1;

function createMarker(point, title, html){
	var myIcon;
	myIcon = new GIcon();
	myIcon.image = "http://www.travelplatz.com/js/iconb/iconb"+ i + ".png";
	myIcon.iconSize = new GSize(20, 34);
	myIcon.shadow = "./js/shadow50.png";
	myIcon.shadowSize = new GSize(37, 34);
	myIcon.iconAnchor = new GLatLng(34, 10);
	myIcon.infoWindowAnchor = new GPoint(5, 5);
	
	var marker = new GMarker(point, myIcon);
	GEvent.addListener(marker, "click", function() {marker.openInfoWindowHtml(html);});
		markers[i] = marker;
		htmls[i] = html;
		resultText =  resultText + "<a href=javascript:changePlace("+ i +")>"+ i + "_" + title +"</a><br />";
	i++;
	if(i==16){i=1}
	return marker;
}

function clearMarker(){
			map.clearOverlays();
		}
function changePlace(i) {
	 markers[i].openInfoWindowHtml(htmls[i]);
}

function loadMap(url){
			var request = GXmlHttp.create();
			request.open("GET", url, true);
			request.onreadystatechange = function(){
				if(request.readyState==4){
					var xml = request.responseXML;
					var place = xml.documentElement.getElementsByTagName("items");
					
					resultText="";

					for(var i=0; i<place.length; i++){
					var lat = parseFloat(place[i].getElementsByTagName("lat")[0].firstChild.nodeValue);
					var lng = parseFloat(place[i].getElementsByTagName("lon")[0].firstChild.nodeValue);
					var point = new GLatLng(lat, lng);
					var html = "<div style='width:250px'>";
					if(place[i].getElementsByTagName("name").length != 0){
					html += "<b style='color: navy; font-size: small; font-weight: 400; font-style: normal;'>";
					var name = place[i].getElementsByTagName("name")[0].firstChild.nodeValue;
					}
					if(place[i].getElementsByTagName("url").length != 0){
					var link = place[i].getElementsByTagName("url")[0].firstChild.nodeValue;	    				html += "<a href='" + link + "' target='_blank'>" + name + "</a></b><br />";
				    }else{
						html += name;
						html += "</b><br /><br />";
					}
					if(place[i].getElementsByTagName("info").length != 0){
						html += "<font size='-1'>";
						html += place[i].getElementsByTagName("info")[0].firstChild.nodeValue;						  html += "<br/><a href=javascript:map.zoomIn()>zoomIn</a> | <a href=javascript:map.zoomOut()>zoomOut</a></font></div>";
					}else{
						html += "";
						html += "</div>";
					}
					var title = place[i].getElementsByTagName("name")[0].firstChild.nodeValue;                    var marker = createMarker(point, title, html);
					map.addOverlay(marker);
					}
					document.getElementById("map_right").innerHTML = resultText;
				}
			}
			request.send('');
		}
function cityArea(){
			var city = [new GLatLng(51.518263687459694, -0.11394023895263672), new GLatLng(51.515900258184246, -0.11188030242919922), new GLatLng(51.51380378042896, -0.11108636856079102), new GLatLng(51.51349664501128, -0.11280298233032227), new GLatLng(51.51286901402258, -0.11205196380615234), new GLatLng(51.51261528840246, -0.11286735534667969), new GLatLng(51.51094600566976, -0.11188030242919922), new GLatLng(51.50959718054336, -0.11188030242919922), new GLatLng(51.50955711581998, -0.10471343994140625), new GLatLng(51.50822160488022, -0.10475635528564453), new GLatLng(51.50819489426212, -0.10404825210571289), new GLatLng(51.509530405984826, -0.10409116744995117), new GLatLng(51.50957047073169, -0.09799718856811523), new GLatLng(51.50780758853995, -0.08806228637695312), new GLatLng(51.50660558430045, -0.0884699821472168), new GLatLng(51.506525449557, -0.08795499801635742), new GLatLng(51.50778087767913, -0.08752584457397461), new GLatLng(51.506752497630714, -0.07971525192260742), new GLatLng(51.509423566487634, -0.07797718048095703), new GLatLng(51.50963724523147, -0.07847070693969727), new GLatLng(51.51019814716589, -0.0776982307434082), new GLatLng(51.51019814716589, -0.07677555084228516), new GLatLng(51.50966395500398, -0.07630348205566406), new GLatLng(51.50995776146813, -0.07435083389282227), new GLatLng(51.510164760339265, -0.072784423828125), new GLatLng(51.511326607516, -0.0728917121887207), new GLatLng(51.51320286136969, -0.0732886791229248), new GLatLng(51.51413762092547, -0.07361054420471191), new GLatLng(51.51625411274621, -0.07641077041625977), new GLatLng(51.51664802308177, -0.07689356803894043), new GLatLng(51.51850402932964, -0.07814884185791016), new GLatLng(51.51897803318922, -0.07810592651367188), new GLatLng(51.51890459629448, -0.07937192916870117), new GLatLng(51.52147481715572, -0.07854580879211426), new GLatLng(51.52197549265049, -0.08106708526611328), new GLatLng(51.520907378273876, -0.08154988288879395), new GLatLng(51.51975912737815, -0.08313775062561035), new GLatLng(51.52033993232171, -0.08526206016540527
), new GLatLng(51.51879777878167, -0.08620619773864746), new GLatLng(51.51995940578159, -0.09000420570373535), new GLatLng(51.52070042821629, -0.08969306945800781), new GLatLng(51.52101419083889, -0.09238600730895996), new GLatLng(51.52142808716203, -0.09250402450561523), new GLatLng(51.5212945726301, -0.09333014488220215), new GLatLng(51.52156827699928, -0.09341597557067871), new GLatLng(51.52142808716203, -0.09431719779968262), new GLatLng(51.523076959363024, -0.09512186050415039), new GLatLng(51.52286334365878, -0.09600162506103516), new GLatLng(51.52349083693842, -0.09628057479858398), new GLatLng(51.52285666815187, -0.09793281555175781), new GLatLng(51.522182436913866, -0.09747147560119629), new GLatLng(51.520720455682316, -0.09749293327331543), new GLatLng(51.51997275764384, -0.10089397430419922), new GLatLng(51.517789676165556, -0.1076960563659668), new GLatLng(51.51827036363987, -0.11258840560913086), new GLatLng(51.518263687459694, -0.11394023895263672)];
		var polygon1 = new GPolygon(city, "#ff0000", 3, 1, "#ff0000", 0.3);
		map.addOverlay(polygon1);
		}
function load(){
	if (GBrowserIsCompatible()) {
		var physWithLabels = [ G_PHYSICAL_MAP.getTileLayers()[0], G_HYBRID_MAP.getTileLayers()[1] ];
var physWithLabelsMap = new GMapType(physWithLabels, G_PHYSICAL_MAP.getProjection(), "Hybrid Terrain");
		map = new GMap2(document.getElementById("map"));
		map.addMapType(G_PHYSICAL_MAP);
		map.addMapType(physWithLabelsMap);
		map.setCenter(new GLatLng(51.51386387189887, -0.09352326393127441), 14, G_SATELLITE_MAP);
		var mapControl = new GHierarchicalMapTypeControl();
		mapControl.clearRelationships();
		mapControl.addRelationship(G_SATELLITE_MAP, G_HYBRID_MAP, "Labels", false);
		mapControl.addRelationship(G_PHYSICAL_MAP, physWithLabelsMap, "Labels", false);
		map.addControl(mapControl);
		map.addControl(new GLargeMapControl());
		map.addControl(new GScaleControl());
	}
}
onload=load;
onunload=GUnload;
