function Markers(color){
	map.getInfoWindow().hide() 

	if (document.getElementById(color).checked == false) {
		for (var i = 0; i < gmarkers.length; i++) {
			if (gmarkers[i].type == color)  {
				map.removeOverlay(gmarkers[i]);
			}
		}
	} 
	else { 
		for (var i = 0; i < gmarkers.length; i++) {
			if (gmarkers[i].type == color)  {
				map.addOverlay(gmarkers[i]);
			}
		}
	}
}

GMap.prototype.centerAndZoomOnBounds = function(bounds) {
	var center_lat = (bounds.getNorthEast().lat() + bounds.getSouthWest().lat()) / 2.0;
	var center_lng = (bounds.getNorthEast().lng() + bounds.getSouthWest().lng()) / 2.0;
	var center = new GLatLng(center_lat,center_lng)

	map.setCenter(center, map.getBoundsZoomLevel(bounds));
}

var gmarkers=[];
var map;
var request;
var bounds = new GLatLngBounds();

var baseIcon = new GIcon();
baseIcon.image = "/images/maps/icon_red.png";
baseIcon.shadow = "/images/maps/shadow.png";
baseIcon.iconSize = new GSize(12, 20);
baseIcon.shadowSize = new GSize(22, 20);
baseIcon.iconAnchor = new GPoint(6, 20);
baseIcon.infoWindowAnchor = new GPoint(5, 1);
baseIcon.imageMap = [4,0,0,4,0,7,3,11,4,19,7,19,8,11,11,7,11,4,7,0]; 
baseIcon.transparent = "/images/maps/transparent.png";

var icons=[];

function customIcon() {
	var iconColor = 'red';
	var icon = new GIcon(baseIcon);
	icon.image = "/images/maps/icon_red.png";
	icons[iconColor] = icon;

	return icons[iconColor];
}

function addMarker(lat, lng, name, location, url, image) {
	var point = new GLatLng(lat, lng);
	var icon = customIcon();

	bounds.extend(point);
	var marker = new GMarker(point, icon);

	gmarkers.push(marker);
//	marker.type = iconStr; 

	GEvent.addListener(marker, "click", function () {
		map.setCenter(new GLatLng(lat, lng), 5);

		if (!image) {
			var html = '<div class=\"random_text\"><a href=\"/billiard-rooms/' + url + '\">' + name + '</a><br />' + location + '<br /><a href=\"/billiard-rooms/' + url + '\">More information</a> &raquo;</div>';
		}
		else {
			var html = '<div class=\"random_image\"><a href=\"/billiard-rooms/' + url + '\"><img src=\"/images/billiardroom/thumbnail/' + image + '\" width=\"61\" height=\"61\" alt=\"\" /></a></div><div class=\"random_text\"><a href=\"/billiard-rooms/' + url + '\">' + name + '</a><br />' + location + '<br /><a href=\"/billiard-rooms/' + url + '\">More information</a> &raquo;</div>';
		}

		marker.openInfoWindowHtml(html);
	});

	map.addOverlay(marker);
}

function processXML() { 
	if (request.readyState == 4) {
		var xmlDoc = request.responseXML;
		
		markers = xmlDoc.documentElement.getElementsByTagName("marker");

		for (var i = 0; i < markers.length; i++) {
			addMarker(parseFloat(markers[i].getAttribute("lat")),parseFloat(markers[i].getAttribute("lng")),markers[i].getAttribute("name"),markers[i].getAttribute("location"),markers[i].getAttribute("url"),markers[i].getAttribute("image"));
		}
	
		map.centerAndZoomOnBounds(bounds);
	}
} 
				  
function init() {
	if (GBrowserIsCompatible()) {
		map = new GMap(document.getElementById("map"));

		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		
		request = GXmlHttp.create(); 
		request.open("GET", "/api/map_markers.php", true); 
		request.onreadystatechange = processXML;
		request.send(null);
	}
}

function goToMarker(lat, lng, name, location, url, image) {
	if (!image) {
		var html = '<div class=\"random_text\"><a href=\"/billiard-rooms/' + url + '\">' + name + '</a><br />' + location + '<br /><a href=\"/billiard-rooms/' + url + '\">More information</a> &raquo;</div>';
	}
	else {
		var html = '<div class=\"random_image\"><a href=\"/billiard-rooms/' + url + '\"><img src=\"/images/billiardroom/thumbnail/' + image + '\" width=\"61\" height=\"61\" alt=\"\" /></a></div><div class=\"random_text\"><a href=\"/billiard-rooms/' + url + '\">' + name + '</a><br />' + location + '<br /><a href=\"/billiard-rooms/' + url + '\">More information</a> &raquo;</div>';
	}
	
	map.setCenter(new GLatLng(lat, lng), 5);
	map.openInfoWindowHtml(new GLatLng(lat, lng), html);
}
			
window.onload = init;
window.onunload = GUnload;