var map, manager;
var centerLatitude = 37.275079, centerLongitude = -81.22149840, startZoom = 7;
var markers;
var allmarkers = []; //Array of GMarkers
var htmls = []; 
var listItem;

var minLat;
var maxLat;
var minLng;
var maxLng;

    var iconBlue = new GIcon();  
    iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png'; 
    iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'; 
    iconBlue.iconSize = new GSize(12, 20); 
    iconBlue.shadowSize = new GSize(22, 20); 
    iconBlue.iconAnchor = new GPoint(6, 20); 
    iconBlue.infoWindowAnchor = new GPoint(5, 1); 
 
    var iconRed = new GIcon();  
    iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png'; 
    iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'; 
    iconRed.iconSize = new GSize(12, 20); 
    iconRed.shadowSize = new GSize(22, 20); 
    iconRed.iconAnchor = new GPoint(6, 20); 
    iconRed.infoWindowAnchor = new GPoint(5, 1); 
 
    var customIcons = []; 
    customIcons["American League (AL)"] = iconBlue; 
    customIcons["National League (NL)"] = iconRed; 
 
    function load() { 
	  allmarkers.length = 0;

      if (GBrowserIsCompatible()) { 
        var map = new GMap2(document.getElementById("map")); 
        map.addControl(new GSmallMapControl()); 
        map.addControl(new GMapTypeControl()); 
        map.setCenter(new GLatLng(36.14048, -95.92351), 4); //new GLatLng(47.614495, -122.341861), 13); 
	    map.enableScrollWheelZoom();
     
	    GDownloadUrl("mlb.php", function(data) { 
          var xml = GXml.parse(data); 
          var markers = xml.documentElement.getElementsByTagName("marker"); 
          for (var i = 0; i < markers.length; i++) { 
			var affiliates = markers[i].childNodes[0].childNodes;						
			var name = markers[i].getAttribute("name"); 
            var address = markers[i].getAttribute("address"); 
            var league = markers[i].getAttribute("league"); 
            var stadium = markers[i].getAttribute("stadium"); 
            var mascot = markers[i].getAttribute("mascot"); 
			
            var website = markers[i].getAttribute("website1"); 
            var type = markers[i].getAttribute("type"); 
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")), 
                                    parseFloat(markers[i].getAttribute("lng"))); 
			//var aff = markers[i].childNodes[0].childNodes[0].getAttribute("name");  //.tagName; //affiliates[0].getAttribute("name"); 						
			var marker = createMarker(i, point, name, address, league, stadium, mascot, website, type, affiliates); 
            map.addOverlay(marker); 

			allmarkers.push(marker);

			AppendOption(i, name, league, marker);
		  } 
        }); 
      } 
    } 

	function AppendOption(cnt, name, league, marker) {	//--- Create the options lists (ALS, NLS)
		var elOptNew = document.createElement('option');
  		elOptNew.text = name;
  		elOptNew.value = cnt;
		var elSel;
  		if (league.charAt(0) == 'A')  //American, National
  			elSel = document.getElementById('ALS');
  		else  
  			elSel = document.getElementById('NLS');
		try {
    		elSel.add(elOptNew, null); // standards compliant; doesn't work in IE
		}
  			catch(ex) {
    		elSel.add(elOptNew); // IE only
  		}
	}
  
    function createMarker(cnt, point, name, address, league, stadium, mascot, website, type, affiliates) { 
      var marker = new GMarker(point, customIcons[league]); 
	  var func_html = "<div><b>" + name + "</b><br/><span style='font-size:10px;'>";
          func_html += (stadium.length >0) ? "<b>Stadium: </b>" + stadium : "";
          func_html += "</span>";
          func_html += "<table style='font-size:10px;'>";
          func_html += "<tr><th colspan='2'></th></tr>";
          func_html += "<tr><td align=\"left\"><b>Mastcot:</b>" + mascot + "</td><td align=\"left\"></td></tr>";
          func_html += "<tr><td align=\"left\"><b>League:</b>" + league + " Division </td><td align=\"left\"> </td></tr>";
          func_html += "<tr><td align=\"left\"><b>Website:</b><a href=\"" + website + "\" target=\"_blank\"> " + name + "</a></td><td align=\"left\"></td></tr>";
          func_html += "<tr><td align=\"left\"></td><td align=\"left\"></td></tr>";
          func_html += "<tr><td align=\"left\"><b>Minor League Affiliates:<a href=\"" + "mapMLBAffiliates.php?pt=" + name + "\" target=\"_parent\">Map</a></b></td><td align=\"left\"></td></tr>";
          for (var i = 0; i < affiliates.length; i++) { 
			var aname = affiliates[i].getAttribute("name"); 
			var awebsite = affiliates[i].getAttribute("website1"); 
			var teamclass = affiliates[i].getAttribute("teamclass") + " "; 
         	func_html += "<tr><td align=\"left\">" + teamclass + "<a href=\"" + awebsite + "\" target=\"_blank\"> " + aname + "</a></td></tr>";
		  }
          func_html += "</table></div>";
    	  htmls.push(func_html);
		
		GEvent.addListener(marker, 'click', function() { 
        	marker.openInfoWindowHtml(func_html); 
      }); 
      return marker; 
    } 

  	function loadALS() {
        var team = parseInt(document.getElementById("ALS").value);
        allmarkers[team].openInfoWindowHtml(htmls[team]);
    }

	function loadNLS() {
        var team = parseInt(document.getElementById("NLS").value);
        allmarkers[team].openInfoWindowHtml(htmls[team]);
    }