// JavaScript Document

    //<![CDATA[
    //================================================================================
    // This is Where ICONs (Pushpins) are Defined)
    //================================================================================
    //Custom Icon 1
       var iconCustom = new GIcon();
       iconCustom.image = "http://www.fortmyersbeach.org/graphics/gmap/icon.png";
      	iconCustom.shadow = "http://www.fortmyersbeach.org/graphics/gmap/icon-shadow.png";
       //You'll have to play around with the sizing items below to match your graphic
       iconCustom.iconSize = new GSize(23, 29);
       iconCustom.shadowSize = new GSize(23, 29);
       iconCustom.iconAnchor = new GPoint(6, 20);
       iconCustom.infoWindowAnchor = new GPoint(5, 1);
    /*
      EXAMPLE OF HOW TO USE:
      When marker is placed on map, use the line below:
       var marker = new GMarker(point,iconCustom);
      Rather than:
       var marker = new GMarker(point);
    */
    if (GBrowserIsCompatible()) { 
 // A function to create the marker and set up the event window
      function createMarker(point,name,html) {
        var marker = new GMarker(point,iconCustom);
        // The info window version with the "to here" form open
        to_htmls[i] = html + '<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">' +
           '<input type="hidden" name="daddr" value="' + point.lat() + ',' + point.lng() + 
                  // "(" + name + ")" + 
           '"/>';
        // The info window version with the "to here" form open
        from_htmls[i] = html + '<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">' +
           '<input type="hidden" name="saddr" value="' + point.lat() + ',' + point.lng() +
                  // "(" + name + ")" + 
           '"/>';
        // The inactive version of the direction info
        html = html + '<br>Directions: <a href="javascript:tohere('+i+')">To here</a> - <a href="javascript:fromhere('+i+')">From here</a>';
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        gmarkers[i] = marker;
        htmls[i] = html;
        i++;
        return marker;
      }
      // functions that open the directions forms
      function tohere(i) {
        gmarkers[i].openInfoWindowHtml(to_htmls[i]);
      }
      function fromhere(i) {
        gmarkers[i].openInfoWindowHtml(from_htmls[i]);
      }
      // A function to create the marker and set up the event window
      // Dont try to unroll this function. It has to be here for the function closure
      // Each instance of the function preserves the contends of a different instance
      // of the "marker" and "html" variables which will be needed later when the event triggers.    
      function createMarker(point,html) {
        var marker = new GMarker(point,iconCustom);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
		 // The new marker "mouseover" listener        
        GEvent.addListener(marker,"mouseover", function() {
          marker.openInfoWindowHtml(html);
        });
        return marker;
      }
      // Display the map, with some controls and set the initial location 
      var map = new GMap2(document.getElementById("map"));
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
      map.setCenter(new GLatLng(26.435967,-81.920491),7);
          // Set up three markers with info windows 
         var point = new GLatLng(26.650834,-81.869516);
      var marker = createMarker(point,'<table width="201" border="0" cellspacing="5" cellpadding="0"><tr><td width="191"><img src="graphics/img-fortmyers.jpg" width="191" height="90" /></td></tr><tr><td><strong>Fort Myers</strong><br />Corporate Office <br />2122 Johnson St,<br />Fort Myers, FL 33901</td></tr><tr><td>Phone:(239) 334-0046<br />Fax:(239) 334-3661</td></tr></table>')
      map.addOverlay(marker);
      var point = new GLatLng(26.131615,-81.766976);
      var marker = createMarker(point,'<table width="201" border="0" cellspacing="5" cellpadding="0"><tr><td width="191"><img src="graphics/img-naples.jpg" width="191" height="90" /></td></tr><tr><td><strong>Naples</strong><br />2350 Stanford Court<br />Naples, FL 34112</td></tr><tr><td>Phone: (239) 434-0333<br />Fax: (239) 434-9320</td></tr></table>')
      map.addOverlay(marker);
		var point = new GLatLng(27.009862,-82.142619);
		var marker = createMarker(point,'<table width="201" border="0" cellspacing="5" cellpadding="0"><tr><td width="191"><img src="graphics/img-portcharlotte.jpg" width="191" height="90" /></td></tr><tr><td><strong>Port Charlotte</strong><br />18501 Murdock Circle Ste 404<br />Port Charlotte, FL 33948</td></tr><tr><td>Phone: (941) 625-9919<br />Fax: (941) 625-3269</td></tr></table>')
		map.addOverlay(marker);
		var point = new GLatLng(28.220898,-82.457777);
		var marker = createMarker(point,'<table width="201" border="0" cellspacing="5" cellpadding="0"><tr><td width="191"><img src="graphics/img-landolakes.jpg" width="191" height="90" /></td></tr><tr><td><strong>Land O&rsquo;Lakes</strong><br />20525 Amberfield Drive <br />Land O&rsquo;Lakes, FL 34638</td></tr><tr><td>Phone: (813) 909-8099<br />Fax: (813) 909-0300</td></tr></table>')
		map.addOverlay(marker);
		var point = new GLatLng(26.761523,-81.442058);
		var marker = createMarker(point,'<table width="201" border="0" cellspacing="5" cellpadding="0"><tr><td width="191"><img src="graphics/img-labelle.jpg" width="191" height="90" /></td></tr><tr><td><strong>LaBelle</strong><br />251 W. Hickpochee Ave<br />LaBelle, FL 33935</td></tr><tr><td>Phone: (863) 612-0594<br />Fax: (863) 612-0341</td></tr></table>')
		map.addOverlay(marker);
		}
        // display a warning if the browser was not compatible
    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }
    // 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/
    //]]>