// The Google AJAX API loader can be included dynamically
// This is useful because we don't need the API available when the page loads
function loadMaps() {
  google.load("maps", "2", {"callback" : initializeGoogleMap});
};
function initLoader() {
  var script = document.createElement("script");
  // dev version of key
	//script.src = "http://www.google.com/jsapi?key=ABQIAAAAhTZK-uA1f0a-oL0-jrSf_hTIPGm7iY3H3cO_1YZbQ4JjChrruhSXWjB8JEggqvCYQhB3p1stTmmxEQ&callback=loadMaps";
	// production version of key
	script.src = "http://www.google.com/jsapi?key=ABQIAAAAhTZK-uA1f0a-oL0-jrSf_hS-4vET6yidRURSoNMFl6lOXgQVmxTlGa-x6a7yzVTF5AKjbyssFWawyw&callback=loadMaps";
  script.type = "text/javascript";
  document.getElementsByTagName("head")[0].appendChild(script);
};
// Inject google scripts to load our maps
initLoader();

var map = null;
var geocoder = null;
var gmarkers = [];
var htmls = [];
var to_htmls = [];
var from_htmls = [];
var i = 0;
var smallControl = null;
var largeControl = null;
var mapTypeControl = null;

function initializeGoogleMap() {

	if (GBrowserIsCompatible()) {
		// load map into div
		map = new GMap2(document.getElementById("googlemap"));
		map.setCenter(new GLatLng(32.723406,-99.294141), 16); // set location to Albany, TX
		// setup geocoder
		geocoder = new GClientGeocoder();
		// add controls
		smallControl = new GSmallMapControl();
		largeControl = new GLargeMapControl();
		mapTypeControl = new GMapTypeControl();
		//map.addControl(smallControl);
		map.addControl(largeControl);
		map.addControl(mapTypeControl);

		// A function to create the marker and set up the event window
		function createMarker(point,name,html) {
			var marker = new GMarker(point);
			// The info window version with the "to here" form open
			to_htmls[i] = html + '<p style="margin-bottom:5px !important;">Directions: <b>To here<\/b> - <a href="javascript:fromhere(' + i + ')">From here<\/a></p>' +
			'<form action="http://maps.google.com/maps" method="get" target="_blank"><p style="margin-bottom: 5px !important;">Start address:<br>' +
			'<input type="text" class="medium" name="saddr" id="saddr" value="" /><br>' +
			'<INPUT class="clean-submit" value="Get Directions" TYPE="SUBMIT">' +
			'<input type="hidden" name="daddr" value="' + point.lat() + ',' + point.lng() + 
			      // "(" + name + ")" + 
			'"/>' + '</p>';
			// The info window version with the "to here" form open
			from_htmls[i] = html + '<p style="margin-bottom:5px !important;">Directions: <a href="javascript:tohere(' + i + ')">To here<\/a> - <b>From here<\/b></p>' +
			'<form action="http://maps.google.com/maps" method="get"" target="_blank"><p style="margin-bottom: 5px !important;">End address:<br>' +
			'<input type="text" class="medium" name="daddr" id="daddr" value="" /><br>' +
			'<INPUT class="clean-submit" value="Get Directions" TYPE="SUBMIT">' +
			'<input type="hidden" name="saddr" value="' + point.lat() + ',' + point.lng() +
			      // "(" + name + ")" + 
			'"/>' + '</p>';
			// The inactive version of the direction info
			html = html + '<p style="margin-bottom:5px !important;">Directions: <a href="javascript:tohere('+i+')">To here<\/a> - <a href="javascript:fromhere('+i+')">From here<\/a>' + '</p>';
			GEvent.addListener(marker, "click", function() {
				map.openInfoWindowHtml(point,html);
			});
			gmarkers[i] = marker;
			htmls[i] = html;
			i++;
			return marker;
		};
		
		// Read the data from locations-xml.xml file
		/* GDownloadUrl("/contact/locations-xml", function(doc) {
			var xmlDoc = GXml.parse(doc);
			var markers = xmlDoc.documentElement.getElementsByTagName("marker");
			for (var i = 0; i < markers.length; i++) {
				// obtain the attribues of each marker
				var lat = parseFloat(markers[i].getAttribute("lat"));
				var lng = parseFloat(markers[i].getAttribute("lng"));
				var point = new GLatLng(lat,lng);
				var html = '<p style="margin-bottom:5px !important;">'+markers[i].getAttribute("html")+'</p>';
				var label = markers[i].getAttribute("label");
				// create the marker
				var marker = createMarker(point,label,html);
				map.addOverlay(marker);
			};
		}); */
		
		var lat = parseFloat('32.723406');
		var lng = parseFloat('-99.294141');
		var point = new GLatLng(lat,lng);
		var html = '<p style="margin-bottom:5px !important;"><strong>The Old Jail Art Center</strong><br>201 S. 2nd Street<br>Albany, Texas 76430</p>';
		var label = 'The Old Jail Art Center';
		// create the marker
		var marker = createMarker(point,label,html);
		map.addOverlay(marker);

	}; // if Gbrowser compatible

}; // /initializeGoogleMap;

// functions that open the directions forms
function tohere(i) {
	gmarkers[i].openInfoWindowHtml(to_htmls[i]);
};
function fromhere(i) {
	gmarkers[i].openInfoWindowHtml(from_htmls[i]);
};