window.onload= initialize;
window.onunload = bewaar;
var map
var tooltip
	 
function kaart_tiles(tile,zoom) {
	 if (zoom > 12) {
		return G_HYBRID_MAP.getTileLayers()[0].getTileUrl(tile,zoom)
	}
	else {
		return G_PHYSICAL_MAP.getTileLayers()[0].getTileUrl(tile,zoom)
	} 
}	 

function bewaar(){
	document.cookie = "map_zoom=" + map.getZoom() + "; path=/";
	document.cookie = "map_lat="  + map.getCenter().lat() + "; path=/";
	document.cookie = "map_lng="  + map.getCenter().lng() + "; path=/";
}
function getCookie(name, defval) {
	var nameEQ = name + "="; var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) {
			ck = '' + c.substring(nameEQ.length,c.length); if (ck != '') return ck;}
	}
	return defval;
}


    function initialize() {

      if (GBrowserIsCompatible()) {
	  
		var tilelayers = [new GTileLayer(null , 4, 12), new GTileLayer(null , 13, 18, {isPng:true})];
		tilelayers[0].getTileUrl = kaart_tiles;
		tilelayers[1].getTileUrl = function (tile,zoom) { if(zoom > 12) {return G_HYBRID_MAP.getTileLayers()[1].getTileUrl(tile,zoom)}  else {return '/grafiek/doorn/transp.png'}};
		var KAART = new GMapType(tilelayers, new GMercatorProjection(32), "Kaart", {shortname:"Kaart", errorMessage:"Geen detail: zoom uit"} ); 
		
	  	var zl  = parseInt(getCookie('map_zoom',4));
		var lat = parseFloat(getCookie('map_lat',46.255846818480315));
		var lng = parseFloat(getCookie('map_lng',7.66845703125));
		
		if (location.hash.indexOf(',') > 0) {
					lh = location.hash.replace('#','').split(',');
					lat = parseFloat(lh[0]); lng = parseFloat(lh[1]); zl = 15;
		}
	  
        map = new GMap2(document.getElementById("map"),{ mapTypes : [G_PHYSICAL_MAP, KAART] });	       
        map.addControl(new GLargeMapControl());
		map.addControl(new GScaleControl());

        map.setCenter(new GLatLng(lat,lng), zl, KAART);
		
		var ovcontrol = new GOverviewMapControl(new GSize(130,130)); 
      	map.addControl(ovcontrol);
		
		tooltip = document.createElement("div");
		tooltip.className='tooltip';
		document.getElementById("debody").appendChild(tooltip);
		tooltip.style.visibility="hidden";
		
		var markersArray=[];
		for (i=0; i < data.punten.length; i++){
			pnt = eval('new GLatLng(' + data.punten[i].ll + ')');
			var marker = createMarker(pnt, data.punten[i].t, data.punten[i].nr, data.punten[i].c)
			//map.addOverlay(marker);
			markersArray.push(marker);
			
		}
		icon = new GIcon();
		icon.image = "/grafiek/doorn/zoomin.png";
		icon.shadow = "/grafiek/doorn/schaduw.png";
		icon.iconAnchor = new GPoint(25, 25);
		icon.iconSize = new GSize(50, 50);	
		icon.shadowSize = new GSize(63, 63);	
					
		var cluster=new ClusterMarker(map, {markers:markersArray} );
		cluster.fitMapMaxZoom=18;
		cluster.intersectPadding=5;
		cluster.refresh();
        
      }
    }
	
	function clusterIcoon(nr){
		icon = new GIcon();
		icon.image = "/beeld/_50/" + nr + '.jpg';
		icon.shadow = "/grafiek/doorn/schaduw2.png";
		icon.iconAnchor = new GPoint(25, 25);
		icon.iconSize = new GSize(50, 50);	
		icon.shadowSize = new GSize(65, 65);
		return icon;
	}

	function createMarker(ll, title, nr, c) {

		icon = new GIcon();
		icon.image = "/beeld/_50/" + nr + '.jpg';
		icon.shadow = "/grafiek/doorn/schaduw.png";
		icon.iconAnchor = new GPoint(25, 25);
		icon.iconSize = new GSize(50, 50);	
		icon.shadowSize = new GSize(63, 63);	
	
		var aant = '<br/><em>' + c + " foto's</em>";
		var url = '/lijst?locatie=' + encode(title.split(';')[0]);
		if (c == '1') {
			aant = "<br/><em>1 foto</em>";
			url = '/' + nr;
		}
		var marker = new GMarker(ll,{icon: icon});
		GEvent.addListener(marker, "click", function() {location.href=url;});
		GEvent.addListener(marker,"mouseover", function() { showTooltip(marker, title + aant);});        
        GEvent.addListener(marker,"mouseout", function() {tooltip.style.visibility="hidden" });
		return marker;
  }


function resetmap(){
		map.setCenter(new GLatLng(46.255846818480315,7.66845703125), 4);
}

function showTooltip(marker,str) {
    tooltip.innerHTML = str;
	ll = marker.getPoint();
	tooltip.style.left = map.fromLatLngToContainerPixel(ll).x + eId('map').offsetLeft + 20 + 'px' ;
	tooltip.style.top  = map.fromLatLngToContainerPixel(ll).y + eId('map').offsetTop  + 20 + 'px' ;
	tooltip.style.visibility="visible";
}

function eId(w){return document.getElementById(w);}

//er gaat iets mismet escape() en utf-8 ?! daarom workaround
var unreserved = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz-_.~";
var reserved = "!*'();:@&=+$,/?%#[]";
var hexchars = "0123456789ABCDEFabcdef";

function gethex(decimal) {
  return "%" + hexchars.charAt(decimal >> 4) + hexchars.charAt(decimal & 0xF);
  }

function encode(decoded) {
  var encoded = "";
    for (var i = 0; i < decoded.length; i++ ) {
      var ch = decoded.charAt(i);
      if (unreserved.indexOf(ch) != -1) {
        encoded = encoded + ch;
      } else {
		var charcode = decoded.charCodeAt(i);
        if (charcode < 128) {
          encoded = encoded + gethex(charcode);
        }
        if (charcode > 127 && charcode < 2048) {
          encoded = encoded + gethex((charcode >> 6) | 0xC0);
          encoded = encoded + gethex((charcode & 0x3F) | 0x80);
        }
        if (charcode > 2047 && charcode < 65536) {
          encoded = encoded + gethex((charcode >> 12) | 0xE0);
          encoded = encoded + gethex(((charcode >> 6) & 0x3F) | 0x80);
          encoded = encoded + gethex((charcode & 0x3F) | 0x80);
        }
        if (charcode > 65535) {
          encoded = encoded + gethex((charcode >> 18) | 0xF0);
          encoded = encoded + gethex(((charcode >> 12) & 0x3F) | 0x80);
          encoded = encoded + gethex(((charcode >> 6) & 0x3F) | 0x80);
          encoded = encoded + gethex((charcode & 0x3F) | 0x80);
        }
      }
    } 
   return encoded;
}