//<![CDATA[
GMap.prototype.centerAndZoomOnBounds = function(bounds) {
   var center_lat = (bounds.getNorthEast().lat() + bounds.getSouthWest().lat()) / 2.0;
   var center_lng = (bounds.getNorthEast().lng() + bounds.getSouthWest().lng()) / 2.0;
   var center = new GLatLng(center_lat,center_lng)
   map.setCenter(center, map.getBoundsZoomLevel(bounds));
}
  //]]> 



    //<![CDATA[

    if (GBrowserIsCompatible()) {
      // this variable will collect the html which will eventualkly be placed in the sidebar
      var sidebar_html = "";
    
      // arrays to hold copies of the markers and html used by the sidebar
      // because the function closure trick doesnt work there
      var gmarkers = [];

// global variables
      var map;
      var request;
var bounds = new GLatLngBounds();

// Create our colored marker icons 
var icons = new Array();
icons["red"] = new GIcon(); 
icons["red"].image = "mapIcons/marker_red.png"; 
icons["red"].shadow="http://www.google.com/mapfiles/shadow50.png"; 
icons["red"].iconSize=new GSize(20, 34); 
icons["red"].shadowSize=new GSize(37, 34); 
icons["red"].iconAnchor=new GPoint(9,34); 
icons["red"].infoWindowAnchor=new GPoint(9,2); 
icons["red"].infoShadowAnchor=new GPoint(18,25); 
icons["red"].printImage="http://www.google.com/mapfiles/markerie.gif"; 
icons["red"].mozPrintImage="http://www.google.com/mapfiles/markerff.gif"; 
icons["red"].printShadow="http://www.google.com/mapfiles/dithshadow.gif"; 
icons["red"].transparent="http://www.google.com/mapfiles/markerTransparent.png";
icons["red"].imageMap=[9,0,6,1,4,2,2,4,0,8,0,12,1,14,2,16,5,19,7,23,8,26,9,30,9,34,11,34,11,30,12,26,13,24,14,21,16,18,18,16,20,12,20,8,18,4,16,2,15,1,13,0]; 

function get_icon(iconColor) {
   if ((typeof(iconColor)=="undefined") || (iconColor==null)) { 
      // iconColor = "red";
      return;
   }
   if (!icons[iconColor]) {
      icons[iconColor] = new GIcon(icons["red"]);
      icons[iconColor].image = "mapIcons/marker_"+ iconColor +".png";
   } 
   return icons[iconColor];
}

      // functions that open the directions forms
      function tohere(i) {
        var tabLabel = 'Directions';
        var numTabs = gmarkers[i].tabs.length;
        var divWidth = numTabs * 88;
        if (numTabs < 3) divWidth = 3*88;
        // The info window version with the "to here" form open
        var tabHtml = '<div style="width:'+divWidth+'px">'+
           '<br>Directions: <b>To here</b> - <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="40" maxlength="40" name="saddr" id="saddr" value="" /><br>' +
           '<input value="Get Directions" type="submit" id="mapSubmit"/>' +
           '<input type="hidden" name="daddr" value="' + gmarkers[i].getPoint().lat() + ',' + gmarkers[i].getPoint().lng() + 
                  // "(" + name + ")" + 
           '"/></div>';

        gmarkers[i].tabs[numTabs-1]= new GInfoWindowTab(tabLabel,tabHtml);
        gmarkers[i].openInfoWindowTabsHtml(gmarkers[i].tabs,{selectedTab:numTabs-1});
      }

      function fromhere(i) {
        var tabLabel = 'Directions';
        var numTabs = gmarkers[i].tabs.length;
        var divWidth = numTabs * 88;
        if (numTabs < 3) divWidth = 3*88;
        // The info window version with the "from here" form open
        var tabHtml = '<div style="width:'+divWidth+'px">'+
           '<br>Directions: <a href="javascript:tohere(' + i + ')">To here</a> - <b>From here</b>' +
           '<br>End address:<form action="http://maps.google.com/maps" method="get"" target="_blank">' +
           '<input type="text" size="40" maxlength="40" name="daddr" id="daddr" value="" /><br>' +
           '<input value="Get Directions" type="submit" id="mapSubmit"/>' +
           '<input type="hidden" name="saddr" value="' + gmarkers[i].getPoint().lat() + ',' + gmarkers[i].getPoint().lng() + 
                  // "(" + name + ")" + 
           '"/></div>';

        gmarkers[i].tabs[numTabs-1]= new GInfoWindowTab(tabLabel,tabHtml);
        gmarkers[i].openInfoWindowTabsHtml(gmarkers[i].tabs,{selectedTab:numTabs-1});
      }

      // ==================================================
      // A function to create a tabbed marker and set up the event window
      // This version accepts a variable number of tabs, passed in the arrays htmls[] and labels[]
      function createTabbedMarker(point,label,tabs,icon) {
        var marker;
        if (icon) {
           marker = new GMarker(point,get_icon(icon));
        } else {
           marker = new GMarker(point);
        }
        var marker_num = gmarkers.length;
        marker.marker_num = marker_num;
        marker.tabs = tabs;
        gmarkers[marker_num] = marker;
        
        GEvent.addListener(gmarkers[marker_num], "click", function() {
          marker.openInfoWindowTabsHtml(gmarkers[marker_num].tabs);
        });
        // add a line to the sidebar html
        sidebar_html += '<a href="javascript:myclick(' + marker_num + ')">' + label + '</a><br>';
        return marker;
      }
      // ==================================================
      


      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
         GEvent.trigger(gmarkers[i], "click");
      }


      // create the map
      // var map = new GMap2(document.getElementById("map"));
      var map = new GMap(document.getElementById("map2"));
	  map.setCenter(new GLatLng(32.86097,-96.940291), 15);
	  //map.setCenter(new GLatLng(37.4419, -122.1419), 13);
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
      



      // Read the data from example.xml
      var request = GXmlHttp.create();
      var filename = "/scripts/mapTabbed2.xml";


      request.open("GET", filename, true);
      request.onreadystatechange = processTabbedXML;
      request.send(null);
    }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

function processTabbedXML() {
   if (request.readyState == 4) {
      if ((request.status != 200) && (request.status != 304)) {
         alert("file not found: "+filename);
         return;
      }
      // var xmlDoc = request.responseXML;
      var xmlDoc = GXml.parse(request.responseText);
      // obtain the array of markers and loop through it
      var markers = xmlDoc.documentElement.getElementsByTagName("marker");
      // alert("processing "+markers.length+" markers");
      // map.clearOverlays();
      // bug in clearOverlays
      for (var i=0; i<gmarkers.length; i++) {
         map.removeOverlay(gmarkers[i]);
      }
      
      gmarkers = new Array();
      for (var i = 0; i < markers.length; i++) {
         // obtain the attributes of each marker
         var lat = parseFloat(markers[i].getAttribute("lat"));
         var lng = parseFloat(markers[i].getAttribute("lng"));
         var label = markers[i].getAttribute("label");
         var icon = markers[i].getAttribute("icon");

         // alert("point["+i+"] label="+label+":("+lat+", "+lng+")");
         if (isNaN(lat) || isNaN(lng)) {
            alert("bad point "+i);
            continue;
         }
         var point = new GLatLng(lat,lng);
         // get the tab info
         tabInfo = markers[i].getElementsByTagName("tab");
         tabs = new Array();
         if (tabInfo.length > 0) {
            // alert("processing "+tabInfo.length+" tabs");
            for (var j = 0; j < tabInfo.length; j++) {
               var tabLabel = GXml.value(tabInfo[j].getElementsByTagName("label")[0]);
               var tabHtml = GXml.value(tabInfo[j].getElementsByTagName("contents")[0]);
               // alert("point["+i+"] tab["+j+"] label="+tabLabel+", contents="+tabHtml);
               if ((j==0) && (tabInfo.length > 2)){ //  adjust the width so that the info window is large enough for this many tabs
                  tabHtml = '<div style="width:'+(tabInfo.length+1)*88+'px">' + tabHtml + '</div>';
               }
               tabs.push(new GInfoWindowTab(tabLabel,tabHtml));
            }
         } else { 
            // alert("no tabs point "+i);
            var tabLabel = "Nothing";
            var tabHtml = markers[i].getAttribute("html");
            tabs.push(new GInfoWindowTab(tabLabel,tabHtml));
         }      
         if (!markers[i].getAttribute("nodirections") || (markers[i].getAttribute("nodirections").toLowerCase() == "no")) {
         // add directions tab
         var tabLabel = "Directions";
         var tabHtml = '<div style="width:'+(tabs.length+1)*88+'px">'+'<br>Directions: <a href="javascript:tohere('+i+')">To here</a> - <a href="javascript:fromhere('+i+')">From here</a></div>';
         tabs.push(new GInfoWindowTab(tabLabel,tabHtml));
         }
         // create the marker
         var marker = createTabbedMarker(point,label,tabs, icon);
         bounds.extend(point);

         map.addOverlay(marker);
      }
	  //commented out to allow for zoom call to work in map initialization above
      //map.centerAndZoomOnBounds(bounds);
	  
	//added to open infoWindow on load
	  myclick(0);

      // put the assembled sidebar_html contents into the sidebar div
      document.getElementById("sidebar").innerHTML = sidebar_html;
      sidebar_html = "";
   }
}


function getXMLfile() {
   // Read the data from example.xml
   request = GXmlHttp.create();
   filename = document.MyForm.filename.value
   if (filename.length == 0) { 
   alert("Please enter a filename!");
   return false;
   }


//      filename = "example.xml"
   request.open("GET", filename, true);
   request.onreadystatechange = processTabbedXML;



   request.send(null);
   return false;
}

function processXMLfile() {

  if (request.readyState == 4) {
    if ((request.status == 200) || (request.status == 304)) {
       var xmlDoc = request.responseXML;
       if (xmlDoc.documentElement) {
          // obtain the array of markers and loop through it
          var markers = xmlDoc.documentElement.getElementsByTagName("marker");

          map.clearOverlays();
          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 GPoint(lng,lat);
            var point = new GLatLng(lat,lng);
            var html = markers[i].getAttribute("html");
            var label = markers[i].getAttribute("label");
            var icon = markers[i].getAttribute("icon");
            // create the marker
            var marker = createMarker(point,label,html,icon);
            map.addOverlay(marker);
          }
       } else {
          alert("invalid xml file:"+filename);
       }
    } else {
     alert("file not found:"+filename);
    }
  }
}
    // This Javascript is based on code provided by the
    // Blackpool Community Church Javascript Team
    // http://www.commchurch.freeserve.co.uk/   
    // http://www.econym.demon.co.uk/googlemaps/

    //]]>