var form_dibujado = false;
var gmarkers = [];
var htmls = [];
var map;
var geo;

clearOverlays = function() {
	if (gmarkers) {
		for (z = 0; z < gmarkers.length; z++) {
			gmarkers[z].setMap(null);
		}
	}
	gmarkers = new Array();
	htmls = new Array();
}

//Store grid
var ds_mapas = new Ext.data.Store({
	proxy:new Ext.data.HttpProxy({url:"../../PopulateGrid", method:'post'}),
	reader:new Ext.data.JsonReader({
		root:'results',
		totalProperty:'totalCount'
	},[
		{name:'FARMACIA'},
		{name:'DIRECCION'},
		{name:'CODPOSTAL'},
		{name:'POBLACION'},
		{name:'TELEFONO'},
		{name:'MAIL'},
		{name:'HORARIO'},
		{name:'GUARDIA'},
		{name:'BOE_ID'}
	]),
	remoteSort:true
});

create_marker_html = function(title, direccion, poblacion, telefono, horario, guardia, email) {
	var maps_styles = "<style type='text/css'>a.enlace:link {color:#0896FF;font-weight:bold;text-decoration:underline;}a.enlace:visited{color:#0896FF;font-weight:bold;text-decoration:underline;}a.enlace:hover{color:#FEBA02;}</style>";
	var maps_html =	"<div style='width:300px;margin-top:10px;padding-top:10px;border-top:2px solid #96b2d9;'>"
	maps_html += "<div><div style='float:left;width:120px;padding:2px;height:100px;'>";
	maps_html += "<img style='border:none !important;' src='../../Descarga?id=" + id + "&tipo=5' width='100px' /></div>";
	maps_html += "<p style='font:x-small Arial;color:#003580;'><b style='font-size:11px;'>" + title+ "</b>";
	maps_html += "<br/>" + direccion + "<br/>" + poblacion + "<br/>Telefono: " + telefono;
	if (horario != "") maps_html += "<br/>Guardia: " + horario + "<br/> ";
	if (guardia != "") maps_html += "<br/>Horario: " + guardia + "<br/> ";
	//if (email != "") maps_html += "Email: <a class='enlace' href='mailto:" + email + "' target='_blank'>" + email + "</a>";
	maps_html += "</p></div></div>";
	
	return maps_styles + maps_html;
}

create_marker = function (point, html, id){
	
	var image = new google.maps.MarkerImage("../../icons/marker.png",
		new google.maps.Size(26,34),
		new google.maps.Point(0,0),
		new google.maps.Point(0,34));

	var marker = new google.maps.Marker({
		position:point,
		icon:image,
		map:map
	});
	
	google.maps.event.addListener(marker, "click", function(){
		var infowindow = new google.maps.InfoWindow({
		    content:create_marker_html(html[0], html[1], html[2], html[3], html[4], html[5], html[6])
		});
		infowindow.open(map, marker);
	});
	
	gmarkers[gmarkers.length] = marker;
	htmls[htmls.length] = html;
	
}

dibuja = function(farmacia){
	
	var etiqueta = [];
	etiqueta[0] = farmacia.getElementsByTagName("FARMACIA")[0].childNodes[0].nodeValue;
	if(farmacia.getElementsByTagName("DIRECCION")[0])
		etiqueta[1] = farmacia.getElementsByTagName("DIRECCION")[0].childNodes[0].nodeValue;
	else etiqueta[1] = "";
	if(farmacia.getElementsByTagName("CODPOSTAL")[0] && farmacia.getElementsByTagName("POBLACION")[0])
		etiqueta[2] = farmacia.getElementsByTagName("POBLACION")[0].childNodes[0].nodeValue;
	else etiqueta[2] = "";
	if(farmacia.getElementsByTagName("TELEFONO")[0])
		etiqueta[3] = farmacia.getElementsByTagName("TELEFONO")[0].childNodes[0].nodeValue;
	else etiqueta[3] = "";
	if(farmacia.getElementsByTagName("HORARIO")[0])
		etiqueta[4] = farmacia.getElementsByTagName("HORARIO")[0].childNodes[0].nodeValue;
	else etiqueta[4] = "";
	if(farmacia.getElementsByTagName("GUARDIA")[0])
		etiqueta[5] = farmacia.getElementsByTagName("GUARDIA")[0].childNodes[0].nodeValue;
	else etiqueta[5] = "";
	if(farmacia.getElementsByTagName("MAIL")[0])
		etiqueta[6] = farmacia.getElementsByTagName("MAIL")[0].childNodes[0].nodeValue;
	else etiqueta[6] = "";
	var lat = farmacia.getElementsByTagName("LATITUD")[0].childNodes[0].nodeValue;
	var lng = farmacia.getElementsByTagName("LONGITUD")[0].childNodes[0].nodeValue;

	var point = new google.maps.LatLng(lng, lat);
	
	create_marker(point, etiqueta, farmacia.getElementsByTagName("ID")[0].childNodes[0].nodeValue);
	
}

function pinta_mapa(pob, raz, gua, tipo){
	
	geo = new google.maps.Geocoder();
	
	var myLatlng = new google.maps.LatLng(40.214103,-0.319977);
	var myOptions = {
    	zoom:9,
    	center:myLatlng,
    	mapTypeId:google.maps.MapTypeId.ROADMAP,
    	navigationControlOptions: {
    		position: google.maps.ControlPosition.TOP_RIGHT
    	}
    }
    map = new google.maps.Map(document.getElementById("map"), myOptions);

	pinta_markers(pob, raz, gua, tipo);
	
	ds_mapas.load({params:{pob:pob, raz:raz, gua:gua, tipo:tipo}});
}

function pinta_markers(pob, raz, gua, tipo){
	downloadUrl("../../PopulateMap?pob="+pob+"&raz="+raz+"&gua="+gua+"&tipo="+tipo,
		function(data){
			var xmlResults = data.documentElement.getElementsByTagName("results");
			for (var j=0; j<xmlResults.length; j++){
				dibuja(xmlResults[j]);
			}
		});
	
	mapas(pob, raz, gua, tipo);
}

function mapas(pob, raz, gua, tipo){
	var m_pob = '';
	var m_raz = '';
	var m_gua = '';
	
	var ds_combo = new Ext.data.Store({
		proxy:new Ext.data.HttpProxy({url:'comboPoblaciones.jsp'}),
		reader:new Ext.data.JsonReader({
			root:'results',
			totalProperty: 'totalCount'
		},[{name:'ID'}, {name:'NOMBRE'}])
	});
	
	ds_combo.on("load", function(){
		PoblacionesRecord = Ext.data.Record.create(['ID', 'NOMBRE']);
		todas_las_poblaciones = new PoblacionesRecord({'ID':'', 'NOMBRE':'TODAS'});
		ds_combo.insert(0, todas_las_poblaciones);
	});
	
	ds_combo.load();
	
	//Formulario
	var guardia_show = new Ext.form.DateField({
		hideLabel:true,
		width:175,
		allowBlank:false,
		format:'d/m/Y',
		value:gua
	});
	var poblacion_show = new Ext.form.ComboBox({
		emptyText:'Todas las poblaciones',
		hideLabel:true,
		store:ds_combo,
		displayField:'NOMBRE',
		valueField:'ID',
		loadingText:'Cargando poblaciones',
		minChars:0,
		allowBlank:true,
		disableKeyFilter:true,
		width:175
	});
	var razonsocial_show = new Ext.form.TextField({
		hideLabel:true,
		emptyText:'Palabras clave',
		width:175,
		allowBlank:true
	});
	var form;
	if(tipo=='fgu') {
		form = new Ext.form.FormPanel({
			labelAlign:'left',
			frame:true,
			items:[{
				xtype:'fieldset',
				title:'Busqueda Avanzada',
				autoHeight:true,
				items:[guardia_show,poblacion_show,razonsocial_show]
			}],
			buttons:[{text:'Buscar', handler:botonBuscar}]
		});
	}
	else {
		form = new Ext.form.FormPanel({
			labelAlign:'left',
			frame:true,
			items:[{
				xtype:'fieldset',
				title:'Busqueda Avanzada',
				autoHeight:true,
				items:[poblacion_show,razonsocial_show]
			}],
			buttons:[{text:'Buscar', handler:botonBuscar}]
		});
	}
	
	function botonBuscar(){
		if(form.getForm().isValid()){
			if(form_dibujado) clearOverlays();
			m_raz = escape(razonsocial_show.getValue());
			if(!m_raz) m_raz = 'none';
			m_gua = 'none';
			if(tipo == 'fgu') m_gua = escape(guardia_show.getRawValue());

			ds_mapas.load({params:{pob:poblacion_show.getValue(),raz:m_raz,gua:m_gua,tipo:tipo}});
			pinta_markers2(poblacion_show.getValue(), m_raz, m_gua, tipo);
		}
		else {
			Ext.MessageBox.alert('Campos obligatorios','El campo fecha es obligatorio.');
		}
	}
	
	if(!form_dibujado){
		form.render('resultados-form');
		form_dibujado = true;
	}
	
	function renderDir(value, p, record){
		if (record.data['HORARIO']!="")
			return String.format('<b>{0}</b><br/>{1}<br/>{2}, {3}<br/>Tlf: {4}<br/>Guardia: {5}', value, record.data['DIRECCION'], record.data['CODPOSTAL'], record.data['POBLACION'], record.data['TELEFONO'], record.data['HORARIO']);
		else if (record.data['GUARDIA']!="")
			return String.format('<b>{0}</b><br/>{1}<br/>{2}, {3}<br/>Tlf: {4}<br/>Horario: {5}', value, record.data['DIRECCION'], record.data['CODPOSTAL'], record.data['POBLACION'], record.data['TELEFONO'], record.data['GUARDIA']);
		else
			return String.format('<b>{0}</b><br/>{1}<br/>{2}, {3}<br/>{4}', value, record.data['DIRECCION'], record.data['CODPOSTAL'], record.data['POBLACION'], record.data['TELEFONO']);
	}
	
	var cm = new Ext.grid.ColumnModel([{
		header:"Resultados de la búsqueda",
		dataIndex:'FARMACIA',
		align:'center',
		renderer:renderDir,
		width:245
	}]);
	
	cm.defaultSortable = false;
	
	var grid = new Ext.grid.EditorGridPanel({
		el:'resultados-grid',
		ds:ds_mapas,
		cm:cm,
		width:270,
		height:270,
		selModel:new Ext.grid.RowSelectionModel({singleSelect:true})
	});
	
	grid.render();
	
	grid.on('rowdblclick',function(grid, rowIndex, e){
		if(gmarkers[rowIndex] != null){
			var marker = gmarkers[rowIndex];
			var point = marker.getPosition();
			map.setCenter(new google.maps.LatLng(point.lat(), point.lng()), 15);
			google.maps.event.trigger(marker, "click");
		}
		else
			alert("Dirección no encontrada");
	});
}

function pinta_markers2(pob, raz, gua, tipo){
	downloadUrl("../../PopulateMap?pob="+pob+"&raz="+raz+"&gua="+gua+"&tipo="+tipo,
		function(data){
			var xmlResults = data.documentElement.getElementsByTagName("results");
			for (var j=0; j<xmlResults.length; j++){
				dibuja(xmlResults[j]);
			}
		});
}
