//<![CDATA[

    var map;
    var polyShape;
    var polygonMode;
    var polyPoints = [];
    var marker;

    var fillColor = "#0000FF"; // blue fill
    var lineColor = "#000000"; // black line
    var opacity = .5;
    var lineWeight = 2;

    function load() {
      if (GBrowserIsCompatible()) {
        map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(28.9997329,-13.607940674), 11);
        map.addControl(new GLargeMapControl());
        map.addControl(new GMapTypeControl());
	GEvent.addListener(map, 'click', mapClick);
      }
    }


   // mapClick - Handles the event of a user clicking anywhere on the map
   // Adds a new point to the map and draws either a new line from the last point
   // or a new polygon section depending on the drawing mode.
    function mapClick(marker, clickedPoint) {
      _uacct = "UA-2270875-1";
      urchinTracker();

      polygonMode = document.getElementById("drawMode_polygon").checked;

      // Push onto polypoints of existing polygon
      polyPoints.push(clickedPoint);
      drawCoordinates();
     }


      // Clear current Map
      function clearMap(){
        map.clearOverlays();
        polyPoints = [];
        document.getElementById("status").innerHTML = "";
      }


      // Toggle from Polygon PolyLine mode

      function toggleDrawMode(){
        map.clearOverlays();
        polyShape = null;
        polygonMode = document.getElementById("drawMode_polygon").checked;
        drawCoordinates();
      }


    // drawCoordinates
    function drawCoordinates(){
      //Re-create Polyline/Polygon
  if (polygonMode) {
        polyShape = new GPolygon(polyPoints,lineColor,lineWeight,opacity,fillColor,opacity);
        var meter = polyShape.getArea()/(1000*1000/1000);
        var area = polyShape.getArea()/(1000*1000);
        document.getElementById("status").innerHTML = " Kmē " + area.toFixed(3) +"  "+ " Mē " + meter.toFixed(3) ;
      } else {
        polyShape = new GPolyline(polyPoints,lineColor,lineWeight,opacity);
        var longitud_kil = polyShape.getLength()/1000;
        var longitud_metros = polyShape.getLength();
        document.getElementById("status").innerHTML =  longitud_kil.toFixed(3) + "  "+ longitud_metros.toFixed(3);
        
        
      }
      map.clearOverlays();

      // Grab last point of polyPoints to add marker
      marker = new GMarker(polyPoints[polyPoints.length -1]);
      map.addOverlay(marker);
      map.addOverlay(polyShape);
    }

   function zoomToPoly() {
     if (polyShape && polyPoints.length > 0) {
       var bounds = polyShape.getBounds();
       map.setCenter(bounds.getCenter());
       map.setZoom(map.getBoundsZoomLevel(bounds));
     }
   }

    //]]>