<!-- Seal Beach Google Map -->
<!-- fail nicely if the browser has no Javascript -->

<noscript><b>JavaScript must be enabled in order for you to use Google Maps.</b>
  However, it seems JavaScript is either disabled or not supported by your browser.
  To view Google Maps, enable JavaScript by changing your browser options, and then
  try again.
</noscript>

<script type="text/javascript">
//<![CDATA[

var gmarkers = [];
var htmls = [];
var to_htmls = [];
var from_htmls = [];
var i=0;


function MakeMap() {

if (GBrowserIsCompatible()) {
																	
 // 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);
   GEvent.addListener(marker, "click", 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(33.430737, -117.883351), 10);
  

 // Set up markers with info windows
																	
																	
																	
// Seal Beach Beaches

      var point = new GLatLng(33.7389, -118.11184);
      var marker = createMarker(point,'<div style="width:240px" align="left"><p><strong>Beach Name: </strong><span class="beachName">Seal Beach</span><br><strong>Location: </strong>South of Ocean Avenue, between 1st Street and Neptune Avenue, Seal Beach, CA<br><strong>Hours: </strong>4:30 am to 10 pm<br><strong>Facilities: </strong>Lifeguards, food and drink, restrooms, and showers</p></div>')
      map.addOverlay(marker);

      var point = new GLatLng(33.7359, -118.10128);
      var marker = createMarker(point,'<div style="width:240px" align="left"><p><strong>Beach Name: </strong><span class="beachName">Seal Beach Pier</span><br><strong>Location: </strong>Bottom of Main Street and Ocean Avenue, Seal Beach, CA</p></div>')
  map.addOverlay(marker);

      var point = new GLatLng(33.7259, -118.08308); 
      var marker = createMarker(point,'<div style="width:240px" align="left"><p><strong>Beach Name: </strong><span class="beachName">Surfside Beach</span><br><strong>Location: </strong>Anderson Street and Pacific Coast Highway, Surfside, CA</p></div>')
  map.addOverlay(marker);

      var point = new GLatLng(33.7150, -118.07208); 
      var marker = createMarker(point,'<div style="width:240px" align="left"><p><strong>Beach Name: </strong><span class="beachName">Sunset Beach</span><br><strong>Location: </strong>West of Pacific Avenue between Anderson Street and Warner Avenue, Huntington Beach, CA<br><strong>Hours: </strong>6 am to 10 pm<br><strong>Facilities: </strong>Lifeguards and restrooms</p></div>')
  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");
}

}

setTimeout('MakeMap()', 500);
//]]>
</script>
