//A1 29/12/08 JOE, Modify Icon image
		//Global variables. 
         var map; //GMAP control
         var mapSmall; //GMAP control - providerdetails2 page
		 var markers = []; //markers array  
		 var baseIcon; //normal icon for marker
		 var markerImageURL = "http://carservice.com.au:8080/images/pointers/carservice_pointer.gif"; 
		 var markerImageHLURL = "http://carservice.com.au:8080/images/pointers/carservice_pointer_hl.gif"; 

		var mapOverview; //mapOverview control (right bottom corner)
		var bTableOver = false; //boolean to prevent scrolling provider list when list item is highlighted.
		
		//make map global
		function getMap(){
		    return map
		}
		
		//initiate MAP, add controls, center
		function loadMap(lat, lng, zoom) {
			//alert('load map');
			//if (map == null){alert('map is null')}else{alert('map is not null')}
			var ucMap = document.getElementById('divGmap');
			if (GBrowserIsCompatible() && (ucMap != null) && (map == null)) {
				
				//Create GMap element.
				map = new GMap2(ucMap);
				
				//map.addControl(new GLargeMapControl());
                var largeMapControl = new GLargeMapControl();
                var topLeft = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10,20));
                //var bottomRight = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,10));
                map.addControl(largeMapControl, topLeft);
				
				//map.addControl(new GMapTypeControl(1));
				map.addControl(new GScaleControl(256));
				
				//these 2 lines caused error 'this.$e.width is null or not an object'. Solution: http://groups.google.nl/group/Google-Maps-API/browse_thread/thread/9ea875fb01895189
				//mapOverview = new GOverviewMapControl(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(0, 0));
				//map.addControl(mapOverview);				
				window.setTimeout("mapOverview = new GOverviewMapControl(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(0, 0));map.addControl(mapOverview);",700); 
				
				//new GKeyboardHandler(map);
				map.enableContinuousZoom();
				map.enableDoubleClickZoom();			
				
				map.setCenter(new GLatLng(lat, lng), zoom);				
				
			} //If GBrowserIsCompatible
			//if (map == null){alert('map is null')}else{alert('map is not null')}
		} //loadMap function	

		//initiate MAP, add controls, center for providerdetails2 page
		function loadMapSmall(lat, lng, zoom) {
			//alert('load map');
			//if (map == null){alert('map is null')}else{alert('map is not null')}
			var div = document.getElementById('divGmapSmall');
			if (GBrowserIsCompatible() && div && !mapSmall) {
				
				//Create GMap element.
				mapSmall = new GMap2(div);
				
				
                if (window.attachEvent){
	                window.attachEvent("onresize",function(){mapSmall.checkResize()} );
	                window.attachEvent("onload",function(){mapSmall.checkResize()} );
                } else if(window.addEventListener){
	                window.addEventListener("resize",function() {mapSmall.checkResize()}, false);
	                window.addEventListener("load",function() {mapSmall.checkResize()}, false);
                }				
				
				
				mapSmall.addControl(new GLargeMapControl());
				//mapSmall.addControl(new GScaleControl(256));
				//mapOverview = new GOverviewMapControl(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(0, 0));
				//mapSmall.addControl(mapOverview);
				mapSmall.enableContinuousZoom();
				mapSmall.enableDoubleClickZoom();			
				
				mapSmall.setCenter(new GLatLng(lat, lng), zoom);
			} 
		} //loadMapSmall function

		function getBaseIcon(){
			// Create a base icon for all of our markers that specifies the
			// shadow, icon dimensions, etc.
			baseIcon = new GIcon();
			baseIcon.iconSize = new GSize(24, 37);
			baseIcon.iconAnchor = new GPoint(9, 34);
			baseIcon.infoWindowAnchor = new GPoint(9, 2);
			//baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
			//baseIcon.shadowSize = new GSize(37, 34);
			//baseIcon.infoShadowAnchor = new GPoint(18, 25);	
			return baseIcon;
		} //getBaseIcon

		// Creates a marker at the given point, add listeners.
		var lastProvId; //id of the provider shown in infoWindow. Use to change background of related prov in the list.
		function loadMarker(lat, lng, markerNumber, markerIconImg, markerIconImgHL, provID, htmlText, zoom, showOnStart) {
			//alert('markerIconImg: ' + markerIconImg);
			//alert('markerIconImgHL: ' + markerIconImgHL);
			//Conert to coord
			var latlng = new GLatLng(lat, lng);
			// Set up our GMarkerOptions object
			var markerIcon = new GIcon(getBaseIcon());
			//A1, add icon image variable 
			markerIcon.image = markerIconImg;//markerImageURL.replace("#",markerIconImg);

			markerOptions = { icon: markerIcon};
			var marker = new GMarker(latlng, markerOptions);
			
			//Set up marker value.
			marker.value = provID; //markerNumber;

			//************* EVENT LISTENERS **********************//
			
			//click event
			GEvent.addListener(marker,"click", function() {
				var coord = markers[markerNumber].getLatLng();
				
				var tbl = document.getElementById('tbl' + provID); //get list element and check its existense
				if (tbl != null){
				    tbl.style.backgroundColor = '#b2dafb'; //change bg color of list item to HL
                }
				//map.openInfoWindowHtml(latlng, htmlText);
				
				map.openInfoWindowHtml(latlng,htmlText,{buttons:{close:{height:-3,width:30}}}); 
				
				
				lastProvId = provID;
				
                makeWebRequest(location.protocol + '//' + location.host + '/car-service-log.aspx?provid=' + lastProvId);
                //makeWebRequest('~/car-service-log.aspx?&provid=' + lastProvId);

			});
			
			//Change background color of prov in the list when infoWindow is closed.
			GEvent.addListener(map,"infowindowclose", function() {
			    if (lastProvId != null){
				    var tbl = document.getElementById('tbl' + lastProvId); //get list element and check its existense
				    if (tbl != null){
				        tbl.style.backgroundColor = 'White'; //change bg color of list item to HL
                    }
			        lastProvId = null;
			    }
			});
			
			//mouseover event
			GEvent.addListener(marker,'mouseover',function(){
                //A1
				//marker.setImage(markerImageHLURL.replace("#",markerIconImg)); //change image to highlited version
				marker.setImage(markerIconImgHL); //change image to highlited version
				var tbl = document.getElementById('tbl' + provID); //get list element and check its existense
				if (tbl != null){
				     //change bg color of list item to HL
				    if (!(tbl.style.backgroundColor == '#b2dafb' || tbl.style.backgroundColor == 'rgb(178, 218, 251)')){tbl.style.backgroundColor = '#febaba';}
    				
				    //change icon in the prov list to highlited version
				    var icon = document.getElementById("btnIcon" + markerNumber);
				    //A1
				    //icon.src = markerImageHLURL.replace("#",markerIconImg);
				    icon.src = markerIconImgHL;//markerImageURL.replace("#",markerIconImg);
				    
				    //scroll list of service centres
				    var panel = document.getElementById("ctl00_ContentPlaceHolder1_pnlProviderList");
				    if (panel != null && bTableOver == false){var scrollTop = 71 * (markerNumber - 1);panel.scrollTop = scrollTop;};
				}
			});			
			
			//mouseout event
			GEvent.addListener(marker,'mouseout',function(){
			    //A1
				//marker.setImage(markerImageURL.replace("#",markerIconImg)); //change image back to normal version
				marker.setImage(markerIconImg); //change image back to normal version
				var tbl = document.getElementById('tbl' + provID); //get list element and check its existense
				if (tbl != null){
				     ////change back bg color of list item
                    //rgb(178, 218, 251) - for FF
				    if (!(tbl.style.backgroundColor == '#b2dafb' || tbl.style.backgroundColor == 'rgb(178, 218, 251)')){tbl.style.backgroundColor = 'White';}

				    //change icon in the prov list to normal version
				    var icon = document.getElementById("btnIcon" + markerNumber);
				    //A1
				    //icon.src = markerImageURL.replace("#",markerIconImg);
				    icon.src = markerIconImg;
				}    
			});			
			//************* EVENT LISTENERS(END) **********************//
			
			markers[markerNumber] = marker; //store marker in global collection.
			
			map.addOverlay(marker); //add marker to the map
			
			//show info window for the provider.
			//if (showOnStart == true){
			//    map.openInfoWindowHtml(latlng, htmlText);
			//}
			
		} //loadMarker function

		// Creates a marker at the given point, add listeners - for providerdetails2 page.
		function loadMarkerSmall(lat, lng, markerNumber, markerIconImg, markerIconImgHL, provID, htmlText, zoom, showOnStart, addEvents) {
			//alert('load marker: ' + htmlText);
			//Conert to coord
			var latlng = new GLatLng(lat, lng);
			// Set up our GMarkerOptions object
			var markerIcon = new GIcon(getBaseIcon());
			//A1, add icon image variable 
			markerIcon.image = markerIconImg;
			markerOptions = {icon: markerIcon};
			var marker = new GMarker(latlng, markerOptions);
			
			//Set up marker value.
			marker.value = provID; //markerNumber;

			var icon = document.getElementById("btnIcon" + markerNumber);	
			if (icon) {icon.src = markerIconImg;icon.style.display='block';}		    


			//************* EVENT LISTENERS **********************//

			//click event
			if (addEvents==true){
			    GEvent.addListener(marker,"click", function() {
                    mapSmall.openInfoWindowHtml(latlng,htmlText,{buttons:{close:{height:10,width:13}}}); 
			    });	
			    
			    
				var tr = document.getElementById('tr' + provID); //get list element 
				var trb = document.getElementById('trb' + provID); //get list element
				var tbl; 
			    
			    //mouseover event
			    GEvent.addListener(marker,'mouseover',function(){
				    //change image to highlited version
				    marker.setImage(markerIconImgHL); //change image to highlited version
				    if (tr){
				        var tbl = tr.parentNode.parentNode.id; //get parent object id
				        if(tbl != null && tbl != '' && tbl == 'tblSEOSponsor')
                        {
				         ////change back bg color of list item
        				    //tr.style.backgroundColor = '#CCFB5D'; trb.style.backgroundColor = '#CCFB5D';                        
                        }
   				        else
   				        {
				         ////change back bg color of list item
        				    tr.style.backgroundColor = '#f1f1f1'; trb.style.backgroundColor = '#f1f1f1';
        				}
        				
				        //change icon in the prov list to highlited version
				        if (icon) icon.src = markerIconImgHL;
				    }
			    });			
    			
			    //mouseout event
			    GEvent.addListener(marker,'mouseout',function(){
				    marker.setImage(markerIconImg); //change image back to normal version
				    if (tr){
				    	var tbl = tr.parentNode.parentNode.id; //get parent object id
				    	if(tbl != null && tbl != '' && tbl == 'tblSEOSponsor')
                        {
				         ////change back bg color of list item
       				        //tr.style.backgroundColor = '#CCE5CE'; trb.style.backgroundColor = '#CCE5CE';                        
                        }
   				        else
   				        {
        				    tr.style.backgroundColor = '#ffffff';trb.style.backgroundColor = '#ffffff';
        				}
				        if (icon) icon.src = markerIconImg;
				    }    
			    });						    
			    		
			}
			
			
			//************* EVENT LISTENERS(END) **********************//
			
			markers[markerNumber] = marker; //store marker in global collection.
			
			mapSmall.addOverlay(marker); //add marker to the map
			
		} //loadMarker function


		function centerMap(lat, lng, zoom){
			if (map == null) {loadMap(lat, lng, zoom)}
				else {
					var latlng = new GLatLng(lat, lng); 
					map.setCenter(latlng, zoom);
				}
		}//centerMap function

        //Remove all markers.
        function clearOverlays(){
            if (map){map.clearOverlays()};
        }//clearOverlays

        function clickFind(){
            var btn = document.getElementById("ctl00_ContentPlaceHolder1_btnFind")
            if(btn != null){btn.click()}
        }
        
        function showMarker(provId){
            for (i=1; i<markers.length; i++){
                var marker = markers[i];
                if (marker.value == provId){
                    GEvent.trigger(marker,"click"); 
                    break;
                }
            }
        }        

		//***************** TEST ***************************
		function myClick(markerNumber){
			//var marker = 
			//map.setCenter(new GLatLng(-33, 165), 13);
			var marker = markers[markerNumber];
			
			var coord = markers[markerNumber].getLatLng();
			map.setCenter(coord, 13);

			GEvent.trigger(markers[markerNumber],"click");

}