var map = null; 
var mgr = null;
var selectedMarker = null;

function initMap()
{
	if (GBrowserIsCompatible()) 
	{
		setTextToInnerHTML('map',"");
		map = new GMap2(document.getElementById("map"));
	 	map.addControl(new GLargeMapControl());
	   	//map.addControl(new GOverviewMapControl());
		map.addControl(new CloseControl());
	   	map.enableDoubleClickZoom();
		map.enableScrollWheelZoom();
	}
}

function showDealers(klantnummer)
{
	// is voor selects in IE6
	hide('city');
	// is voor selects in IE6
	hide('postalcode');
	// maak de kaart zichtbaar
	show('map');
	// centreer de kaart
	centerMap(klantnummer);
	// zet alle markers neer
	setupMarkers(klantnummer); 
	// toon gegevens van geselecteerde dealer
	showInitialInfoWindow();
}

function showInitialInfoWindow()
{
	if (selectedMarker != null)
	{
		selectedMarker.initialize(map)
		GEvent.trigger(selectedMarker, "click");
	}
}

function centerMap(myKlantnummer) 
{
	for (var myCounter = 0; myCounter < myDealers.length; myCounter++)
	{
		if (myDealers[myCounter].klantnummer == myKlantnummer)
		{
			map.setCenter(new GLatLng(myDealers[myCounter].lat,myDealers[myCounter].lng),12);
		}
	}
 }
 
function createMarker(point, myDealer, selected) 
{
	var marker = new GMarker(point);
	GEvent.addListener(marker, "click", function() 
	{
		marker.openInfoWindowHtml(myDealer.name.replace("*","'") + "<br/>" + myDealer.address.replace("*","'") + "<br/>" + myDealer.postalcode + " " + myDealer.city.replace("*","'") + "<br/><b>" + myDealer.type + "</b>");
	});
	if (selected)
	{
		selectedMarker = marker;
	}
	return marker;
}

function getMarkers(myKlantnummer) { 
	var batch = []; 
	var selected;
	for (var myCounter = 0; myCounter < myDealers.length; myCounter++)
	{
		{
			var point = new GLatLng(myDealers[myCounter].lat,myDealers[myCounter].lng);
			if (myDealers[myCounter].klantnummer == myKlantnummer)
			{ selected = true; }
			else
			{ selected = false; }
			var myMarker = createMarker(point, myDealers[myCounter], selected);
			batch.push(myMarker);
		}
	}
	return batch;
}

function setupMarkers(klantnummer) {
	mgr = new GMarkerManager(map);
	mgr.addMarkers(getMarkers(klantnummer), 3);
	mgr.refresh();
}

function CloseControl() {
}

CloseControl.prototype = new GControl();

// Creates a one DIV for each of the buttons and places them in a container
// DIV which is returned as our control element. We add the control to
// to the map container and return the element for the map class to
// position properly.
CloseControl.prototype.initialize = function(map) 
{
	var container = document.createElement("div");
	
	var closeDiv = document.createElement("div");
	this.setButtonStyle_(closeDiv);
	container.appendChild(closeDiv);
	closeDiv.appendChild(document.createTextNode("Sluiten"));
	GEvent.addDomListener(closeDiv, "click", function() 
	{
		hide('map');
		show('city');
		show('postalcode');
	});
	
	map.getContainer().appendChild(container);
	return container;
}

CloseControl.prototype.getDefaultPosition = function() 
{
	return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(0, 0));
}

// Sets the proper CSS for the given button element.
CloseControl.prototype.setButtonStyle_ = function(button) 
{
	button.style.color = "white";
	button.style.backgroundColor = "#527994";
	button.style.fontFamily = "Verdana, Geneva, Arial, Helvetica, sans-serif";
	button.style.fontSize = "12px";
	button.style.fontWeight = "bold";
	button.style.height = "20px";
	button.style.paddingTop = "5px";
	button.style.paddingRight = "5px";
	button.style.marginTop = "0px";
	button.style.textAlign = "right";
	button.style.width = "696px";
	button.style.cursor = "pointer";
	button.style.textDecoration = "none";
}