/*Iconen definieren*/
//male icon
//<![CDATA[

var myIcon = new GIcon();
myIcon.image = '/google/gfx/api/image.png';
myIcon.printImage = '/google/gfx/api/printImage.gif';
myIcon.mozPrintImage = '/google/gfx/api/mozPrintImage.gif';
myIcon.iconSize = new GSize(56,59);
myIcon.shadow = '/google/gfx/api/shadow.png';
myIcon.transparent = '/google/gfx/api/transparent.png';
myIcon.shadowSize = new GSize(86,59);
myIcon.printShadow = '/google/gfx/api/printShadow.gif';
myIcon.iconAnchor = new GPoint(56,59);
myIcon.infoWindowAnchor = new GPoint(28,0);
myIcon.imageMap = [48,4,49,5,49,6,49,7,49,8,49,9,49,10,49,11,49,12,49,13,49,14,49,15,49,16,49,17,49,18,49,19,49,20,49,21,49,22,49,23,49,24,49,25,49,26,49,27,49,28,49,29,49,30,49,31,49,32,49,33,49,34,49,35,49,36,49,37,49,38,49,39,49,40,49,41,49,42,49,43,49,44,49,45,49,46,48,47,38,48,37,49,36,50,35,51,34,52,33,53,32,54,31,55,30,56,29,57,28,58,27,58,26,57,25,56,24,55,23,54,22,53,21,52,20,51,19,50,18,49,17,48,7,47,6,46,6,45,6,44,6,43,6,42,6,41,6,40,6,39,6,38,6,37,6,36,6,35,6,34,6,33,6,32,6,31,6,30,6,29,6,28,6,27,6,26,6,25,6,24,6,23,6,22,6,21,6,20,6,19,6,18,6,17,6,16,6,15,6,14,6,13,6,12,6,11,6,10,6,9,6,8,6,7,6,6,6,5,7,4];


var pictureBaseIcon = new GIcon();
pictureBaseIcon.iconSize=new GSize(36,36);
pictureBaseIcon.iconAnchor=new GPoint(46,52);

/* einde iconen */

var map;
var markersfoo = []; 
var latEmpty;
var lonEmpty;
var mm=null;


function Gload() {
	if(GBrowserIsCompatible()) {
		var container = document.getElementById("map");
		map = new GMap2(container,{size:new GSize(680,350)} );
		map.setCenter(new GLatLng(latitude,longitude),0);
		map.setZoom(13);
		
		var relief=new GMapType(G_PHYSICAL_MAP.getTileLayers(),G_PHYSICAL_MAP.getProjection(),"Relief",{shortName:"Relief"});
		map.addMapType(relief);
		map.addMapType(G_SATELLITE_3D_MAP);
		map.addMapType(G_SATELLITE_MAP);
		
		map.addControl(new GLargeMapControl3D());	

		map.addControl(new MDControl());

		GEvent.addListener(map,"click",function(overlay,point) {
			if (!overlay) { $('#mapBubble').hide();}

		});
		GEvent.addListener(map,"dragstart",function(overlay,point) { 
			if (!overlay) { $('#mapBubble').hide();}
		
		});
		


		mm = new MarkerManager(map);
		showPlaats(id);
	}
}

function processMyData(data) { 
	var markersfoo = []; 
	var markers = [];
		
	var plaatsPointnaam = null;
	var profielFoto=null;
	var xml = GXml.parse(data); 
	var markersXml = xml.documentElement.getElementsByTagName("marker"); 
	var bounds = new GLatLngBounds();


	for (var i = 0; i < markersXml.length; i++) {
		var name = markersXml[i].getAttribute("naam");
		plaatsPointnaam = name;
		var profielfoto = markersXml[i].getAttribute("profielfoto");		
		var htmlInfo = markersXml[i].getAttribute("html"); 
		
		// latitude icoon maken
		var point = new GLatLng(parseFloat(markersXml[i].getAttribute("lat")), parseFloat(markersXml[i].getAttribute("long"))); 
		bounds.extend(point);				

		profielFoto = markersXml[i].getAttribute("profielfoto");
		
		var mylabel = {"url":profielFoto, "anchor":new GLatLng(8,10), "size":new GSize(36,36)};
		var Icon = new GIcon(myIcon, "/google/gfx/api/image.png", mylabel);		
			
		var markerOnMap = createMarker(i,point,'',htmlInfo,Icon, profielFoto); 
		markers.push(markerOnMap);
	}
		
	mm.clearMarkers(); 
	mm.addMarkers(markers,0,19);
	mm.refresh();


	if(markersXml.length==1){ // plaats tonen
		var name = markersXml[0].getAttribute("naam");
		var profielfoto = markersXml[0].getAttribute("profielfoto");		
		var htmlInfo = markersXml[0].getAttribute("html"); 
		var plaatsLat = parseFloat(markersXml[0].getAttribute("plaatslat"));
		var plaatsLon = parseFloat(markersXml[0].getAttribute("plaatslon"));
		var point = new GLatLng(plaatsLat, plaatsLon); 
		map.setCenter(new GLatLng(plaatsLat,plaatsLon),0);
		map.setZoom(13);		
	}else{
		map.setZoom(map.getBoundsZoomLevel(bounds));		
		map.setCenter(bounds.getCenter());			
	}
		
	
} 






var timeoutContinue=1;
var timeout=null;

/*if(timeoutContinue==1){
	setTimeout(function(){showNextPlaats();},1500);
}*/
function showPlaats(id){

	$('#mapBubble:visible').hide();
	GDownloadUrl("/google/vakantie_accom.php?vid="+id,processMyData);
}


function createMarker(i, point,name,htmlInfo,iconType, profielFoto) {
	
	var markerOnMap = new GMarker(point,{id:i,title:name,icon:iconType, draggable: false});

    GEvent.addListener(markerOnMap, "click", function() {
	    openOnMarker(markerOnMap,htmlInfo);
    });
	
   /* GEvent.addListener(markerOnMap, "mouseover", function() {
	    openOnMarker(markerOnMap,htmlInfo);
    });*/	

	return markerOnMap;
}
      				

var slide=0;
function displayPoint(marker, index, htmlInfo, slide){
	var markerOffset = map.fromLatLngToDivPixel(marker.getLatLng());	
	var moveEnd = GEvent.addListener(map, "moveend", function(){
		GEvent.removeListener(moveEnd);
	});
	if(slide==1){
		map.panTo(marker.getLatLng()); //sliden naar icon
	}
}	


function openOnMap(point, html, offset) {

    var agent = navigator.userAgent.toLowerCase();
    if ((agent.indexOf("msie") > -1) && (agent.indexOf("opera") < 1)){ this.ie = true} else {this.ie = false}

	this.offset = offset||new GPoint(0,0);
	this.point = point;

	$('.bubblecontentMap').html(html);

	// pixel relative to map world
	var p = map.fromLatLngToDivPixel(point);
	
	// map world relative to map container
	var dragObject = map.getPane(G_MAP_MAP_PANE).parentNode;
	var x = p.x + parseInt(dragObject.style.left);
	var y = p.y + parseInt(dragObject.style.top);

	x += offset.x;
	y -= offset.y;
	
	//$('.bubblepopupMap').css('width','200px');	/* verplicht */
	x -= $('#mapBubble').width();	
	x -= 30; // space between map and contentcontainer
	y += 68;

	$('#mapBubble').css("margin-left",x+"px");
	$('#mapBubble').css("margin-top",y+"px");	
	$('#mapBubble').css("position","absolute");	
	$('#mapBubble').css("z-index","101");	
	$('#mapBubble').css("display","block");
}
      
function openOnMarker(marker,html) {
	var vx = marker.getIcon().iconAnchor.x - marker.getIcon().infoWindowAnchor.x;
	var vy = marker.getIcon().iconAnchor.y - marker.getIcon().infoWindowAnchor.y;
	this.openOnMap(marker.getPoint(), html, new GPoint(vx,vy));
}




function MDControl(){}MDControl.prototype=new GControl();

MDControl.prototype.initialize=function(map) {

	var container = document.createElement("div");
	var selMap = document.createElement("select");
	selMap.id = "selMap";
	selMap.className ="s_button";
	selMap.title ="Verander de map style";

	// Create options list for map types
	var mts = map.getMapTypes();
	for(var i = 0; i < mts.length; i++) {

		var text = "   " + mts[i].getName();
		selMap.options[selMap.options.length] = new Option(text, i);
	}

	selMap.selectedIndex = 0;
	
	GEvent.addDomListener(selMap, "change", function() {
		var choose = mts[selMap.options[selMap.selectedIndex].value];
		map.setMapType(choose);
		selMap.blur();
	});

	container.appendChild(selMap);
	
	map.getContainer().appendChild(container);
	return container;
}


MDControl.prototype.getDefaultPosition= function() {
	return new GControlPosition(G_ANCHOR_TOP_RIGHT,new GSize(7,7));
}
//]]>
