// JavaScript Document
function initializeMap() {
		if( !GBrowserIsCompatible() ) {
			alert( 'Your browser is not capable of handling Google Maps API!' );
			return;
		} else {
			var map = new GMap2( document.getElementById("map") );
			map.setCenter( new GLatLng(37.0902400, -95.7128910), 4, G_NORMAL_MAP );
			map.setUIToDefault();
			
			var baseIcon = new GIcon();
			baseIcon.shadow = "http://www.vianetwebdesign.com/clientmap/markers/shade.png";
			baseIcon.iconSize = new GSize(16, 27);
			baseIcon.shadowSize = new GSize(29, 27);
			baseIcon.iconAnchor = new GPoint(7, 27);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
			
			function createMarker( point, op ) {				
				var clienticon = new GIcon(baseIcon);				
				clienticon.image = "http://www.vianetwebdesign.com/clientmap/markers/markericon.png";
	  
				// Set up our GMarkerOptions object
				markerOptions = { icon:clienticon };
				var marker = new GMarker( point, markerOptions );
	  
				GEvent.addListener(marker, "mouseover", function() {
					var html = "<span style='font-family:Tahoma; font-size:11px;'>Client Name : " + op["client"] + 
					           "<br/>Address : " + op["address"] + "<br/> Website : ";
					
					if(op["website"] != 'none') 
					   html = html + "<a href='http://" + op["website"] + "'>http://" + op["website"] + "</a></span>";
					else
					   html = html + "</span>";
					
					marker.openInfoWindowHtml(html);
				});
				
				GEvent.addListener(marker, "click", function() {
					map.setCenter( new GLatLng( op["lat"], op["lng"] ), 10, G_NORMAL_MAP );										 
				});
				
				return marker;
			}
			
			function getXMLObject() {
				var xmlDoc;
				
				try {
					//for Microsoft IE.
					xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
				} catch(e) {
					try {
						//for Firefox, Safari, Opera browsers
						xmlDoc = document.implementation.createDocument("","",null);
					} catch(e) {
						alert(e.message);
					}
				}
				return xmlDoc;
			}
						
			var xml = getXMLObject();
			xml.async = false;
			xml.load("clientmap/clientdata/client.xml");
			
			var clientTag = xml.getElementsByTagName("client");
			
			for( i = 0; i < clientTag.length; i++ ) {
				 var client = clientTag[i].getElementsByTagName("name")[0].childNodes[0].nodeValue;
				 var website = clientTag[i].getElementsByTagName("website")[0].childNodes[0].nodeValue;
				 var lat = parseFloat(clientTag[i].getElementsByTagName("latitude")[0].childNodes[0].nodeValue);
				 var lng = parseFloat(clientTag[i].getElementsByTagName("longtitude")[0].childNodes[0].nodeValue);	
				 var address = clientTag[i].getElementsByTagName("address")[0].childNodes[0].nodeValue;
				 
				 //create a JSON string for marker information.				 
				 var opt = { client:client, website:website, lat:lat, lng:lng, address:address };				 
				 
				 var latlng = new GLatLng( lat, lng );
				 map.addOverlay( createMarker( latlng, opt ) );
			}
		}		
	}