// var centerLatitude = 41.653080;
// var centerLongitude = -4.730600;
// var startZoom = 16;

 var map;
 
 function init() {
 if (GBrowserIsCompatible()) {
 map = new GMap2(document.getElementById("map"));
 recuperaMarcadores();
 map.setUIToDefault();
  map.addControl(new GLargeMapControl());
 //map.addControl(new GSmallMapControl());
 map.addControl(new GMapTypeControl());
 map.setCenter(new GLatLng(41.656169, -4.733815), 19, map.getMapTypes()[2]);
 // map.setCenter(new GLatLng(41.654050271457, -4.7343054413795), 19, map.getMapTypes()[2]);
 //map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
 
GEvent.addListener(map, "click", function(overlay, latlng) {
//crea un elemento DOM formulario HTML
var inputForm = document.createElement("form");
inputForm.setAttribute("action","");
inputForm.onsubmit = function() {almacenaMarcador(); return false;};
//recupera la longitud y latitud del punto donde se ha pulsado
var lng = latlng.lng();
var lat = latlng.lat();
inputForm.innerHTML = '<fieldset style="width:150px;">'
+ '<legend>Lugar Interesante</legend>'
+ '<label for="found">Nombre</label>'
+ '<input type="text" id="found" style="width:100%;"/>'
+ '<label for="comentario">Comentario</label>'
+ '<input type="text" id="comentario" style="width:100%;"/>'
+ '<label for="left">Enviado por</label>'
+ '<input type="text" id="left" style="width:100%;"/>'
+ '<label for="left">URL icono</label>'
+ '<input type="text" id="icon" style="width:100%"/>'
+ '<input type="submit" value="Guardar"/>'
+ '<input type="hidden" id="longitude" value="' + lng + '"/>'
+ '<input type="hidden" id="latitude" value="' + lat + '"/>'
+ '</fieldset>';
map.openInfoWindow (latlng,inputForm);
});
 }
 }
  
 window.onload = init;
 
function almacenaMarcador(){
var lng = document.getElementById("longitude").value;
var lat = document.getElementById("latitude").value;
var getVars = "?found=" + document.getElementById("found").value
+ "&comentario=" + document.getElementById("comentario").value
+ "&left=" + document.getElementById("left").value
+ "&icon=" + document.getElementById("icon").value
+ "&lng=" + lng
+ "&lat=" + lat ;
var request = GXmlHttp.create();
//open the request to almacenamarcador.php on your server
request.open('GET', 'almacenaMarcador.php' + getVars, true);
request.onreadystatechange = function() {
if (request.readyState == 4) {
//the request is complete
var xmlDoc = request.responseXML;
//retrieve the root document element (response)
var responseNode = xmlDoc.documentElement;
//retrieve the type attribute of the node
var type = responseNode.getAttribute("type");
//retrieve the content of the responseNode
var content = responseNode.firstChild.nodeValue;
//check to see if it was an error or success
if(type!='success') {
alert(content);
} else {
//create a new marker and add its info window
var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));
var iconImage = responseNode.getAttribute("icon");
var marker = crearMarcador(latlng, content, iconImage);
map.addOverlay(marker);
map.closeInfoWindow();
}
}
}
request.send(null);
return false;
}

function crearMarcador(latlng, html, iconImage) {
if(iconImage!='') {
var icon = new GIcon();
icon.image = iconImage;
icon.iconSize = new GSize(36, 36);
icon.iconAnchor = new GPoint(14, 25);
icon.infoWindowAnchor = new GPoint(14, 14);	
var marker = new GMarker(latlng,icon);
} else {
var marker = new GMarker(latlng);
}
GEvent.addListener(marker, 'click', function() {
var markerHTML = html;
marker.openInfoWindowHtml(markerHTML);
});
return marker;
}
function recuperaMarcadores() {
var request = GXmlHttp.create();
//tell the request where to retrieve data from.
request.open('GET', 'recuperaMarcadores.php', true);
//tell the request what to do when the state changes.
request.onreadystatechange = function() {
if (request.readyState == 4) {
var xmlDoc = request.responseXML;
var markers = xmlDoc.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var lng = markers[i].getAttribute("lng");
var lat = markers[i].getAttribute("lat");
//check for lng and lat so MSIE does not error
//on parseFloat of a null value
if(lng && lat) {
var latlng = new GLatLng(parseFloat(lat),parseFloat(lng));
var html = '<div><b>Nombre</b> '
+ markers[i].getAttribute("found")
+ '</div><div><b>Comentario</b> '
+ markers[i].getAttribute("comentario")
+ '</div><div><b>Enviado Por</b> '
+ markers[i].getAttribute("left")
+ '</div>';

var iconImage = markers[i].getAttribute("icon");
var marker = crearMarcador(latlng, html, iconImage);
map.addOverlay(marker);
}
} //for
} //if
} //function
request.send(null);
}
  
