//<![CDATA[
// Google mappery fun and games
var map = null;				// the Google map GMap object
var mapDIV = null;			// the map container
var lat;
var lng;


function initMap(container) { 
    
    if (GBrowserIsCompatible()) {
        map = new GMap2(container);                 
        map.setCenter(new GLatLng(lat, lng), 8);
                
        function createMarker(town) {

		  var latlng = new GLatLng(town.lat, town.lng);
          // Set up our GMarkerOptions object
          var marker = new GMarker(latlng);

		  var opts = new Object();
	      opts.pixelOffset = new GSize(10,5);
	      opts.maxWidth = 140;
		  opts.maxTitle = town.name;
		  opts.maxContent = town.MoreInfo;
          GEvent.addListener(marker, "click", function() {
		  	var myHtml = "<h3>" + town.name + "</h3>" + 
			"<a href='./" + town.url + ".aspx'>Click here for more info</a>";
            marker.openInfoWindowHtml(myHtml,opts);
			
          });
          return marker;
        }
		
		// Add 10 markers to the map at random locations
        var bounds = map.getBounds();
        var southWest = bounds.getSouthWest();
        var northEast = bounds.getNorthEast();
        var lngSpan = northEast.lng() - southWest.lng();
        var latSpan = northEast.lat() - southWest.lat();
        
		var towns = new Array();
		towns = load_data();
		for (var i = 0; i < towns.length; i++) {
			map.addOverlay(createMarker(towns[i]));
        }

        map.addControl(new GSmallMapControl()); // GLargeMapControl | GSmallMapControl
	    map.setMapType(G_NORMAL_MAP | G_SATELLITE_MAP | G_HYBRID_MAP); // G_NORMAL_MAP | G_SATELLITE_MAP | G_HYBRID_MAP
		
      }    
}

function initPage(_lat, _lng) {
	var mapDiv = document.getElementById("mapDiv");
	
	if (!GBrowserIsCompatible()) {
	
		mapDiv.innerHTML = '<img src="images/bd-map.jpg">';
	} else {
	    lat = _lat;
	    lng = _lng;


		initMap(mapDiv);
	}
}


function Town(lt, lg, name, summay, image, url){
	this.lat = lt;
	this.lng = lg;
	this.name = name;
	this.summay = summay;
	this.image = image;	
	this.url = url;	
	
	this.MoreInfo = "<div class=\"primaryColumn\">" +
	"<h1>Towns & Villages / " + this.name  + " </h1>" +
	"<div class=\"twoThirdsColumn\" id=\"left\">" +
	this.summay + 
	"</div>" +
	"<div class=\"oneThirdColumn columnSpacing\" id=\"right\">" +
	"    <img style=\"border-width: 0px;\" src=\"http://"+ host +"/userfiles/TownsAndVillages/" +  this.image +  "\" id=\"ctl00_ContentLeft_townImage\"/>" +
	"</div>" +
	"</div>";
}