var map;
var tooltip;


function showTooltip(marker)
{
	tooltip.innerHTML = marker.tooltip;
	var point = map.getCurrentMapType().getProjection().fromLatLngToPixel(map.fromDivPixelToLatLng(new GPoint(0, 0), true), map.getZoom());
	var offset = map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(), map.getZoom());
	var anchor = marker.getIcon().iconAnchor;
	var width = marker.getIcon().iconSize.width;
	var height = tooltip.clientHeight;
	var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offset.x - point.x - anchor.x + width, offset.y - point.y - anchor.y - height));
	pos.apply(tooltip);
	tooltip.style.visibility = "visible";
}


function create_marker(point, name, detail, icon)
{
	var marker = new GMarker(point, icon);
	marker.tooltip = "<div class='tooltip'><b>" + name + "</b></div>";
	var tabs = [new GInfoWindowTab ("Hut", detail)];

	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowTabsHtml (tabs);
		tooltip.style.visibility = "hidden";
	});

	GEvent.addListener(marker, "mouseover", function() {
		showTooltip(marker);
	});
	GEvent.addListener(marker, "mouseout", function() {
		tooltip.style.visibility = "hidden";
	});

	return marker;
}


function load_hut_markers()
{
	GDownloadUrl("huts.xml", function(data) {
		var xml = GXml.parse(data);
		var markers = xml.documentElement.getElementsByTagName("hut");

		var hut_icon = new GIcon(G_DEFAULT_ICON);
		hut_icon.image = "hut.png";
		var hut_other_icon = new GIcon(G_DEFAULT_ICON);
		hut_other_icon.image = "hut_other.png";

		for(var i = 0; i < markers.length; i++) {
			try {
				var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")));
				var name = GXml.value(markers[i].getElementsByTagName("name")[0]);
				var href = GXml.value(markers[i].getElementsByTagName("href")[0]);

				detail = "<div class='popup'><span class='name'>";
				if(href != "") {
					detail += "<a href='" + href + "' title='" + name + "'>";
				}
				detail += name;
				if(href != "") {
					detail += "</a>";
				}
				detail += "</span>";

				var owner = markers[i].getAttribute("owner");
				if(owner) {
					detail += " (" + owner + ")";
				}
				detail += "<br />";

				image = GXml.value(markers[i].getElementsByTagName("image")[0]);
				if(image != "") {
					detail += "<img src='" + GXml.value(markers[i].getElementsByTagName("image")[0]) + "' alt='" + name + "' /><br />";
				}

				detail += "<p>Custodian: " + GXml.value(markers[i].getElementsByTagName("custodian")[0]) + "</p>";
				detail += "<p>Address: " + GXml.value(markers[i].getElementsByTagName("address")[0]) + "</p>";
				detail += "</div>";

				map.addOverlay(create_marker(point, name, detail, (owner ? hut_other_icon : hut_icon)));
			}
			catch(err) { }
		}
	});
}


function load()
{
	if(GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map"));
		map.setMapType(G_PHYSICAL_MAP);
		map.setCenter(new GLatLng(57.5, -5.0), 7);
		map.setUIToDefault();

		new GKeyboardHandler(map);

		tooltip = document.createElement("div");
		map.getPane(G_MAP_FLOAT_PANE).appendChild(tooltip);
		tooltip.style.visibility = "hidden";

		load_hut_markers();

		GEvent.addListener(map, "click", function(overlay, point) {
			if(!overlay) {
				map.closeInfoWindow();
			}
			var el = document.getElementById("message");
			if(el) {
				el.innerHTML = 'Location clicked - lat = ' + point.y + ' / lng = ' + point.x;
			}
		});
	}
	else {
		alert("Sorry, the Google Maps API is not compatible with this browser.");
	}
}