/*
	JavaScript Include

	Name:	 	: communited.googlemaps.js
	Address		: http://www.krimpenaandenijssel.nl	
	Copyright	: Your Company Name
	Author	 	: 
	Created	 	: 2010-03-19T13:43:09

	About this JavaScript include:
	...
*/

var map;
var latlng;
var marker;
var markers = [];
var infowindow;
var infowindows = [];
var directionsService = new google.maps.DirectionsService();
var controlmarkers = new Boolean(false);
var button;

function changeFilter(){
	$('button').parent('.gmnoprint').css({
		'z-index':'',
		'width':'20px'
		});
	$('button').parent().css({'filter':'','background':'url(http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png)'});
	}

function createMarkerButtons() {
	var button_style = 'width:20px;height:34px;overflow:hidden;border:none;cursor:pointer;position:absolute;background:url(http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png);padding:1px;';
	$('div[title][class="gmnoprint"]').each(function() {
			button = document.createElement( 'button' );
			button.setAttribute('style',button_style);
	  		button.style.cssText = button_style;
			$(this).append(button);
			if ($(this).attr('log'))
	  		{
        				$(this).style.filter = '';
        				$(this).style.background = 'url(http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png)';
      			}
		});
	changeFocus();
	}

function createControlButtons() {
	var button_style = 'width:20px;height:20px;border:none;cursor:pointer;position:absolute;background:url(http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png);padding:1px;';
	$('div[title][class!="gmnoprint"]').each(function() {
		if ($(this).height() != '169' && $(this).height() != '12')
		{
			button = document.createElement( 'button' );
			button.setAttribute('style',button_style);
	  		button.style.cssText = button_style;
			$(this).append(button);
				if ($(this).attr('log'))
	  			{
        					$(this).style.filter = '';
        					$(this).style.background = 'url(http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png)';
      					}
				}
				});		
}

function changeFocus() {
	// set focus for firefox not possible without href
	$('area[title]').each(
		function() {
			if ( !$(this).is('[href]'))
			{
				$(this).attr('href', 'javascript:void(0)');
			}
		});

	// Firefox and Google Chrome focus on markers in area
	$('area').parents('.gmnoprint').children('img').attr('src','http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png');
	$('area').focus(function()
	{
		$(this).parents('.gmnoprint').css({
		'outline':'1px dotted #000000',
		'opacity':'1'
		});
	});
	$('area').blur(function()
	{
		$(this).parents('.gmnoprint').css({
		'outline':'none',
		'opacity':'0.01'
		});
	});
	changeFilter();
}

function createMarker(point,map,titel,contentstring) { 
	infowindow = new google.maps.InfoWindow({
		content: contentstring
	});
	marker = new google.maps.Marker({
        optimized: false,
		position: point,
       	map: map,
		title: titel
    	});

	markers.push(marker);
	infowindows.push(infowindow);
	
	google.maps.event.addListener(marker, "click", function() {
		infowindow.setContent(contentstring);
		infowindow.open(map,this);
		$('img').css('z-index','');
		$('.location').parent().css('overflow','hidden');
		$('.route-sluiten').click(function(e) {
			$('button').parent('.gmnoprint').css('z-index','');
			$('button').parent().css({'filter':'','background':'url(http://maps.gstatic.com/intl/nl_ALL/mapfiles/markerTransparent.png)'});
			e.preventDefault();
			infowindow.close();
			});
		});
	}

function showDirections(id) {
	jQuery("#directions").show();
	jQuery("#directions").html("");
	directionsDisplay.setMap(map);

	var request = {
		origin: jQuery("#route_from_"+id).val(),
		destination: jQuery("#route_to_"+id).val(),
		travelMode: google.maps.DirectionsTravelMode.DRIVING
	};
	directionsService.route(request, function(response, status) {
      	if (status == google.maps.DirectionsStatus.OK) {
	        directionsDisplay.setDirections(response);
	      }
	else if(status == google.maps.DirectionsStatus.ZERO_RESULTS)
	{
		alert("Geen resultaten");
	}
	else if(status == google.maps.DirectionsStatus.NOT_FOUND)
	{
		alert("Vertrek of Bestemming niet gevonden");
	}
	else
	{
		alert("Er is een onbekende fout opgetreden");
	}

	});
	setTimeout('createMarkerButtons();',2000);
}

function hideDirections() {
	for (var i = 0; i < markers.length; i++) {  
		markers[i].setVisible(true);
	}
	directionsDisplay.setMap(null);
	jQuery("#directions").hide();
	jQuery("#hidedirections").hide();
	map.setCenter(new google.maps.LatLng(51.917697,4.593573));
	map.setZoom(13);
	setTimeout('createMarkerButtons();',2000);
	}

function onGDirectionsLoad(){ 
	for (var i = 0; i < markers.length; i++) {  
	infowindows[i].close();
	markers[i].setVisible(false);
	}
	jQuery("#hidedirections").show();
}

function changemaptype(state) {
	if( state == 0)
	{
		map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
	}
	else if( state == 1)
	{
		map.setMapTypeId(google.maps.MapTypeId.SATELLITE);
	}
	else if( state == 2)
	{
		map.setMapTypeId(google.maps.MapTypeId.TERRAIN);
	}
	else if ( state == 3)
	{
		map.setMapTypeId(google.maps.MapTypeId.HYBRID);
	}
}

function initMap() {
	// marker selection dropdown
	$("#selTerm").change(
		function(){
			this.form.submit();
		});	
		
	// set google maps options
	var myLatlng = new google.maps.LatLng(51.917697,4.593573); // map center position
  		var myOptions = {
      			zoom:13,
      			center:myLatlng,
			navigationControl:true,
			scaleControl:false,
			mapTypeControl:false, // custom maptype control used
			streetViewControl:false,
      			mapTypeId:google.maps.MapTypeId.ROADMAP
    		}

	map = new google.maps.Map($("#locations")[0], myOptions);

	// listeren for keyboard funtionality
	google.maps.event.addDomListener(map, 'tilesloaded', function(){
		if(controlmarkers == false){
			setTimeout('createControlButtons();',2000);
			setTimeout('createMarkerButtons();',2000);
			setTimeout('changeFocus();',2000);
			controlmarkers = true;
		}
	});
		
	// listener to set focus on markers (IE only)
	google.maps.event.addDomListener(map, 'idle', function(){
		changeFilter();
	});

	// show direction on the map (initiate new map)
	directionsDisplay = new google.maps.DirectionsRenderer();
	directionsDisplay.setMap(map);
	directionsDisplay.setPanel($("#directions")[0]);
	google.maps.event.addListener(directionsDisplay, 'directions_changed', onGDirectionsLoad);
	
	// trigger function to hide directions
	$("#hidedirections").live("click", hideDirections);

	// add custom maptype dropdown
	$('#locations').prepend('<select name="DropDownListMaptype" id="DropDownListMaptype" class="DropDownListMaptype" onchange="changemaptype(this.selectedIndex)"><option value="Kaart">Kaart</option><option value="Satelliet">Satelliet</option><option value="Terrein">Terrein</option><option value="Hybrid">Hybrid</option></select>');	
		
	// create markers
	$('#legenda_kaart').children().each(function() {
		var lat = $(".latitude", this).html();
		var lng = $(".longitude", this).html();
		latlng = new google.maps.LatLng(lat,lng);
		var titel = $(".titel", this).html();
		var details = $("a:first", this).attr("href");
			
		var id = $("div:first", this).attr("id");
		id = id.replace("location_", "")
		var contentString ='<div class="location"><div><strong>'+ titel + '</strong><a href="Int/Gemeente/Krimpen-op-de-kaart-v3.html" class="route-sluiten">Sluiten</a></div><div><a href="' + details + '">Details</a></div><div><label for="route_from_'+id+'">Uw adres</label></div><div><input type="text" class="field" name="route_from_'+id+'" id="route_from_'+id+'" /><input class="submit" id="createDirections_'+id+'" type="submit" value="Plan route" onclick="showDirections('+id+')"/></div><input type="hidden" id="route_to_'+id+'" value="'+lat+','+lng+'" />';
		createMarker(latlng,map,titel,contentString);
	});
}