google.load("maps", "2.x");

var InvMaps = function(){
	
	return {
		createBaseMap: function(id, center, zoom, type){
			if (window.baseMap)
				return window.baseMap
			
			// Create the map
			var map = new google.maps.Map2(document.getElementById(id));
			
			// Set type
			type = type || G_HYBRID_MAP;
			map.setMapType(type);
			
			// Set center and zoom
			var center = center || new google.maps.LatLng(50.978721, 5.306396);
			var zoom = zoom || 10;
			map.setCenter(center, zoom);

			// Add the controls
			map.addControl(new google.maps.SmallZoomControl());
			map.addControl(new google.maps.MenuMapTypeControl());
			//map.addControl(new StreetViewControl());
			
			// Fix copyright breakout
			map.getContainer().style.overflow = "hidden";
			
			// Register as global and return
			window.baseMap = map;
			return window.baseMap;
		},
		
		createIcon: function(icon, w, h){
			var i = new google.maps.Icon(G_DEFAULT_ICON, icon);
			var w = w | 16;
			var h = h | 16;
			var iconCenter = new google.maps.Point(w/2, h/2);

			i.iconSize = new google.maps.Size(w, h);
			i.shadow = null;
			i.shadowSize = new google.maps.Size(0,0);
			i.iconAnchor = iconCenter;
			i.infoWindowAnchor = iconCenter;
			
			return i;
		},
		
		createPanoramioIcon: function(icon, size){
			
			size = size || 'medium';
			icon = icon.replace('/'+size+'/', '/mini_square/');
			i = this.createIcon(icon, 20, 20);
			i.shadow = 'http://www.rlkm.be/design/images/layout/icons/markers/photo_shadow.png';
			i.shadowSize = new google.maps.Size(35, 24);
			
			return i;
		},
		
		createHeritageIcon: function(){
			
			var i = new google.maps.Icon(G_DEFAULT_ICON, 'http://www.rlkm.be/design/images/layout/icons/markers/heritage.png');
			var w = 18;
			var h = 32;
			var iconCenter = new google.maps.Point(w/2, h);
			
			i.iconSize = new google.maps.Size(w, h);
			i.shadow = 'http://www.rlkm.be/design/images/layout/icons/markers/heritage_shadow.png';
			i.shadowSize = new google.maps.Size(34, 32);
			i.iconAnchor = iconCenter;
			
			return i;
		},
		
		createHeritageClusterIcon: function(){
			
			var i = new google.maps.Icon(G_DEFAULT_ICON, 'http://www.rlkm.be/design/images/layout/icons/markers/heritage_cluster.png');
			var w = 34;
			var h = 38;
			var iconCenter = new google.maps.Point(w/2, h);
			
			i.iconSize = new google.maps.Size(w, h);
			i.shadow = 'http://www.rlkm.be/design/images/layout/icons/markers/heritage_cluster_shadow.png';
			i.shadowSize = new google.maps.Size(46, 24);
			i.iconAnchor = iconCenter;
			
			return i;
		},
		
		createStartpointIcon: function(){
			
			var i = new google.maps.Icon(G_DEFAULT_ICON, 'http://www.rlkm.be/design/images/layout/icons/markers/startpunt.png');
			var w = 18;
			var h = 32;
			var iconCenter = new google.maps.Point(w/2, h);
			
			i.iconSize = new google.maps.Size(w, h);
			i.shadow = 'http://www.rlkm.be/design/images/layout/icons/markers/startpunt_shadow.png';
			i.shadowSize = new google.maps.Size(34, 32);
			i.iconAnchor = iconCenter;
			i.infoWindowAnchor = new google.maps.Point(7,15);
			
			return i;
		},
		
		createPolyLine: function(coordinates, color, width){
	
			if(coordinates.length <= 0) {
				return;
			}
			
			var points = [];
			
			for (i = 0; i < coordinates.length; i++){
				var coord = coordinates[i];
				points.push(new google.maps.LatLng(
					parseFloat(coord.latitude), 
					parseFloat(coord.longitude)
				));
			}
		
			var color = color || '#ff6600';
			var width = width || 2;
			var opacity = 1;
			var overlay = new google.maps.Polygon(points,color,width,opacity,"#000000",0);
			
			return overlay;
			
		}
	}
}();
var map;
var gdir;
var geocoder = null;
var addressMarker;
var center;
var locale;

function initializeStartpoint() {
	
	center = new google.maps.LatLng(50.899570, 5.662766);
	map = InvMaps.createBaseMap('map', center, 16, G_HYBRID_MAP);
	map.addControl(new StreetViewControl());
	
	gdir = new GDirections(map, document.getElementById("route"));
    GEvent.addListener(gdir, "load", onGDirectionsLoad);
    GEvent.addListener(gdir, "error", handleErrors);
	
	var icon = InvMaps.createStartpointIcon();
	var marker = new google.maps.Marker(center, {icon: icon});
	google.maps.Event.addListener(marker, 'click', function(e){
		this.openInfoWindowHtml('<div class="gmapinfowin">'+
			'<h2>Startpunt</h2><p>Pietersheim</p>'+
		'</div>');
	});
	map.addOverlay(marker);
	
}
google.setOnLoadCallback(initializeStartpoint);


function planRoute(fromAddress) {
    if(fromAddress == ''){
        window.refresh();
    }

	document.getElementById('routebeschrijving').style.display = 'none';
	map.clearOverlays();
	toAddress = '50.899570, 5.662766';
	gdir.load("from: " + fromAddress + ", Belgium to: " + toAddress, { "locale": locale });			
}

function handleErrors()
{
	document.getElementById('routebeschrijving').style.display = 'none';
	if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
		alert("Het opgegeven adres kon niet teruggevonden worden, dat kan te wijten zijn aan het feit dat het een recent of onjuist adres is");
	else if (document.getElementById("van").value=="")
		alert('Gelieve een adres op te geven…');
	else 
		alert("Unknow error");
}

function onGDirectionsLoad(){
	document.getElementById('routebeschrijving').style.display = 'block';
	document.getElementById('printBtn').style.display = 'block';
	
	map.setMapType(G_NORMAL_MAP);
	
	window.location = "#routecompleteanker";
}


function initializeMarkers() {
	
	var map = InvMaps.createBaseMap('map');
	map.addControl(new StreetViewControl());
	
	var markerManager = new MarkerManager(map);
	window.defaultMarkers = markerManager;
	var markerSet = [];
	
	// Add Markers
	
	markerManager.addMarkers(markerSet, 12, 18);	markerManager.refresh();	}
google.setOnLoadCallback(initializeMarkers);
// http://www.panoramio.com/map/get_panoramas.php?order=upload_date&set=2678463&from=0&to=20&minx=-180&miny=-90&maxx=180&maxy=90&size=medium
function initializePanoramio(){
	
	var map = InvMaps.createBaseMap('map', false, false, G_HYBRID_MAP);
	
	var bounds = map.getBounds();
	
	var infowinPicSize = 'thumbnail';
	
	new JsonP('http://www.panoramio.com/map/get_panoramas.php', {
		data: {
			iod: 'none',
			viewType: 'json'
		},
		queryString: 'order=upload_date&set=2678463&from=0&to=100&minx=-180&miny=-90&maxx=180&maxy=90&size='+infowinPicSize,
		onComplete: function(data){
			if ($chk(data.photos)){
				
				var markerManager = new MarkerManager(map);
				window.panoramioMarkers = markerManager;
				var markerSet = [];
				
				data.photos.each(function(photo){
					var marker = new google.maps.Marker(new google.maps.LatLng(
						photo.latitude,
						photo.longitude
					), { icon: InvMaps.createPanoramioIcon(photo.photo_file_url, infowinPicSize) });
					marker.photoData = photo;
					
					google.maps.Event.addListener(marker, 'click', function(e){
						var p = this.photoData;
						this.openInfoWindowHtml('<div class="gmapinfowin">'+
							'<h2>'+p.photo_title+'</h2>'+
							'<a href="'+p.photo_url+'" target="panoramio"><img src="'+p.photo_file_url+'" height="'+p.height+'" width="'+p.width+'" class="panoramio" /></a>' +
							'<p style="width:250px;"><em>Photo by '+p.owner_name+' and Panoramio</em></p>'+
						'</div>');
					});
					
					markerSet.push(marker);
				});
				
				markerManager.hide();
				markerManager.addMarkers(markerSet, 13, 18);
				markerManager.refresh();
				
				/**
				 * Custom Control
				 */
				function photosCtrl(){}
					photosCtrl.prototype = new google.maps.Control(true, false);
					photosCtrl.prototype.initialize = function(map){
						this.container = document.createElement("div");
						this.setButtonStyle_(this.container);
						this.container.innerHTML = "Toon foto's";
						map.getContainer().appendChild(this.container);
						
						// handlers
						google.maps.Event.addDomListener(this.container, "click", function(container) {
							window.panoramioMarkers.toggle();
							
							if (window.defaultMarkers)
								window.defaultMarkers.toggle();
								
							
							
							if (window.panoramioMarkers.isHidden())
								this.innerHTML = "Toon foto's";
							else
								this.innerHTML = "Verberg foto's";
						});

						return this.container;
					}
					photosCtrl.prototype.getDefaultPosition = function() {
						return new GControlPosition(G_ANCHOR_TOP_RIGHT, new GSize(100, 7));
					}
					photosCtrl.prototype.setButtonStyle_ = function(button) {
						button.style.color = "#000000";
						button.style.backgroundColor = "white";
						button.style.font = "12px Arial";
						button.style.fontWeight = "bold";
						button.style.border = "1px solid black";
						button.style.padding = "1px 6px";
						button.style.cursor = "pointer";
					}
				
				map.addControl(new photosCtrl);
			}
		}
	}).request();
	
}
google.setOnLoadCallback(initializePanoramio);