//<![CDATA[



      // A TextualZoomControl is a GControl that displays textual "Zoom In"
    // and "Zoom Out" buttons (as opposed to the iconic buttons used in
    // Google Maps).
    function TextualZoomControl() {
    }
    TextualZoomControl.prototype = new GControl();

    // Creates a one DIV for each of the buttons and places them in a container
    // DIV which is returned as our control element. We add the control to
    // to the map container and return the element for the map class to
    // position properly.
    TextualZoomControl.prototype.initialize = function(map) {
      var container = document.createElement("div");

      var zoomInDiv = document.createElement("div");
      this.setButtonStyle_(zoomInDiv);
      container.appendChild(zoomInDiv);
      zoomInDiv.appendChild(document.createTextNode("+"));
      GEvent.addDomListener(zoomInDiv, "click", function() {
        map.zoomIn();
      });

      var zoomOutDiv = document.createElement("div");
      this.setButtonStyle_(zoomOutDiv);
      container.appendChild(zoomOutDiv);
      zoomOutDiv.appendChild(document.createTextNode("-"));
      GEvent.addDomListener(zoomOutDiv, "click", function() {
        map.zoomOut();
      });

      map.getContainer().appendChild(container);
      return container;
    }

    // By default, the control will appear in the top left corner of the
    // map with 7 pixels of padding.
    TextualZoomControl.prototype.getDefaultPosition = function() {
      return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(7, 7));
    }

    // Sets the proper CSS for the given button element.
    TextualZoomControl.prototype.setButtonStyle_ = function(button) {
      button.style.color = "#FFFFFF";
      button.style.right="0px";
	  button.style.top="0px";
	  button.style.backgroundColor = "#0E3267";
      button.style.fontSize="35px";
      button.style.padding = "10px";
      button.style.marginTop = "0px";
      button.style.marginBottom = "0px";
      button.style.textAlign = "center";
      button.style.cursor = "pointer";
	  button.style.opacity="0.5";
	  button.style.paddingTop="0px";
      button.style.paddingBottom="0px";
      button.style.display="block";
      button.style.border="1px solid black";
      button.style.zIndex="5";


  }



      // A TextualZoomControl is a GControl that displays textual "Zoom In"
    // and "Zoom Out" buttons (as opposed to the iconic buttons used in
    // Google Maps).
    function TextualmapTypeControl() {
    }
    TextualmapTypeControl.prototype = new GControl();

    // Creates a one DIV for each of the buttons and places them in a container
    // DIV which is returned as our control element. We add the control to
    // to the map container and return the element for the map class to
    // position properly.
    TextualmapTypeControl.prototype.initialize = function(map) {
      var container = document.createElement("div");

	  var TypeMap = document.createElement("div");
      this.setButtonStyle_(TypeMap);
      container.appendChild(TypeMap);
      TypeMap.appendChild(document.createTextNode("Map"));
      GEvent.addDomListener(TypeMap, "click", function() {
		map.setMapType(G_NORMAL_MAP);
      });

      var TypeSat = document.createElement("div");
      this.setButtonStyle_(TypeSat);
      container.appendChild(TypeSat);
      TypeSat.appendChild(document.createTextNode("Satellite"));
      GEvent.addDomListener(TypeSat, "click", function() {
		map.setMapType(G_HYBRID_MAP);
      });

      map.getContainer().appendChild(container);
      return container;
    }

    // By default, the control will appear in the top left corner of the
    // map with 7 pixels of padding.
    TextualmapTypeControl.prototype.getDefaultPosition = function() {
      return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(7, 7));
    }

    // Sets the proper CSS for the given button element.
    TextualmapTypeControl.prototype.setButtonStyle_ = function(button) {
      button.style.left="0px";
	  button.style.top="0px";
	  button.style.color = "#FFFFFF";
	  button.style.backgroundColor = "#0E3267";
      button.style.fontSize="25px";
      button.style.padding = "10px";
      button.style.marginTop = "0px";
      button.style.marginBottom = "0px";
      button.style.textAlign = "center";
      button.style.cursor = "pointer";
	  button.style.opacity="0.5";
	  button.style.paddingTop="0px";
      button.style.paddingBottom="0px";
      button.style.display="block";
      button.style.border="1px solid black";
      button.style.zIndex="5";


  }





function loadMap(){
	var map = new GMap2(document.getElementById("map"));
	map.setCenter(new GLatLng(13.068776734357694,100.458984375), 5);
	// add ZoomControl
		map.addControl(new TextualZoomControl());
		map.addControl(new TextualmapTypeControl());
		map.enableScrollWheelZoom();
		map.enableDoubleClickZoom();
	//----------------

	// Create a base icon for all of our markers that specifies the
	// shadow, icon dimensions, etc.
	var gmapicon = new GIcon();
	gmapicon.shadow = "shadow.png";
	gmapicon.iconSize = new GSize(20, 34);
	gmapicon.shadowSize = new GSize(37, 34);
	gmapicon.iconAnchor = new GPoint(9, 34);
	gmapicon.infoWindowAnchor = new GPoint(9, 2);
	gmapicon.infoShadowAnchor = new GPoint(18, 25);

	var letteredIcon = new GIcon(gmapicon);
    letteredIcon.image = "marker.png";

    // Set up our GMarkerOptions object
    markerOptions = { icon:letteredIcon };

	//----------------
	GEvent.addListener(map, "click", function(overlay, point){
		map.clearOverlays();

		if (point) {	
			map.addOverlay(new GMarker(point, markerOptions));
			map.panTo(point);
			document.getElementById("mapco").innerHTML = point.lat()+","+point.lng();
			linkurl="http://maps.google.com/maps?f=q&ie=UTF8&ttype=&z="+map.getZoom()+"&iwloc=addr&om=1&q=+%40"+point.lat()+","+point.lng() +"&ll="+point.lat()+","+point.lng() ;
			
			linkHtml="<a  href="+ linkurl+">Create Location</a> ";
			linkmail="<a href=mailto:?subject=My%20Location&body="+ encodeURIComponent(linkurl)+">Send Mail </a>";
			document.getElementById("maplink").innerHTML =  linkHtml;
			document.getElementById("mapmail").innerHTML = linkmail;
		}
	});
}

	// arrange for our onload handler to 'listen' for onload events
if (window.attachEvent) {
	window.attachEvent("onload", function() {
		loadMap();	// Internet Explorer
		});
	} else {
		window.addEventListener("load", function() {
		loadMap(); // Firefox and standard browsers
	}, false);
}
//]]>