//<![CDATA[
		  	
// global variables
      var map; 
   	  var tooltip;
	  var gdir;
	  var gmarkers = [];
	  var i = 0;
	
							
// Create the small marker icon 
var icons = new Array();
icons["red"] = new GIcon();
icons["red"].image = "/calgarybeerfest/wp-content/themes/sandbox/mm_20_red.png";
icons["red"].shadow = "/calgarybeerfest/wp-content/themes/sandbox/mm_20_shadow.png";
icons["red"].iconSize = new GSize(12, 20);
icons["red"].shadowSize = new GSize(22, 20);
icons["red"].iconAnchor = new GPoint(6, 20);
icons["red"].infoWindowAnchor = new GPoint(5, 1);
icons["red"].imageMap = [4,0,0,4,0,7,3,11,4,19,7,19,8,11,11,7,11,4,7,0];
icons["red"].transparent = "/calgarybeerfest/wp-content/themes/sandbox/mm_20_transparent.png";

//Get the icon colour from the XML file "icon" attribute
function get_icon(iconColor) {
   if ((typeof(iconColor)=="undefined") || (iconColor==null)) {
      iconColor = "red";
   }
   if (!icons[iconColor]) {
      icons[iconColor] = new GIcon(icons["red"]);
      icons[iconColor].image = "/calgarybeerfest/wp-content/themes/sandbox/mm_20_"+ iconColor +".png";
   }
   return icons[iconColor];
}
	
	
	//main function to create the markers and contents within the infoWindow
    function createTabbedMarker(point, name, icon) {
 	var marker;
        if (icon) {
           marker = new GMarker(point,get_icon(icon));
        } else {
           marker = new GMarker(point);
        }
   //put markers into groups for filtering   
        marker.name = name;  
	gmarkers.push(marker);
	//first tab contents	 
      var html = '<div id="infoWindow"><h4>Get Directions</h4><strong>Enter start address:</strong><br /><em style="color:#666;">e.g. 535 17 Ave SW., Calgary, AB</em><form action="javascript:getDirections();">' +
           '<input type="text" size="25" maxlength="40" name="saddr" id="saddr" value="" /> ' +
           '<input value="Go" type="submit" class="button" onclick="Element.show(\'reset\');"> ' +
           '<input type="hidden" id="daddr" value="'+name+"@"+ point.lat() + ',' + point.lng() + 
           '"/></form></div>';
	
	  //on the click of the marker, open the window w/ tabs
       GEvent.addListener(marker, "click", function() {
       marker.openInfoWindowTabsHtml([new GInfoWindowTab("Address",html)]);
	   
      });
	  
	  //add the tooltip to each marker w/ the location name
		marker.tooltip = "<div class='tooltip' style='overflow: visible'>"+name+"<\/div>";
            GEvent.addListener(marker,"mouseover", function() {
              showTooltip(marker);
            });
            GEvent.addListener(marker,"mouseout", function() {
      		tooltip.style.visibility="hidden"
            });
			
      return marker;
	
    }
	
	  
 //Main function to load the map, setup controls, define viewable area etc.
    function load() {
      if (GBrowserIsCompatible()) {
	
	 	  
	  //create the map
        map = new GMap2(document.getElementById("map"));
		
		//add zoom control - use GLargeMapcontrol() for zoom slider-type controls
        map.addControl(new GLargeMapControl());
		
		//uncomment the line below to allow map/satelitte/hybrid controls
      map.addControl(new GMapTypeControl());
	   
	  //center the map at this lat/lng and give it a zoom level of 7
       map.setCenter(new GLatLng( 51.035349,-114.05714),15);
		
	//Enable double-click, continuous zoom
	  map.enableDoubleClickZoom();
	  map.enableContinuousZoom();
	  //uncomment the line below for scrollwheel zoom
	  //map.enableScrolWheelZoom();
	 
	  //create a GDirections Object used in displaying directions, output directions to the directions div on the page
      gdir=new GDirections(map, document.getElementById("directions"));
	  
	  // Array for decoding the failure codes in directions
      var reasons=[];
      reasons[G_GEO_SUCCESS]            = "Success";
      reasons[G_GEO_MISSING_ADDRESS]    = "Missing Address: The address was either missing or had no value.";
      reasons[G_GEO_UNKNOWN_ADDRESS]    = "Unknown Address:  No corresponding geographic location could be found for the specified address.";
      reasons[G_GEO_UNAVAILABLE_ADDRESS]= "Unavailable Address:  The geocode for the given address cannot be returned due to legal or contractual reasons.";
      reasons[G_GEO_BAD_KEY]            = "Bad Key: The API key is either invalid or does not match the domain for which it was given";
      reasons[G_GEO_TOO_MANY_QUERIES]   = "Too Many Queries: The daily geocoding quota for this site has been exceeded.";
      reasons[G_GEO_SERVER_ERROR]       = "Server error: The geocoding request could not be successfully processed.";
      reasons[G_GEO_BAD_REQUEST]        = "A directions request could not be successfully parsed.";
      reasons[G_GEO_MISSING_QUERY]      = "No query was specified in the input.";
      reasons[G_GEO_UNKNOWN_DIRECTIONS] = "Missing Address: The address was either missing or had no value.";

      // Catch directions errors 
      GEvent.addListener(gdir, "error", function() {
        var code = gdir.getStatus().code;
        var reason="Code "+code;
        if (reasons[code]) {
          reason = reasons[code]
        } 
        alert("Failed to obtain directions, "+reason);
      });
	  
	  //Create the tooltip div
          tooltip = document.createElement("div");
          map.getPane(G_MAP_FLOAT_PANE).appendChild(tooltip);
          tooltip.style.visibility="hidden";
	  
 	    	 
		//Read marker values from the XML, assign variables to each <marker> attribute from the file      
        GDownloadUrl("/calgarybeerfest/wp-content/themes/sandbox/beerfest.xml", 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 icon = markers[i].getAttribute("icon");
			var lat = markers[i].getAttribute("lat");
			var lng = markers[i].getAttribute("lng");
			
			//Combine the lat/lng variables into one to create the marker point
            var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
            var marker = createTabbedMarker(point, name, icon);
			map.addOverlay(marker);
		  }
				
		
		
   });		
      }

    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
	}
	
	
 
	  
	//Functions to create tooltips when markers are hovered over
function mymouseover(i) {
      showTooltip(gmarkers[i])
    }
    function mymouseout() {
      tooltip.style.visibility="hidden";
    }
	
	function showTooltip(marker) {
      tooltip.innerHTML = marker.tooltip;
      var point=map.getCurrentMapType().getProjection().fromLatLngToPixel(map.fromDivPixelToLatLng(new GPoint(0,0),true),map.getZoom());
      var offset=map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
      var anchor=marker.getIcon().iconAnchor;
      var width=marker.getIcon().iconSize.width;
      var height=tooltip.clientHeight;
      var pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offset.x - point.x - anchor.x + width, offset.y - point.y -anchor.y -height));
      pos.apply(tooltip);
      tooltip.style.visibility="visible";
    }
	
	//function to clear directions and recenter the map
function resetMap() {
	gdir.clear();
	map.setCenter(new GLatLng( 51.035349,-114.05714),15);
			
}
	
	//Function to request the directions 
      function getDirections() {
		 
        var saddr = document.getElementById("saddr").value
        var daddr = document.getElementById("daddr").value
        gdir.load("from: "+saddr+" to: "+daddr, { "locale": "en" });
		 map.closeInfoWindow();
		 
	
	  }

    //]]>