var i = 0;
var gmarkers = [];
// arrays to hold variants of the info window html with get direction forms open
var to_html = [];
var from_html = [];

// Create a base icon for all of our markers that specifies the
// shadow, icon dimensions, etc.
var baseIcon = new GIcon();

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);

function drawMap(dataFile, markersDir, mapDivID, dirDivID, listDivID)
   {
   
   baseIcon.shadow = markersDir + "/shadow50.png";
   
   var listInfo = new String("");

   if (GBrowserIsCompatible() != true)
      {

      document.getElementById(mapDivID).innerHTML = 'Your browser ' +
                        '<a href="http://local.google.com/support/bin/answer.py?answer=16532&topic=1499" ' +
                        'target="_blank">does not support ' +
                        'Google Maps<\/a>.  ' +
                        'Please refer to the ' +
                        '<a href="#ChurchList">list below<\/a>.';

      // Construct Text for Informational Paragraph
      listInfo = 'First Christian Church is located in Tallahassee, Florida '
      listInfo = listInfo + 'halfway between Tennessee and Tharpe Streets on High Road.  '
      listInfo = listInfo + 'For more contact information, please see the '
      listInfo = listInfo + '<a href="#ContactInfo" title="FCC-Tallahassee Contact Info">'
      listInfo = listInfo + 'information below<\/a>.'

      } else {

      // Construct Text for Informational Paragraph
      listInfo = 'First Christian Church is located in Tallahassee, Florida ';
      listInfo = listInfo + 'halfway between Tennessee and Tharpe Streets on ';
	  listInfo = listInfo + 'High Road.  ';
      listInfo = listInfo + 'For location, directions, or more contact ';
	  listInfo = listInfo + 'information, please see the ';
      listInfo = listInfo + '<a href="#GMap">map below<\/a> or see the ';
      listInfo = listInfo + '<a href="#ContactInfo" ';
	  listInfo = listInfo + 'title="FCC-Tallahassee Contact Info">';
      listInfo = listInfo + 'information below<\/a>.';
      
      document.getElementById(mapDivID).style.height = "350px";
      document.getElementById(mapDivID).style.marginTop = "20px";
      document.getElementById(mapDivID).style.marginBottom = "20px";
      document.getElementById(mapDivID).title = "Google Map showing First Christian Church of Tallahassee";
      
      map = new GMap2(document.getElementById(mapDivID));

//	  map.setMapType(G_NORMAL_MAP);
//	  map.removeMapType(G_SATELLITE_MAP);
	  
	  map.addControl(new GMapTypeControl());
	  map.addControl(new GSmallZoomControl());
      map.addControl(new GScaleControl());
	  map.addControl(new GOverviewMapControl());
	  
      map.setCenter(new GLatLng(30.458792, -84.312623, false), 13);

      var request = GXmlHttp.create();
      var markarray = [] ;
      request.open('GET', dataFile, true);
      
      request.onreadystatechange = function() {
         if (request.readyState == 4) {
            var centerPoint = new GPoint(0,0);
            var geoLat;
            var geoLong;
            var xmlDoc = request.responseXML;
            var markers = xmlDoc.documentElement.getElementsByTagName("ministry");
            var html = new String ("");
            var minName = new String ("");
            var minType = new String ("");
            for (var j = 0; j < markers.length; j++) {
               if (markers[j].hasChildNodes() == true) {

                  //Read Lat & Long in from XML
                  geoLat = markers[j].getElementsByTagName("latitude")[0].firstChild.nodeValue;
                  geoLong = markers[j].getElementsByTagName("longitude")[0].firstChild.nodeValue;

                  // Take Sum of Lat's and Long's to Calculate Center
                  centerPoint.x = centerPoint.x + parseFloat(geoLong);
                  centerPoint.y = centerPoint.y + parseFloat(geoLat);

                  var point = new GLatLng(parseFloat(geoLat), parseFloat(geoLong));

                  minName = markers[j].getElementsByTagName("name")[0].firstChild.nodeValue;

                  //Construct HTML for pop-up bubble
                  html = '<div class="MapInfo address vcard">';
                  html = html + '<span class="fn org">';
                  html = html + minName;
                  html = html + '<\/span>';
				  html = html + '<span class="adr">';
				  html = html + '<span class="street-address">';
                  html = html + markers[j].getElementsByTagName("address")[0].firstChild.nodeValue;
				  html = html + '<\/span><br />';
				  html = html + '<span class="locality">';
                  html = html + markers[j].getElementsByTagName("city")[0].firstChild.nodeValue;
				  html = html + '<\/span>';
                  html = html + '\, ';
				  html = html + '<span class="region">';
                  html = html + markers[j].getElementsByTagName("state")[0].firstChild.nodeValue;
				  html = html + '<\/span>';
				  html = html + '<\/span>';
                  html = html + '<\/div>';

                  minType = markers[j].getAttribute("type");
                     markarray.push(createMarker(point, html, markersDir, minType, minName));
                     map.addOverlay(markarray[markarray.length-1]);

                  var topElement = markarray[markarray.length-1].iconImage;

                  if (markarray[markarray.length-1].transparentIcon)
                        {topElement = markarray[markarray.length-1].transparentIcon;}

                  if (markarray[markarray.length-1].imageMap)
                        {topElement = markarray[markarray.length-1].imageMap;}
                     
                  if (markers.length == 1)
                        {GEvent.trigger(markarray[markarray.length-1], "click");}

               }  // if (markers[j].hasChildNodes() == true)
            }     // for (var j = 0; j < markers.length; j++)


            centerPoint.x = centerPoint.x / markers.length;
            centerPoint.y = centerPoint.y / markers.length;

            map.setCenter(centerPoint);

         }        // if (request.readyState == 4)
      }           // request.onreadystatechange = function()
      
      request.send(null);

      }           //if (GBrowserIsCompatible() != true)

   document.getElementById("ListInfo").innerHTML = listInfo

   }              // function drawMap

// Create a marker at a point with an infowindow...
function createMarker(point, html, markersDir, markType, markName)
   {

   var markFile = new String("");
   var dirHTML = new String("");

  // The info window version with the "to here" form open
  to_html[i] = html + '<div class="MapInfo directions">' +
      'Directions: <span style="font-weight:bold">To here<\/span>' +
      '&nbsp;-&nbsp;<a href="javascript:fromhere(' + i + ')">From here<\/a><br \/>' +
            'Start address:  ' +
            '<form action="http:\/\/maps.google.com\/maps" method="get" target="_blank">' +
            '<input type="text" size="50" maxlength="50" name="saddr" id="saddr" value="" \/><br \/>' +
            '<input value="Get Directions" type="Submit" \/>' +
            '<input type="hidden" name="daddr" ' +
            'value="' + point.y + ',' + point.x + ' (' + markName + ')" />' +
            '<\/form><\/div>';

  // The info window version with the "to here" form open
  from_html[i] = html + '<div class="MapInfo directions">' +
   'Directions: <a href="javascript:tohere(' + i + ')">To here<\/a>' +
   '&nbsp;-&nbsp;<span style="font-weight:bold">From here<\/span><br \/>' +
         'End address  :' +
         '<form action="http:\/\/maps.google.com\/maps" method="get" target="_blank">' +
         '<input type="text" size="50" maxlength="50" name="daddr" id="daddr" value="" \/><br \/>' +
         '<input value="Get Directions" type="Submit" \/>' +
         '<input type="hidden" name="saddr" ' +
         'value="' + point.y + ',' + point.x + ' (' + markName + ')" \/>' +
         '<\/form><\/div>';

  // The inactive version of the direction info
  dirHTML = html + '<div class="MapInfo directions">Directions:  ' +
         '<a href="javascript:tohere(' + i + ')">To here<\/a>' +
         '&nbsp;-&nbsp;' +
         '<a href="javascript:fromhere(' + i + ')">From here<\/a>' +
         '<\/div>';

   var minIcon = new GIcon(baseIcon);

   markFile = "./";

   markFile = markFile + markersDir + "/" + markType + ".png";

   minIcon.image = markFile;
      
   var marker = 
      new GMarker(point, {clickable: true, draggable: false, icon: minIcon, title: markName});

   GEvent.addListener(marker, "click", function()
      {
         marker.openInfoWindowHtml(dirHTML);
      });
      
   //Save the point for directions
   gmarkers[i] = marker;
   i++;
   return marker;
   }        // function createMarker

   // functions that open the directions forms
   function tohere(k) {
      gmarkers[k].openInfoWindowHtml(to_html[k]);
   }
   function fromhere(k) {
      gmarkers[k].openInfoWindowHtml(from_html[k]);
   }