var COLORS = [["red", "#ff0000"], ["orange", "#ff8800"], ["green","#008000"],
              ["blue", "#000080"], ["purple", "#800080"]];
var options = {};
var lineCounter_ = 0;
var shapeCounter_ = 0;
var markerCounter_ = 0;
var colorIndex_ = 0;
var detailInfo_;
var featureTable_;
var selectedmarker;
var DATA_TYPE = 'POINT';
var polyline = new Array();
var before_element = '';
var point_listener="";
var markerdraggable_listener = "";

function getColor(named) {
  return COLORS[(colorIndex_++) % COLORS.length][named ? 0 : 1];
}

function getIcon(color) {
  var icon = new GIcon();
  icon.image = "http://google.com/mapfiles/ms/micons/" + color + ".png";
  icon.iconSize = new GSize(32, 32);
  icon.iconAnchor = new GPoint(15, 32);
  return icon;
}

function startDrawing(poly, name, onUpdate, color) {
  
  map.addOverlay(poly);
  poly.enableDrawing(options);
  poly.enableEditing({onEvent: "mouseover"});
  poly.disableEditing({onEvent: "mouseout"});
  
  GEvent.addListener(poly, "endline", function() { 
    fill_poly_coords(poly);
    poly_listener = GEvent.addListener(poly, "click", function(latlng, index) 
     {
    
      if (typeof index == "number") {
        poly.deleteVertex(index);
      } else {
        var newColor = getColor(false);
        $("#id_color").val(newColor);
        poly.setStrokeStyle({color: newColor, weight: 4});
        poly.setFillStyle({color: newColor, weight: 4});
        
      }
    });   
  });
  GEvent.addListener(poly, "lineupdated", onUpdate )
}


/********************************************
posts an point with a single click on the map
*********************************************/
function post_point(){
    
	    point_listener = GEvent.addListener (map, "click", function(overlay, point){
    	    map.clearOverlays();
    		marker = markerdraggable(point.lat(), point.lng(),{draggable:true});
    		map.addOverlay(marker);
    		selectedmarker=marker;
    		before_element = map;
    	 });
}


function post_polyline(){
    // we have added a listener in tz_main to listener map clicks markerdraggable_listener 
    
    if (markerdraggable_listener != ""){GEvent.removeListener(markerdraggable_listener);}
    if (point_listener != ""){GEvent.removeListener(point_listener);}
    map.clearOverlays();
    var color = getColor(false);
    var line = new GPolyline([], color);
    startDrawing(line, "Line " + (++lineCounter_), function() {fill_poly_coords(line);}, color);
}

function post_polygon() {
  
   if (markerdraggable_listener != ""){GEvent.removeListener(markerdraggable_listener);}
   if (point_listener != ""){GEvent.removeListener(point_listener);}    
   map.clearOverlays();
   var color = getColor(false);
    var polygon = new GPolygon([], color, 4, 0.7, color, 0.3);
   startDrawing(polygon, "Shape " + (++shapeCounter_), function() {fill_poly_coords(polygon);}, color);
}


/**********************************************************/

function fill_poly_coords(poly) {
    
    $("#id_coords").val("");
    var count = poly.getVertexCount();
    full_value = $("#id_coords").val();
    
    for (var i=0; i< count; i++){           
        point = poly.getVertex(i);
        
        if (i == 0){
			full_value += point.lng()+ ' ' +point.lat();
		}else{
			full_value += ','+ point.lng() + ' ' + point.lat() + '';		
		}
        //full_value += ','+ point.lng() + ' ' + point.lat() + '';
        if (i<(polyline.length-1)){
        full_value += ', ';            
        } 
    }
    
    $("#id_coords").val(full_value);
}


/******************************************  EDIT ITEM , LINE, POLYGON ZONE ***********************************************************
***************************************************************************************************************************************/


function load_gmap(lat, long){
   // post form. Loads gmap. needs to be moved to mapstraction
    
    var mapTypes = [];
     
 // You can define map type
    mapTypes.push(G_NORMAL_MAP);
  //mapTypes.push(G_MOON_VISIBLE_MAP);
    //mapTypes.push(G_PHYSICAL_MAP);
    mapTypes.push(G_SATELLITE_MAP);
    mapTypes.push(G_HYBRID_MAP);
    map = new GMap2(document.getElementById("map"),{mapTypes:mapTypes});
    
    map.addControl(new GLargeMapControl());
    map.addControl(new GMapTypeControl());
    
    map.setCenter(new GLatLng(lat,long),14);
}

icon_size = [27,34]
icon_shadow_size = [47,46]
near_icon_size = [19,24]
near_icon_shadow_size = [27,34]
icon_anchor = [12,33]
near_icon_anchor = [9,22]

function createPointToEdit(lat, long, icon)
{
	    map.clearOverlays();
		marker = markerdraggable(lat, long,{draggable:true}, icon);
		map.addOverlay(marker);
		selectedmarker=marker;
		point_listener = GEvent.addListener (map, "click", function(overlay, point){
    	    map.clearOverlays();
    		marker = markerdraggable(point.lat(), point.lng(),{draggable:true});
    		map.addOverlay(marker);
    		selectedmarker=marker;
    		before_element = map;
    	 });
}

function createPolylineToEdit(puntos, lineCounter, color)
{
        map.clearOverlays();
        var line = new GPolyline(puntos, color);
		editDrawing(line, "Shape " + (++shapeCounter_), function() {fill_poly_coords(line);}, color);
        
}

function createPolygonToEdit(puntos, lineCounter, color)
{
        map.clearOverlays();
        var polygon = new GPolygon(puntos, color,2, 0.7, color, 0.2 );
        editDrawing(polygon, "Shape " + (++shapeCounter_), function() {fill_poly_coords(polygon);}, color);
}

function editDrawing(poly, name, onUpdate, color) {
  map.addOverlay(poly);
  //poly.enableDrawing(options);
  poly.enableEditing({onEvent: "mouseover"});
  poly.disableEditing({onEvent: "mouseout"});
  
 
    poly_listener = GEvent.addListener(poly, "click", function(latlng, index) 
     {
    
      if (typeof index == "number") {
        poly.deleteVertex(index);
      } else {
        var newColor = getColor(false);
        $("#id_color").val(newColor);
        poly.setStrokeStyle({color: newColor, weight: 4});
        poly.setFillStyle({color: newColor, weight: 4});
        
      }
       
  });
  GEvent.addListener(poly, "lineupdated", onUpdate )
}