//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
	var map = new GMap2(document.getElementById("map-area"));

	
	map.addControl(new GSmallMapControl() ,new
GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(10,40)));
	map.addControl(new GMapTypeControl(),new
GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(50,10)));
	map.setCenter(new GLatLng(57.69858,-2.90284), 8);

      // ====== This function displays the tooltip ======
      // it can be called from an icon mousover or a side_bar mouseover
      function showTooltip(marker) {
      	tooltip.innerHTML = marker.tooltip;
	var point=map.getCurrentMapType().getProjection().fromLatLngToPixel(map.fromDivPixelToLatLng(new GPoint(0,0),true),map.getZoom());
	var offset=map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
	var anchor=marker.getIcon().iconAnchor;
	var width=marker.getIcon().iconSize.width;
	var height=tooltip.clientHeight;
	var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offset.x - point.x - anchor.x + width, offset.y - point.y -anchor.y -height)); 
	pos.apply(tooltip);
	tooltip.style.visibility="visible";
      }

      // ===== This function is invoked when the mouse goes over an entry in the side_bar =====
      // It launches the tooltip on the icon      
      function mymouseover(i) {
        showTooltip(gmarkers[i])
      }
      // ===== This function is invoked when the mouse leaves an entry in the side_bar =====
      // It hides the tooltip      
      function mymouseout() {
	tooltip.style.visibility="hidden";
      }


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

	
	// Creates a marker at the given point with the given number label
	function createMarker(point, number,boxcontent,name) {
		var icon = new GIcon(baseIcon);
		icon.image = "/maps/images/map/marker" + number + ".png";
		var marker = new GMarker(point, icon);
		marker.tooltip = '<div class="tooltip">'+name.replace(/ /g, "&nbsp;")+'<\/div>';
		GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(boxcontent);
		});	
	        //  ======  The new marker "mouseover" and "mouseout" listeners  ======
	        GEvent.addListener(marker,"mouseover", function() {
	          showTooltip(marker);
	        });        
	        GEvent.addListener(marker,"mouseout", function() {
			tooltip.style.visibility="hidden"
	        });  	
		return marker;
		}
		
      // ====== set up marker mouseover tooltip div ======
      var tooltip = document.createElement("div");
      map.getPane(G_MAP_FLOAT_PANE).appendChild(tooltip);
      tooltip.style.visibility="hidden";
		
	// display 21 garden points on map
	var garden = new Array(6)

	for (i=0; i <=5; i++)
		garden[i]=new Array();

	garden[0]["image"]="cottages/property_pics/google_map_thumbs/findochty_29_30_mainstreet.jpg";
	garden[0]["title"]="No 29 & No 30 - Findochty";
	garden[0]["address"]="Main Street, Findochty, Moray";
	garden[0]["link-url"]="viewallcottages.html";
	garden[0]["lat"]=57.69858;
	garden[0]["lng"]=-2.90284;
	
	garden[1]["image"]="letting/property_pics/google_map_thumbs/keith_craighall.jpg";
	garden[1]["title"]="Craighill";
	garden[1]["address"]="Seafield Avenue, Keith, Moray";
	garden[1]["link-url"]="viewallbb.html";
	garden[1]["lat"]=57.54674;
	garden[1]["lng"]=-2.9534;
	
	garden[2]["image"]="letting/property_pics/google_map_thumbs/macduff_mansfield.jpg";
	garden[2]["title"]="Mansfield House";
	garden[2]["address"]="Duff Street, Macduff, Aberdeenshire";
	garden[2]["link-url"]="viewallbb.html";
	garden[2]["lat"]=57.66864;
	garden[2]["lng"]=-2.49327;

	garden[3]["image"]="cottages/property_pics/google_map_thumbs/failte.jpg";
	garden[3]["title"]="Failte";
	garden[3]["address"]="1 Main Street, Inverallochy, Nr Fraserburgh";
	garden[3]["link-url"]="viewallcottages.html";
	garden[3]["lat"]=57.67605;
	garden[3]["lng"]=-1.92935;

	garden[4]["image"]="cottages/property_pics/google_map_thumbs/quayside.jpg";
	garden[4]["title"]="Quayside";
	garden[4]["address"]="Quayside, Banff";
	garden[4]["link-url"]="viewallcottages.html";
	garden[4]["lat"]=57.67051;
	garden[4]["lng"]=-2.52376;
	
	garden[5]["image"]="cottages/property_pics/google_map_thumbs/aberlour.jpg";
	garden[5]["title"]="Aberlour Self Catering";
	garden[5]["address"]="27 Main Street, Aberlour";
	garden[5]["link-url"]="viewallcottages.html";
	garden[5]["lat"]=57.472801;
	garden[5]["lng"]=-3.220646;


	for (var x=0; x<garden.length;x++){
		var point = new GLatLng(garden[x]["lat"],garden[x]["lng"]);
		map.addOverlay(createMarker(point,x+1,'<div id="map-box"><img src="images/pictures/'+garden[x]["image"]+'" alt="'+garden[x]["title"]+'" /><h3>'+garden[x]["title"]+'</h3><p>'+garden[x]["address"]+'</p><p class="infolink"><a href="../../properties/'+garden[x]["link-url"]+'">Click here for information</a></p></div>',garden[x]["title"]));
		}

	var baseIcon = new GIcon();
	baseIcon.shadow = "../www.google.com/mapfiles/shadow50.png";
	baseIcon.iconSize = new GSize(40, 34);
	baseIcon.shadowSize = new GSize(37, 34);
	baseIcon.iconAnchor = new GPoint(9, 34);
	baseIcon.infoWindowAnchor = new GPoint(9, 2);
	baseIcon.infoShadowAnchor = new GPoint(18, 25);

	var plane   = new GIcon(baseIcon, "images/map/red-plane.html", null, "images/map/red-plane.html");
	var point = new GLatLng(55.8644,-4.4324);
	var marker1 = new GMarker(point,plane)
	marker1.tooltip = '<div class="tooltip">Glasgow&nbsp;Airport<\/div>';
	GEvent.addListener(marker1,"mouseover", function() {
	showTooltip(marker1);
	});        
	GEvent.addListener(marker1,"mouseout", function() {
	tooltip.style.visibility="hidden"
	});  
	map.addOverlay(marker1);

	var point = new GLatLng(55.5070,-4.6039);
	var marker2 = new GMarker(point,plane)
	marker2.tooltip = '<div class="tooltip">Prestwick&nbsp;Airport<\/div>';
	GEvent.addListener(marker2,"mouseover", function() {
	showTooltip(marker2);
	});        
	GEvent.addListener(marker2,"mouseout", function() {
	tooltip.style.visibility="hidden"
	});  
	map.addOverlay(marker2);


	}
}

//]]>
