// JavaScript Document

var map = null;
var markers = [];
var markersmgr = null;
var directions = null;
function loadGMap()
{
	if (GBrowserIsCompatible()) 
	{   
		if(map==null)
		{
			map = new GMap2(document.getElementById('map'));
			 map.setUIToDefault();			
			//map.addControl(new GSmallMapControl());
			//map.addControl(new GMapTypeControl());		
	//http://www.google.nl/maps?f=q&source=s_q&hl=nl&geocode=&q=het+gooi&sll=52.469397,5.509644&sspn=3.4538,9.667969&ie=UTF8&ll=52.252397,5.235672&spn=0.108451,0.302124&z=12&iwloc=lyrftr:lmq:het+gooi,14283322389550780727,52.237051,5.19104
			var point = new GLatLng(52.237051,5.19104);
			map.setCenter(point, 10);
//			var bounds = map.getBounds();	
//			var zoom = map.getZoom();			
				
			//markersmgr = new GMarkerManager(map);
			directions = new GDirections(map, document.getElementById('maproute')); 			
			//refreshitems();		
			$('showroute').hide();
			/*(var plaatsen = $$('span.subtitel');
			for(i in plaatsen)
			{
				//Event.observe(plaatsen[i], 'click', function() { var plaats = 'baarn' ;getartsen(plaats); });	
				Event.observe(plaatsen[i], 'click', getartsen);					
			}*/
			//GEvent.addListener(map, 'dragend', refreshitems);	
			//GEvent.addListener(map, 'zoomend', refreshitems);
			//GEvent.addListener(map, 'moveend', refreshitems);					
			
		}
		//map.addOverlay(marker);
	}	
}
var refreshing = false;
var refreshingtimer = 1000;
var refreshingtimeout = null;
function refreshitems()
{
	refreshingtimeout = setTimeout(loaditems,refreshingtimer);			
}


function gotoadres()
{
	//alert('gotopostcode');
	var adres = $('adres').getValue();
	showaddress(adres); 
}

function loaditems2()
{
	if(refreshing)
		return;
	var bounds = map.getBounds();	
	var zoom = map.getZoom();					
	/*if(zoom<12)
		return;*/
	refreshing = true;	
	var minbounds = bounds.getSouthWest();
	var maxbounds = bounds.getNorthEast();
	var maxlat = maxbounds.lat();
	var maxlng = maxbounds.lng();
	var minlat = minbounds.lat();
	var minlng = minbounds.lng();		
	var corarray = '&maxlat='+maxlat+'&maxlng='+maxlng+'&minlat='+minlat+'&minlng='+minlng+'&zoom='+zoom;			
	
	var url = './lib/mapsearch.php?action=get_items&nummer='+paginanummer+corarray; 
	new Ajax.Request(url, {   method: 'get',   
		onSuccess: function(transport) 
		{    		
			//alert(transport.responseText);
			var myJson = eval('(' + transport.responseText + ')');
			
			/*	*/
//			$('maproute').update(myJson.sql + '<br>' + myJson.content);
			var items = myJson.items;
			//alert(items.length);
			var address = [];
			//map.clearOverlays();
			//alert(markers.length);
			for(var i=0; i<items.length; i++)
			{
//				showaddress(items[i]);
				var item = items[i];
				addmarker(item);
				//alert(item.address);
				
			}
			markersmgr.refresh() 
			//refreshing = false;
		}
	 });
}


function loaditems(lat,lng)
{
	//if(refreshing)
	//	return;
	var bounds = map.getBounds();	
	var zoom = map.getZoom();					
	/*if(zoom<12)
		return;*/
	//refreshing = true;	
	var minbounds = bounds.getSouthWest();
	var maxbounds = bounds.getNorthEast();
	var maxlat = maxbounds.lat();
	var maxlng = maxbounds.lng();
	var minlat = minbounds.lat();
	var minlng = minbounds.lng();		
	var corarray = '&maxlat='+maxlat+'&maxlng='+maxlng+'&minlat='+minlat+'&minlng='+minlng+'&zoom='+zoom+'&lat='+lat+'&lng='+lng;			
	var url = './lib/mapsearch.php?action=get_items&nummer='+paginanummer+corarray; 
	new Ajax.Request(url, {   method: 'get',   
		onSuccess: function(transport) 
		{    		
			//alert(transport.responseText);
			var myJson = eval('(' + transport.responseText + ')');
			
			/*	*/
//			$('maproute').update(myJson.sql + '<br>' + myJson.content);
			var items = myJson.items;
			//alert(items.length);
			var address = [];
			//map.clearOverlays();
			//alert(markers.length);
			$('showroute').hide();	
			$('searchmap').show()			
			
			var table = new Element('table', { border: 0});
			var tbody = new Element("tbody"); 	
			
			
			
			$('mapmarkers').insert(table);
			for(var i=0; i<items.length; i++)
			{
				if(i==0 || i%3==0)
				{
					tbody.insert(tr);
					var tr = new Element('tr');
				}
//				showaddress(items[i]);
				var item = items[i];
				var td = addverkooppunt(item);
				//alert(item.address);
				tr.insert(td);
				
			}
			var n = i%3;
			if(n!=0)
			{
				
				for(i=3-n; i<n; i++)
					tr.insert(new Element('td').update('&nbsp;'));
				
				tbody.insert(tr);
				//alert('help');
			}
			else
				tbody.insert(tr);
			table.insert(tbody);
			$('mapmarkers').insert(table);
			//markersmgr.refresh() 
			//refreshing = false;
		}
	 });
}


function showaddress(postcode)
{
	var geocoder = new GClientGeocoder();
	if(postcode=="")
		return;
	//var address = item.adres + ',' + item.postcode + ',' + item.plaats + ', Nederland';
	var address = postcode + ', Nederland';
		$('mapmarkers').update();
	if (geocoder) 
	{
		
		geocoder.getLatLng(address, 
			function(point)
			{ 
				if(point) 
				{ 
					//alert(point);
					//savepoint(item.nummer,point.lat(),point.lng());
							
					//alert(item.nummer + ' : ' + point.lat() + ' AND ' + point.lng() ); 		
					map.setCenter(point, 14);	
					loaditems(point.lat(),point.lng());						
				}
				else
				{
				//	alert(item.nummer+' niet goed');	
				}
			}
		);
	}		
	//alert(item.nummer); 			
}

function addverkooppunt(item)
{
	var td = new Element('td');
	td.insert(new Element('h3').update(item.titel));
	td.insert(new Element('h4').update("("+item.afstand+"km)"));	
	td.insert(new Element('p').update(item.address));
	var a = new Element('a').update('Toon route');
	a.writeAttribute('titel',item.titel);
	a.writeAttribute('afstand',item.afstand);
	a.writeAttribute('address', item.address);
	Event.observe(a,'click',selectverkooppunt);
	td.insert(a);
	/*var html = "";
	html += "<div class=\"verkooppunt\">";	
	html += "<h3>"+item.titel+" ("+item.afstand+")</h3>";
	html += ""+item.address+"";	
	html += "<br /><a href=\"#\" onclick=\"selectverkooppunt('"+item.address.replace("<br />",", ")+"');\">Toon route</a>";
	html += "</div>";*/
//	$('mapmarkers').insert(html);
	return td;
	//alert(item.nummer);
}

function addmarker(item)
{
	if(markers[item.nummer])
		return;
	var minZoom = 12;
		
	var latlng = new GLatLng(item.latitude,item.longitude);
	marker = new GMarker(latlng);
	var html = "";
	html += "<h3>"+item.titel+"</h3>";
	html += "<h4>("+item.afstand+" km)</h4>";	
	html += ""+item.address+"";		
	html += "<br /><br /><a href=\"#\" onclick=\"selectverkooppunt('"+item.latitude+","+item.longitude+"@"+item.address.replace("<br />",", ")+"');\">Toon route</a>";
	marker.bindInfoWindowHtml(html);
	markersmgr.addMarker(marker,minZoom);

	markers[item.nummer] = item.nummer;	
	//alert(item.nummer);
}

function selectverkooppunt(event)
{
	var element = Event.findElement(event, 'a');
	var address = element.readAttribute('address');
	var titel = element.readAttribute('titel');	
	var afstand = element.readAttribute('afstand');	
	$('routeaddress').update();
	var a = new Element('a').addClassName('terug').update('terug');
	Event.observe(a,'click',gotoadres);
	$('routeaddress').insert(a);
	$('routeaddress').insert(new Element('h3').update(titel)).insert(new Element('p').update(address));
	$('naar').value = address.replace("<br />",", ");
	setdirections();
}

function setdirections()
{
	$('showroute').show();
	$('searchmap').hide();	
	var van = $('adres').getValue();
	var naar = $('naar').getValue();
	directions.clear();
	//van += ', Nederland';
	//naar += ', Nederland';
	//alert(van + ' - ' + naar);
	directions.load('from: ' + van + ' to: ' + naar, { 'locale': 'nl_NL' });
}


Event.observe(window, 'load', loadGMap);