/*
CreateMap

*/
    var iconBlue = new GIcon(); 
    iconBlue.image = 'icons/blue.png';
    iconBlue.shadow = 'icons/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 = 'icons/red.png';
    iconRed.shadow = 'icons/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 iconGreen = new GIcon(); 
    iconGreen.image = 'icons/green.png';
    iconGreen.shadow = 'icons/shadow.png';
    iconGreen.iconSize = new GSize(12, 20);
    iconGreen.shadowSize = new GSize(22, 20);
    iconGreen.iconAnchor = new GPoint(6, 20);
    iconGreen.infoWindowAnchor = new GPoint(5, 1);

    var customIcons = [];
    customIcons[0] = iconBlue;
    customIcons[1] = iconGreen;   
    
function load(){
  if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("map"));
        map.addMapType(G_PHYSICAL_MAP);
	map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        map.setCenter(new GLatLng(32.99404882,-116.4959464), 9);

  // calls php file which returns xml data
    GDownloadUrl("peaks_xml.php", function(data) {
      var xml = GXml.parse(data);
      var markers = xml.documentElement.getElementsByTagName("marker");
      for (var i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("name");
        var topo = markers[i].getAttribute("topo");
        var peakclass = markers[i].getAttribute("peakclass");
        var elevation = markers[i].getAttribute("elevation");
        var land = markers[i].getAttribute("land");
        var done = markers[i].getAttribute("done");
        var done_dt = markers[i].getAttribute("done_dt");
        var link = markers[i].getAttribute("url");
        var lat = markers[i].getAttribute("lat");
        var lon = markers[i].getAttribute("lon");
        var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                parseFloat(markers[i].getAttribute("lon")));

        var markerIcon = customIcons[done];
        
        if(done == true){
            if(link == ""){
                var html = "<b>" + name + "</b> <br/>" + "Class: " + peakclass + " / " +elevation+" ft <br/>" + "Climbed: " + done_dt + "<br/>";
            }else{
                var html = "<b>" + name + "</b> <br/>" + "Class: " + peakclass + " / " +elevation+" ft <br/>" + "Climbed: " + done_dt + "<br/> <a href=\"" + link + "\" onclick=\"window.open('" + link + "'); return false;\">Photo</a>";   
            }
        }else{
            var html = "<b>" + name + "</b> <br/>" + "Class: " + peakclass + " / " +elevation+" ft";
        } 
                                
        var marker = createMarker(point, name, markerIcon, html);
        map.addOverlay(marker);
      }
    }); 
  }
}

function createMarker(point, name, myicon, popuphtml) {

  var marker = new GMarker(point, {icon:myicon,title:name});
  GEvent.addListener(marker, "click", function() {
    marker.openInfoWindowHtml(popuphtml);
  });
  return marker;
}