
    //<![CDATA[

	var new_coordinates = "";
	var old_coordinates = "";
	var map = null;
	var property_count = 0;
	var default_zoom_level = 16;
	//var default_zoom_level = 14;
	var zoom_threshold = 16;
	var display_threshold = 75;
	
	//var default_latitude = "51.510398467611765";
	//var default_longitude = "-0.1301407814025879";
	//var default_max_latitude = "51.514044145833076";
	//var default_min_latitude = "51.50683263197484";
	//var default_max_longitude = "-0.12754440307617188";
	//var default_min_longitude = "-0.13816595077514648";
	
	var default_latitude = "51.51340316860357";
	var default_longitude = "-0.1305699348449707";
	var default_max_latitude = "51.51715542798517";
	var default_min_latitude = "51.50981085847292";
	var default_max_longitude = "-0.12411117553710938";
	var default_min_longitude = "-0.13591289520263672";

	var base_url = "http://www.londonlandgrab.com";

    function load() {
      if (GBrowserIsCompatible()) {
	  
		map = new GMap2(document.getElementById("map"));
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
		map.setCenter(new GLatLng(default_latitude, default_longitude), default_zoom_level, G_MAP_TYPE);

		GEvent.addListener(map, "zoomend", 
			function() {
		  		map.clearOverlays();
				showHideMaxDiv(0);
				showHidePostDiv(0);
				old_coordinates = "";
				new_coordinates = "";
			}
		);
		
		GEvent.addListener(map, "dragend", 
			function() {
		  		map.clearOverlays();
				showHideMaxDiv(0);
				showHidePostDiv(0);
				old_coordinates = "";
				new_coordinates = "";
			}
		);
		
		GEvent.addListener(map, "moveend", 
			function() {
				showHideMaxDiv(0);
				showHidePostDiv(0);
				//calculate the boundaries of the current map view, and then reload overlays
		  		var bounds = map.getBounds();
				var southWest = bounds.getSouthWest();
				var northEast = bounds.getNorthEast();
				loadOverlays(northEast.lat(), southWest.lat(), northEast.lng(), southWest.lng());
			}
		);
		
		loadOverlays(default_max_latitude, default_min_latitude, default_max_longitude, default_min_longitude);
      }
    }
	
	function createMarker(point, html, icon, title) {
	  //create marker with supplied icone, and listen for clicks on each marker to display supplied html
	  var opts = new Object();
	  opts.clickable = true;
	  opts.icon = icon;
	  opts.title = title;
	  var marker = new GMarker(point, opts);
	  GEvent.addListener(marker, "click", 
	  	function() {
			//map.setCenter(point);
	    	marker.openInfoWindowHtml(html);
	  	}
	  );
	  return marker;
	}
	
	function loadOverlays(max_latitude, min_latitude, max_longitude, min_longitude) {
		
		//check to see if the map has been re-sized, ie search tab show / hide. If res-sized than map will 
		//recalculate its boundarties
		map.checkResize();
		old_coordinates = new_coordinates;
		new_coordinates = "";
		
		var xml = null;
		var properties = null;
		var point = null;
		var icon = null;
		//get list of which category types to search for. These are selected in search menu
		var categories = getCategories();
		//GLog.write(categories);
		//create url to reteieve property data including map boundary and categories
		var url = "xml.asp?max_latitude="+max_latitude+"&min_latitude="+min_latitude+"&max_longitude="+max_longitude+"&min_longitude="+min_longitude+"&categories="+categories;
		//GLog.writeUrl(url);
		GDownloadUrl(url, 
			function(data, responseCode) {
			  xml = GXml.parse(data);
			  properties = xml.documentElement.getElementsByTagName("property");
			  property_count = properties.length;
			  if (properties.length <= display_threshold) {

			  	//iterate through xml elements
			  	for (var i = 0; i < properties.length; i++) {
					latitude = parseFloat(properties[i].getAttribute("latitude"));
					longitude = parseFloat(properties[i].getAttribute("longitude"));
					status_id = parseInt(properties[i].getAttribute("status_id"));
					
					//add all co-ordinates to a tokenised string. This will be used when map next loads
					//when calculating whether to add an overlay
					new_coordinates += latitude+":"+longitude+"|";
					
					//check if an overlay is to be added, by seeing if overlay still exists from last map load
					if (addOverlay(old_coordinates, latitude, longitude)) {
					
						//create point on map to create overlay
						point = new GLatLng(latitude,longitude);
	
						//generate map icon for overlay
						icon = new GIcon();
						icon.image = base_url+"/img/icons/"+properties[i].getAttribute("icon");
						icon.iconSize = new GSize(25, 25);
						icon.iconAnchor = new GPoint(12, 12);
						icon.infoWindowAnchor = new GPoint(12, 12);
						
						//generate html for map overlay popup
						img = base_url+"/img/"+properties[i].getAttribute("image");
						if (status_id == 0) {
							html = "<table width=\"200\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr><td colspan=\"3\"><img src=\"img/gen/1pix.gif\" width=\"1\" height=\"5\"></td></tr><tr><td width=\"50\"><img src=\"img/gen/1pix.gif\" width=\"50\" height=\"1\"></td><td width=\"100\"><img src=\"img/gen/1pix.gif\" width=\"100\" height=\"1\"></td><td width=\"50\"><img src=\"img/gen/1pix.gif\" width=\"50\" height=\"1\"></td></tr><tr><td><img src=\""+img+"\" width=\"75\" height=\"100\"></td><td colspan=\"2\"><span class=\"overlay_header\">ADOPT ME FOR YOURSELF OR AS A GIFT.</span><br><br><span class=\"overlay_title\">"+properties[i].getAttribute("name")+"</span><br><span class=\"overlay_description\">"+properties[i].getAttribute("description")+"</span><br><br><span class=\"overlay_price\">&pound;"+properties[i].getAttribute("price")+"</span> <span class=\"overlay_price_text\">suggested donation</span></td></tr><tr><td colspan=\"3\"><img src=\"img/gen/1pix.gif\" width=\"1\" height=\"5\"></td></tr><tr><td colspan=\"2\" class=\"overlay_footer\">"+getMessage(properties[i].getAttribute("category_id"))+"</td><td><a href=\"adopt.asp?id="+properties[i].getAttribute("random_id")+"\"><img src=\"img/gen/adopt_now.png\" border=\"0\"></a></td></tr></table>";
						} else if (status_id == 1) {
							html = "<table width=\"200\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr><td colspan=\"2\"><img src=\"img/gen/1pix.gif\" width=\"1\" height=\"5\"></td></tr><tr><td width=\"100\"><img src=\"img/gen/1pix.gif\" width=\"100\" height=\"1\"></td><td width=\"100\"><img src=\"img/gen/1pix.gif\" width=\"100\" height=\"1\"></td></tr><tr><td align=\"left\" valign=\"top\"><img src=\""+img+"\" width=\"75\" height=\"100\" align=\"left\"></td><td><span class=\"overlay_header\">UNDER OFFER</span><br><br><span class=\"overlay_title\">"+properties[i].getAttribute("name")+"</span><br><span class=\"overlay_description\">"+properties[i].getAttribute("description")+"</span><br><br><span class=\"overlay_price\">&pound;"+properties[i].getAttribute("price")+"</span> <span class=\"overlay_price_text\">suggested donation</span></td></tr></table>";
						} else if (status_id == 2) {
							link_url = "";
							if (properties[i].getAttribute("url") != '') {
								link_url = "<p class=\"fine_print\"><a href=\""+properties[i].getAttribute("url")+"\" target=\"_blank\">view external link</a></p>";
							}
							html = "<table width=\"250\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\"><tr><td colspan=\"2\"><img src=\"img/gen/1pix.gif\" width=\"1\" height=\"5\"></td></tr><tr><td width=\"100\"><img src=\"img/gen/1pix.gif\" width=\"100\" height=\"1\"></td><td width=\"150\"><img src=\"img/gen/1pix.gif\" width=\"150\" height=\"1\"></td></tr><tr><td align=\"left\" valign=\"top\"><img src=\""+img+"\" width=\"75\" height=\"100\" align=\"left\"></td><td><span class=\"overlay_header\">SOLD TO: "+properties[i].getAttribute("display_name")+"</span><br><br><span class=\"overlay_title\">"+properties[i].getAttribute("name")+"</span><br><p class=\"overlay_description\">"+properties[i].getAttribute("description")+"</p>"+link_url+"</td></tr></table>";
						}
	
						//create overlay marker with point, icon, and popup html
						marker = createMarker(point, html, icon, properties[i].getAttribute("name"));
						//add overlay
						map.addOverlay(marker);
					
					}

				}
			  } else {
			  	// if zoom level is above threshold, then clear all overlays and display message
				map.clearOverlays();
				showHideMaxDiv(1);
			  }
			  
			  
			}
		);
	}
	
	function addOverlay(old_coordinates, latitude, longitude) {
		//check if an overlay already exists at a given latitude and longitude
		add_overlay = true;
		var old_array = old_coordinates.split("|");
		var coordinates = new Array();
		
		//iterate through latitude and longitude string of overlays from previous map load
		for (i=0; i<old_array.length; i++) {
			coordinates = old_array[i].split(":");
			if (coordinates[0] != '') {
				if (parseFloat(coordinates[0]) == latitude && parseFloat(coordinates[1]) == longitude) {
					//if an overlay already exists at a given latitude and longitude, no need to create a new one
					add_overlay = false;
				}
			}
		}
		//GLog.write(add_overlay);
		return add_overlay;
	}

	function loadOverlaysByCategory() {
		//this is called each time a user clicks on a category checkbox
		//remove any pop-up messages 
		showHideMaxDiv(0);
		showHidePostDiv(0);
		//clear all overlays
		map.clearOverlays();
		//remove past overlay co-ordinates
		old_coordinates = "";
		new_coordinates = "";
		//calclate current boundaries
		var bounds = map.getBounds();
		var southWest = bounds.getSouthWest();
		var northEast = bounds.getNorthEast();
		//reload overlays
		loadOverlays(northEast.lat(), southWest.lat(), northEast.lng(), southWest.lng());
	}
	
	function tubeSearch() {
		//this is called when a user selects a tube station from the drop-down list
		var tube_station = new Array();
		//remove any pop-up messages 
		showHideMaxDiv(0);
		showHidePostDiv(0);
		//clear all overlays
		map.clearOverlays();
		//remove past overlay co-ordinates
		old_coordinates = "";
		new_coordinates = "";
		form = document.forms['tube_search'];
		tube_station = form.tube_station.options[form.tube_station.selectedIndex].value.split(":");
		if (tube_station.length == 2) {
			//format the co-ordinates submitted from the drop-down, and pan to them
			//the map will pick up the movement and reload overlays automatically
			var point = new GLatLng(
				parseFloat(tube_station[0]), parseFloat(tube_station[1])
			);
			map.panTo(point);
		}
	}
	
	function postcodeSearch() {
		//this is called when a user enters a postcode prefix into the search box
		//remove any pop-up messages 
		showHideMaxDiv(0);
		showHidePostDiv(0);
		//clear all overlays
		map.clearOverlays();
		//remove past overlay co-ordinates
		old_coordinates = "";
		new_coordinates = "";
		form = document.forms['postcode_search'];
		prefix = form.postcode_prefix.value;
		var url = "postcode.asp?prefix="+prefix;
		//GLog.writeUrl(url);
		//retrieve latitude an longitude xml from database from given prefix
		GDownloadUrl(url, 
			function(data, responseCode) {
			  	xml = GXml.parse(data);
			  	locations = xml.documentElement.getElementsByTagName("location");
				//if no co-ordinates in xml, then display pop-up error message
				if (locations.length == 0) {
					showHidePostDiv(1);
				} else {
				//else pan to new co-ordinates
					var point = new GLatLng(
						parseFloat(locations[0].getAttribute("latitude")),
						parseFloat(locations[0].getAttribute("longitude"))
					);
					map.panTo(point);
				}
				//the map will pick up the movement and reload overlays automatically
			}
		);
	}
	
	function getCategories() {
		//this is called each time the map is reloaded
		//it returns a tokenised string of 1s and 0s depending on what category checkboxes 
		//are checked at the time
		var form = document.forms['category_search'];
		var length = form.elements.length;
		var i=0;
		var category = "";

		for(i=length-1; i>=0; i--) {
			if (form.elements[i].name.indexOf("category_id")!=-1) {
				if (form.elements[i].checked) {
					category += "1";
				} else {
					category += "0";
				}
				if (i > 0) {
					category += ":";
				}
			}
		}
		return category;
	}

	function showHide(hideNav){
	//this is called whn the show / hide images are clicked.
	//it makes div elements hidden / visable.
	//the map.checkResize() will be automatically called so that the new boundaries of the map are recognised
		var mapElement = document.getElementById("map");
		var navElement = document.getElementById("map_search");
		var hideElement = document.getElementById("hideDiv");
		var showElement = document.getElementById("showDiv");

		if (hideNav) {
			mapElement.style.width = "695px";
			mapElement.style.height = "540px";
			//mapElement.style.border-right = "none";
			navElement.style.visibility = "hidden";
			hideElement.style.visibility = "hidden";
			showElement.style.visibility = "visible";
		} else {
			mapElement.style.width = "495px";
			mapElement.style.height = "540px";
			navElement.style.visibility = "visible";
			navElement.style.width = "180px";
			navElement.style.height = "540px";
			hideElement.style.visibility = "visible";
			showElement.style.visibility = "hidden";
		}
		//map.checkResize();
	}
	
	function zoomIn() {
	//this zooms the map in one level, and is called from the popup displayed when the property 
	//threshold has been reached
		showHideMaxDiv(0);
		map.zoomIn();
	}
	
	function showHideMaxDiv(show) {
		var maxElement = document.getElementById("maxDiv");
		if (show) {
			maxElement.style.visibility = "visible";
		} else {
			maxElement.style.visibility = "hidden";
		}
	}
	
	function showHidePostDiv(show) {
		var postElement = document.getElementById("postcodeDiv");
		if (show) {
			postElement.style.visibility = "visible";
		} else {
			postElement.style.visibility = "hidden";
		}
	}
	
	function getMessage(category_id) {
		message = "";
		switch (category_id){
			case "1":
				message = "&pound;100 will pay for a specially-trained clown doctor to pay a visit to sick children in hospital";
				break;
			case "2":
				message = "&pound;50 will pay for 2 hours of sessional counselling for a child affected by bereavement  ";
				break;
			case "3":
				message = "&pound;50 will pay for 2 hours of sessional counselling for a child affected by bereavement  ";
				break;
			case "4":
				message = "&pound;50 will pay for 2 hours of sessional counselling for a child affected by bereavement  ";
				break;
			case "5":
				message = "&pound;30 will pay for 200 young victim of crime leaflets to be printed";
				break;
			case "6":
				message = "&pound;30 will pay for 200 young victim of crime leaflets to be printed";
				break;
			case "7":
				message = "&pound;25 will pay for a music therapist to work with terminally-ill children in hospital ";
				break;
			case "8":
				message = "&pound;25 will pay for a music therapist to work with terminally-ill children in hospital ";
				break;
			case "9":
				message = "&pound;15 will pay for a child to have a present this Christmas  ";
				break;
			case "10":
				message = "&pound;5 will pay for a young carer to go the cinema / pantomime / London Aquarium etc etc";
				break;
			case "11":
				message = "&pound;5 will pay for a young carer to go the cinema / pantomime / London Aquarium etc etc";
				break;
			default : 
				message = "&pound;5 will pay for a young carer to go the cinema / pantomime / London Aquarium etc etc";
		}
		return message;
	}
    //]]>