var maps = Array();
var centerPoint = new GLatLng(52.274880, 5.410767);
var GGeocoder = null;
var GDir = new Array();

var mWidth = 650;
var mHeight = 400;
var mMargin = 20;

function load() {
	if (GBrowserIsCompatible()) {

		for (var n = 0; n < 2 ; n++ ) {

			maps[n] = new GMap2( document.getElementById( 'map_' + (n+1) ), {
				size: new GSize(660, 440)			});
			maps[n].setCenter(centerPoint, 8);
			maps[n].id =  n;

			GEvent.addListener(maps[n], 'drag', function() {panMaps(this)});
			GEvent.addListener(maps[n], 'zoomend', function() {adjustMaps(this)});
			GEvent.addListener(maps[n], 'maptypechanged', function() {adjustMaps(this)});

			// Geocoder
			GGeocoder = new GClientGeocoder() ;
			GGeocoder.setBaseCountryCode('nl');		// Standaard nederland


		}

		GDir[0] = new GDirections(
			maps[0]
		);

		GDir[1] = new GDirections(
			maps[1],
			document.getElementById('routebeschrijving')
		);

		GEvent.addListener(GDir[1], "addoverlay", function() {
				$('.googledir').clone().appendTo('#print_route');
			});

		maps[0].addControl(new GSmallZoomControl());
		maps[0].addControl(new GMapTypeControl());
		maps[1].addControl(new GSmallZoomControl());
		maps[1].addControl(new GMapTypeControl());

		var point = new GLatLng(51.65512790532986,5.667314529418945);
		var camera_point = new GLatLng(51.655193,5.667197);
		var html = '<div style="text-align: center"><img src="http://potmaat.nl/FTP/Afbeeldingen/Nieuwe map/Logo.png" style=\"max-width: 100px; max-height: 200px; padding-bottom: 10px\" class="route_logo"><br>Potmaat BV<br><b>Straat:</b> Mandenmakersstraat 9<br><b>Postcode:</b> 5405 BJ<br><b>Plaats:</b> Uden<br><img style=\"vertical-align: middle\" src="http://potmaat.nl/img/icons/phone.png"> 0413 - 246 059</div>';
		var zoom = 14;

		createHtmlMarker( point, html, {});

		maps[0].setCenter(camera_point, zoom);
		maps[1].setCenter(camera_point, zoom);

	}
}

function createHtmlMarker( point, html, options )
{
	maps[0].clearOverlays();
	maps[1].clearOverlays();

	maps[0].marker = new GMarker( point, options );
	maps[1].marker = new GMarker( point, options );

	GEvent.addListener(maps[0].marker, "click", function() {
		maps[0].marker.openInfoWindowHtml(html);
	});

	maps[0].addOverlay(maps[0].marker);
	maps[1].addOverlay(maps[1].marker);
};


function adjustMaps(map) {
	var activeMap = map.id;
	var pt = maps[activeMap].getCenter();
	var type = maps[activeMap].getCurrentMapType();
	var zoom = maps[activeMap].getZoom();

	for ( var m = 0; m < maps.length ; m++ ) {
		if (activeMap != m){
			maps[m].setCenter(pt,zoom,type);
		}
	}
}


function panMaps(map) {
	var activeMap = map.id;
	var pt = maps[activeMap].getCenter();

	for ( var m = 0; m < maps.length ; m++ ) {
		if (activeMap != m){
			maps[m].panTo(pt);
		}
	}
}

function getDirections(adres)
{
	$('#error').hide();
	GGeocoder.getLatLng(adres, function(point) {

		if (!point) {
			$('#error').show().html("Kon " + adres + " niet vinden");
			$('#routebeschrijving').hide();
			return;
		}

		var waypoints = new Array();

		waypoints.push(point);
		waypoints.push(maps[0].marker.getLatLng());

		GDir[0].loadFromWaypoints(waypoints);
		GDir[1].loadFromWaypoints(waypoints);

		$('#routebeschrijving').show();

	});
}


$(function(){
	$('#error').hide();

	$('#verkrijg_route').click(function(){
        getDirections( $('#adres').val() );

    });

    $('#adres').keydown(function(e){
        if( e.keyCode == 13 ) {
            getDirections( $(this).val() );
        }
    });
});