    var map = null;
    var geocoder = null;
	var xmlDoc = null;

    function initialize() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map_canvas")); //normal map (not satellite)
		map.addControl(new GLargeMapControl3D()); //shows the map pan and zoom controls
        geocoder = new GClientGeocoder(); //GeoCoder for addresses insead of coordinates

		buildMap(); //place dealers on the map
		
		//starting point (centre of SA)                                      _zoom level
		map.setCenter(new GLatLng(-28.07198, 24.169922), 4);
      }
    }
	
	function connectXML()
	{
		//open dealers.xml
		if (window.XMLHttpRequest)
  		{
			xhttp=new XMLHttpRequest();
		}
		else // Internet Explorer 5/6
  		{
			xhttp=new ActiveXObject("Microsoft.XMLHTTP");
		}
		xhttp.open("GET","include/dealers.xml",false);
		xhttp.send("");
		xmlDoc=xhttp.responseXML;
	}
	
	//Diesel Electric Dealer Map Builder Function
	function buildMap()
	{
		connectXML();
		
		//create a marker for each dealer in the xml file
		var x = xmlDoc.getElementsByTagName("province");
		for (i=0;i<x.length;i++) //cycle through the main tags with the name "province"
		{
			//build province drop down menu
			provinceName = xmlDoc.getElementsByTagName("province")[i].getAttribute("name"); //get the name of the province
			provinceShort = xmlDoc.getElementsByTagName("province")[i].getAttribute("short");  //get the short name of the province
			document.getElementById("province-selector").options[i+1] = new Option(provinceName, provinceShort); //create a new option in the "province-selector" drop down

			var y = x[i].getElementsByTagName("dealer"); //get all the tags with the name dealer within the current province
			for (j=0;j<y.length;j++) //cycle through the sub tags with the name "dealer"
			{
				var name = y[j].getElementsByTagName("name")[0].childNodes[0].nodeValue;
				var hometown = y[j].getElementsByTagName("hometown")[0].childNodes[0].nodeValue;
				var gmapsaddress = y[j].getElementsByTagName("gmapsaddress")[0].childNodes[0].nodeValue;
				var z= y[j].getElementsByTagName("gmapscoords");
					latitude = z[0].getElementsByTagName("latitude")[0].childNodes[0].nodeValue; //child node of gmapscoords
					longitude = z[0].getElementsByTagName("longitude")[0].childNodes[0].nodeValue; //child node of gmapscoords
				var tel = y[j].getElementsByTagName("tel")[0].childNodes[0].nodeValue;
				var fax = y[j].getElementsByTagName("fax")[0].childNodes[0].nodeValue;
				var skype = y[j].getElementsByTagName("skype")[0].childNodes[0].nodeValue;
				var email = y[j].getElementsByTagName("email")[0].childNodes[0].nodeValue;
				var address = y[j].getElementsByTagName("address")[0].childNodes[0].nodeValue;
				var othertext = y[j].getElementsByTagName("othertext")[0].childNodes[0].nodeValue;
				
				//build dealer drop down menu
				document.getElementById("dealer-select-"+provinceShort).options[j+1] = new Option(hometown, hometown);
				
				//check if located via gmapsaddress or gmapscoords
				if (gmapsaddress != "empty")                                                    
					mapAddress(name,gmapsaddress,tel,fax,skype,email,address,othertext); //use mapAddress()
				else																						
					mapCoords(name,latitude,longitude,tel,fax,skype,email,address,othertext); //use mapCoords()
			}
		}
	}
	
	//for use when there is a google maps address
    function mapAddress(name, gmapsaddress, tel, fax, skype, email, address, othertext, zoom) 
	{
		if (geocoder)
		{
			geocoder.getLatLng(
				gmapsaddress,
				function(point)
				{
					if (!point)
					{
						//alert(gmapsaddress + " not found");
					}
					else
					{
						var marker = new GMarker(point);
						GEvent.addListener(marker, "click", function() { //check for clicks
							//create a box with all the details
							html = "<b>" + name + "</b>";
							if (tel != "empty")
								html = html + "<br><br>Telephone: " + tel;
							if (fax != "empty")
								html = html + "<br>Fax: " + fax;
							if (skype != "empty")
								html = html + "<br><img src='images/skype-logo.png' align='left' />" + skype + "<br>";
							if (email != "empty")
								html = html + "<br>Email: " + email;								
							if (address != "empty")
								html = html + "<br><br>" + address;
							if (othertext !="empty")
								html = html + "<br><br>" + othertext;							
							marker.openInfoWindowHtml(html);
							map.setCenter(new GLatLng(-28.07198, 24.169922), 14); //zooms into the area
						});
						map.addOverlay(marker);
					}
				}
			);
		}
	}
	
	//for use when there is a google maps coordinates
    function mapCoords(name, latitude, longitude, tel, fax, skype, email, address, othertext, zoom) 
	{
		if (geocoder)
		{
			var point = new GLatLng(latitude, longitude);
			var marker = new GMarker(point);
				GEvent.addListener(marker, "click", function() { //check for clicks
					//create a box with all the details
					html = "<b>" + name + "</b>";
					if (tel != "empty")
						html = html + "<br><br>Telephone: " + tel;
					if (fax != "empty")
						html = html + "<br>Fax: " + fax;
					if (skype != "empty")
						html = html + "<br><img src='images/skype-logo.png' align='left' />" + skype + "<br>";
					if (email != "empty")
						html = html + "<br>Email: " + email;								
					if (address != "empty")
						html = html + "<br><br>" + address;
					if (othertext !="empty")
						html = html + "<br><br>" + othertext;							
					marker.openInfoWindowHtml(html);
					map.setCenter(new GLatLng(latitude, longitude), 14); //zooms into the area
				});
			map.addOverlay(marker);
		}
	}
	
	function provinceZoom(provinceCode)
	{
		switch(provinceCode)
		{
			case "...":
				map.setCenter(new GLatLng(-28.07198, 24.169922), 4);
				showDealerList(provinceCode);
				break;
			case "ec":
				map.setCenter(new GLatLng(-31.970804, 26.5979), 6);
				showDealerList(provinceCode);
				break;
			case "fs":
				map.setCenter(new GLatLng(-28.642389, 27.092285), 6);
				showDealerList(provinceCode);
				break;
			case "gt":
				map.setCenter(new GLatLng(-26.046913, 28.130493), 7);
				showDealerList(provinceCode);
				break;
			case "kzn":
				map.setCenter(new GLatLng(-28.806174, 30.717773), 6);
				showDealerList(provinceCode);
				break;
			case "lmp":
				map.setCenter(new GLatLng(-23.885838, 29.20166), 6);
				showDealerList(provinceCode);
				break;
			case "mpl":
				map.setCenter(new GLatLng(-25.780107, 30.563965), 6);
				showDealerList(provinceCode);
				break;
			case "nw":
				map.setCenter(new GLatLng(-26.608174, 25.279541), 6);
				showDealerList(provinceCode);
				break;
			case "nc":
				map.setCenter(new GLatLng(-29.897806, 21.577148), 5);
				showDealerList(provinceCode);
				break;
			case "wc":
				map.setCenter(new GLatLng(-32.648626, 20.983887), 6);
				showDealerList(provinceCode);
				break;
		}
	}
	
	
	function showDealerOnMap(recievedHometown)
	{
		var x = xmlDoc.getElementsByTagName("province"); //open the province tag
		for (i=0;i<x.length;i++) //cycle through the main tags with the name "province"
		{
			//build province drop down menu
			provinceName = xmlDoc.getElementsByTagName("province")[i].getAttribute("name"); //get the name of the province
			
			var y = x[i].getElementsByTagName("dealer"); //get all the tags with the name dealer within the current province
			for (j=0;j<y.length;j++) //cycle through the sub tags with the name "dealer"
			{
				var hometown = y[j].getElementsByTagName("hometown")[0].childNodes[0].nodeValue;
				if (recievedHometown == hometown)
				{
					var name = y[j].getElementsByTagName("name")[0].childNodes[0].nodeValue;
					var gmapsaddress = y[j].getElementsByTagName("gmapsaddress")[0].childNodes[0].nodeValue;
					var z= y[j].getElementsByTagName("gmapscoords");
						latitude = z[0].getElementsByTagName("latitude")[0].childNodes[0].nodeValue; //child node of gmapscoords
						longitude = z[0].getElementsByTagName("longitude")[0].childNodes[0].nodeValue; //child node of gmapscoords
					var tel = y[j].getElementsByTagName("tel")[0].childNodes[0].nodeValue;
					var fax = y[j].getElementsByTagName("fax")[0].childNodes[0].nodeValue;
					var skype = y[j].getElementsByTagName("skype")[0].childNodes[0].nodeValue;
					var email = y[j].getElementsByTagName("email")[0].childNodes[0].nodeValue;
					var address = y[j].getElementsByTagName("address")[0].childNodes[0].nodeValue;
					var othertext = y[j].getElementsByTagName("othertext")[0].childNodes[0].nodeValue;
				}
			}
		}
		
		//open the selected dealer
		//check if located via gmapsaddress or gmapscoords
		if (gmapsaddress != "empty")                                                   //  _zoom
			boxAddress(name,gmapsaddress,tel,fax,skype,email,address,othertext); //use boxAddress()
		else                                                                                          //  _zoom
			boxCoords(name,latitude,longitude,tel,fax,skype,email,address,othertext); //use boxCoords()
	}
	
	//for use when there is a google maps address - only creates a box and zooms in rather than a marker
    function boxAddress(name, gmapsaddress, tel, fax, skype, email, address, othertext) 
	{
		if (geocoder)
		{
			geocoder.getLatLng(
				gmapsaddress,
				function(point)
				{
					if (!point)
					{
						//alert(gmapsaddress + " not found");
					}
					else
					{
						//create a box with all the details
						html = "<b>" + name + "</b>";
						if (tel != "empty")
							html = html + "<br><br>Telephone: " + tel;
						if (fax != "empty")
							html = html + "<br>Fax: " + fax;
						if (skype != "empty")
							html = html + "<br><img src='images/skype-logo.png' align='left' />" + skype + "<br>";
						if (email != "empty")
							html = html + "<br>Email: " + email;								
						if (address != "empty")
							html = html + "<br><br>" + address;
						if (othertext !="empty")
							html = html + "<br><br>" + othertext;							
						//zoom in and display box
						map.setCenter(point, 14); //zooms into the area
						map.openInfoWindowHtml(point,html); //opens an html info window
					}
				}
			);
		}
	}
	
	//for use when there is a google maps coordinates - only creates a box and zooms in rather than a marker
    function boxCoords(name, latitude, longitude, tel, fax, skype, email, address, othertext) 
	{
		if (geocoder)
		{
			var point = new GLatLng(latitude, longitude);
			var marker = new GMarker(point);
			//create a box with all the details
			html = "<b>" + name + "</b>";
			if (tel != "empty")
				html = html + "<br><br>Telephone: " + tel;
			if (fax != "empty")
				html = html + "<br>Fax: " + fax;
			if (skype != "empty")
				html = html + "<br><img src='images/skype-logo.png' align='left' />" + skype + "<br>";
			if (email != "empty")
				html = html + "<br>Email: " + email;								
			if (address != "empty")
				html = html + "<br><br>" + address;
			if (othertext !="empty")
				html = html + "<br><br>" + othertext;							
			//zoom in and display box
			map.setCenter(point, 14); //zooms into the area
			map.openInfoWindowHtml(point,html); //opens an html info window
		}
	}

	
