//var IE = document.all ? true : false;
//var map;
//var dirObj;
//var container;
//var loading = false;
//var directionsInfoDiv;
//var polyline;
//var startMarker;
//var endMarker;
//var dragMarker;
//var markerDragging = false;

//var baseIcon = new GIcon();
//baseIcon.iconSize=new GSize(17,21);
//baseIcon.iconAnchor=new GPoint(8,0);
//baseIcon.infoWindowAnchor=new GPoint(10,0);
// 
//var greenIcon = (new GIcon(baseIcon, "/images/route-van.png", null, ""));
//var redIcon = (new GIcon(baseIcon, "/images/route-naar.png", null, ""));
// 
//var baseIcon2 = new GIcon();
//baseIcon2.iconSize=new GSize(8,8);
//baseIcon2.iconAnchor=new GPoint(4,4);
//baseIcon2.infoWindowAnchor=new GPoint(4,0);
//var redIcon8 = (new GIcon(baseIcon2, "/images/redSquare_8.png", null, ""));
 
 
// Defaults --------------------------------------------
//var zoom = 7;
//var centerPoint = new GLatLng(52.13349,5.41626);

function load() {
//	doLoad();
}
 
function doLoad() {
	if (GBrowserIsCompatible()) {
		container = document.getElementById("RouteMap");

		directionsInfoDiv = document.getElementById("RouteDirections");
		dirObj = new GDirections();
		
		map = new GMap2(container);
		map.addMapType(G_PHYSICAL_MAP)
		map.setCenter(centerPoint, zoom, map.getMapTypes()[0]);
 
		map.addControl(new GScaleControl());
		map.addControl(new GLargeMapControl());
		map.enableContinuousZoom();
		map.enableScrollWheelZoom();
 
		GEvent.addListener(dirObj, "load", onDirectionsLoad);
		GEvent.addListener(dirObj, "error", onDirectionsError);
	}
}
 
///////////////////////////////////////////////////////////////////////////////////////////////////////

function markerDrag() {
	this.formField.value = this.getPoint().lat().toFixed(5) + ',' + this.getPoint().lng().toFixed(5);
}
 
function indicateLoading() {
	loading = true;
	displayLoadingMsg();
}

function displayLoadingMsg() {
	var oLMsg = document.getElementById('RouteLoading');
	oLMsg.style.display = '';
	oLMsg.style.left = container.offsetLeft + (container.clientWidth / 2) - (oLMsg.clientWidth / 2) + 'px';
	oLMsg.style.top = container.offsetTop + (container.clientHeight / 2) - (oLMsg.clientHeight / 2) + 'px';
	oLMsg.style.filter="alpha(opacity=70)";
 
	if (loading){
		var to = window.setTimeout('displayLoadingMsg()', 100);
	}
	else {
		oLMsg.style.display = 'none';
	}
}
 
function unload() {
	GUnload();
}

function getDirections() {
	var oDriveFrom = document.getElementById('van');
	var oDriveTo = document.getElementById('naar');
	oDriveTo = oDriveTo.options[oDriveTo.selectedIndex];
	
	directionsInfoDiv.style.display = '';
 
	var loadStr;
	if (oDriveFrom.value && oDriveTo.value) {
		if (oDriveFrom.value != "Adres, postcode en plaatsnaam van vertrekpunt."){
			loadStr = 'from:' + oDriveFrom.value;
			loadStr += ' to: ' + oDriveTo.value;
			document.getElementById('TekstVan').innerHTML = oDriveFrom.value;
			document.getElementById('TekstNaar').innerHTML = oDriveTo.value;
		} else {
			alert("Wilt u aangeven waarvandaan u wilt vertrekken?");
			oDriveFrom.focus();
		}
	}
	if (loadStr) {
		indicateLoading();
		dirObj.load(loadStr,{locale:'nl',getPolyline:true,getSteps:true});
	}
}
 
function onDirectionsLoad() {
	var html = '';
	var status = dirObj.getStatus();
	var bounds = dirObj.getBounds();
 
	map.clearOverlays();
 
	var copyrightHTML = dirObj.getCopyrightsHtml();
	var summaryHTML = dirObj.getSummaryHtml();
	var distance = dirObj.getDistance();
	var duration = dirObj.getDuration();
	var numRoutes = 1; //dirObj.getNumRoutes();
	var oDriveFrom = document.getElementById('van');
	var oDriveTo = document.getElementById('naar');
	var startLatLng = dirObj.getRoute(0).getStep(0).getLatLng();
	var endLatLng = dirObj.getRoute(0).getEndLatLng();
 
	polyline = dirObj.getPolyline();
	map.addOverlay(polyline);
 
	var numGeoCodes = dirObj.getNumGeocodes();
	var startPoint = dirObj.getGeocode(0);
	var endPoint = dirObj.getGeocode(numGeoCodes-1);
	addDragMarker(startPoint);
 
	var realStartMarker = new GMarker(startLatLng,{icon:greenIcon,draggable:true,bouncy:false});
	realStartMarker.formField = oDriveFrom;
	GEvent.addListener(realStartMarker,'drag',markerDrag);
	GEvent.addListener(realStartMarker,'dragend',getDirections);
	map.addOverlay(realStartMarker);
 
	var realEndMarker = new GMarker(endLatLng,{icon:redIcon,draggable:false,bouncy:false});
	map.addOverlay(realEndMarker);
 
	for (var r = 0 ; r < numRoutes ; r++ ) {
		var route = dirObj.getRoute(r);
		var startGeoCode = dirObj.getGeocode(r);
		var endGeoCode = dirObj.getGeocode(r+1);
		var endLatLng = route.getEndLatLng();
		var routeSummaryHTML = route.getSummaryHtml();
		var routeDistance = route.getDistance();
		var routeDuration = route.getDuration();

		html += '<div id="RouteSummaryDiv"><table cellspacing="0" cellpadding="4" width="100%">';
		html += '<tr><td>Afstand: '+routeDistance.html+ ' (' + routeDuration.html + ')</td></tr>';
		html += '</table></div>';
		
		html += '<div id="RouteSteps"><table cellspacing="0" cellpadding="4" width="100%">';
		var numSteps = route.getNumSteps();
		for (var s = 0 ; s < numSteps ; s++ ) {
			var step = route.getStep(s);
			var stepLatLng = step.getLatLng();
			bounds.extend(stepLatLng);
 
			var stepPolylineIndex = step.getPolylineIndex();
			var stepDescriptionHTML = step.getDescriptionHtml();
			var stepDistance = step.getDistance();
			var stepDuration = step.getDuration();
			html += '<tr class="row" onclick="showStep('+r+','+s+')"><td style="text-align:right;">' + (s+1) + '.</td><td> ' + stepDescriptionHTML + '</td><td  style="text-align:right;">' + stepDistance.html + '</td></tr>';
		}
		html += '</table></div>';
	}

    directionsInfoDiv.innerHTML = html;
   // directionsInfoPrintDiv.innerHTML = html;
	loading = false;
	polyline = dirObj.getPolyline();
 
	map.setCenter(bounds.getCenter(map), map.getBoundsZoomLevel(bounds)); 
}
 
function addDragMarker(placemark) {
	markerDragging = false;
 
	var point = new GLatLng(placemark.Point.coordinates[1],placemark.Point.coordinates[0])
 
	dragMarker = new GMarker(point, {icon:redIcon8,draggable:true,bouncy:false});
	GEvent.addListener(dragMarker, 'dragend', function(){
		if (dragMarker) {
			map.removeOverlay(dragMarker);
		}
		getDirections();
	});
 
	GEvent.addListener(dragMarker, 'dragstart', function(){
		markerDragging = true;
	});
 
	map.addOverlay(dragMarker);
	dragMarker.hide();
}

function onDirectionsError() {
	loading = false;
	directionsInfoDiv.innerHTML = 'Route kan helaas niet worden berekend.<br/>Error: ' + dirObj.getStatus().code;
}
 
function showStep(r, s) {
	map.closeInfoWindow();
	var step = dirObj.getRoute(r).getStep(s);
	var stepLatLng = step.getLatLng();
	var stepDescriptionHTML = step.getDescriptionHtml();
	var stepDistance = step.getDistance();
	var stepDuration = step.getDuration();
 
	map.openInfoWindowHtml(stepLatLng, stepDescriptionHTML);
}