//<![CDATA[
function load() {
    if (GBrowserIsCompatible()) {
      
      // this variable will collect the html which will eventually be placed in the side_bar
      var side_bar_html = "";
    
      // arrays to hold copies of the markers and html used by the side_bar
      // because the function closure trick doesnt work there
      var gmarkers = [];
      var i = 0;
      gicons = new GIcon(G_DEFAULT_ICON, "images/wifilogo8.png");
	  gicons.iconSize  = new GSize(25,46);
function closer(){
	map.zoomIn();map.zoomIn();map.zoomIn();
}

function fit(){
  	map.setZoom(map.getBoundsZoomLevel(bounds));
	map.setCenter(bounds.getCenter());
	//map.panDirection(0,0.2);
}

function createPolyMarker(latlng, addListener, makePolyline, isClickable) {
      var polyLatLngs = getPolyLatLngs(latlng);

      if (makePolyline) {
       var poly = new GPolyline(polyLatLngs, '#0000ff', 8, .7, {clickable: isClickable});
     } else {
       var poly = new GPolygon(polyLatLngs, '#0000ff', 1, 1.0, '#ff0000', .5, {clickable: isClickable});
     }
      var marker = new GMarker(latlng, {clickable: isClickable});
    
      if (addListener) {
        GEvent.addListener(poly, "click", function(latlng) { 
          map.openInfoWindow(latlng, "You clicked a polygon!");
        });
        GEvent.addListener(marker, "click", function(latlng) {
          marker.openInfoWindow("You clicked a marker!");
        });
      }
      map.addOverlay(poly);
      //map.addOverlay(marker);
    }

    function getPolyLatLngs(latlng) {
      var mapNormalProj = G_NORMAL_MAP.getProjection();
      var mapZoom = map.getZoom();
      var centerPixel = mapNormalProj.fromLatLngToPixel(latlng, mapZoom);

      var polyNumSides = 6;
      var polySideLength = 60;
      var polyRadius = 30;
      var polyLatLngs = [];
      for (var a = 0; a<(polyNumSides+1); a++) {
        var aRad = polySideLength*a*(Math.PI/180);
        var pixelX = centerPixel.x + polyRadius * Math.cos(aRad);
        var pixelY = centerPixel.y + polyRadius * Math.sin(aRad);
        var polyPixel = new GPoint(pixelX,pixelY);
        var polyLatLng = mapNormalProj.fromPixelToLatLng(polyPixel,mapZoom);
        polyLatLngs.push(polyLatLng);
      }
      return polyLatLngs;
    }

      // A function to create the marker and set up the event window
      function createMarker(point,name,html) {
		var polyLatLngs = getPolyLatLngs(point);
 	   
        var marker = new GMarker(point,gicons);
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });
        // save the info we need to use later for the side_bar
        gmarkers[i] = marker;
        // add a line to the side_bar html
        //side_bar_html += '<li><a href="javascript:myclick(' + i + ')"><span>' + (i+1) +'. '+ name + '</span></a></br>'+name+'</li>';
        i++;
		
		map.addOverlay(marker);
        
      }


      // This function picks up the click and opens the corresponding info window
      function myclick(i) {
        GEvent.trigger(gmarkers[i], "click");
      }


      // create the map
      var map = new GMap2(document.getElementById("map"));
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
//      map.setCenter(new GLatLng( 13.740781000,100.579030000), 11);
//      map.setCenter(new GLatLng(0,0), 0);
      map.setCenter(new GLatLng(0,0), 0);

	var bounds = new GLatLngBounds();
      
	 
	side_bar_html += '<ul>';
	
		//point = new GLatLng(Y,X);
		  point = new GLatLng(13.636113203418319,100.40846228599548);

		  createMarker(point," ","<img src='images/wifilogo_main.png' width='54' height='101' alt='Logo' style='float:left;padding-right:10px;' /><div style='width:270px; padding-top:0px;'><div style='width:205px; padding-top:0px;'><span class='htmlbox'><strong>.:: โรงเรียน อนุบาลวันเฉลิม ::.</strong></span></div><img src='images/2_resize.jpg' width='205' height='153' style='float:right;' /></div><span class='htmlbox' style='padding-top:10px;float:right;'>.:: Power by <a href='mailto:danai_nt@hotmail.com'>Expini</a> ::.</span>");
		 		 	
	bounds.extend(point);
 	side_bar_html += '</ul>';
      // put the assembled side_bar_html contents into the side_bar div
    //document.getElementById("side_bar").innerHTML = side_bar_html;

  	map.setZoom(map.getBoundsZoomLevel(bounds));
	map.setCenter(bounds.getCenter());

      
    }

    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://econym.googlepages.com/index.htm

    //]]>