var map = null;
var tooltip = null;
var tIcon = null;

function load() {
  if (GBrowserIsCompatible()) {
    map = new GMap2(document.getElementById("map"));
    var point = new GLatLng(52.981430, 5.543550);
    map.setCenter(point, 10);
    
    /* create icon */
    tIcon = new GIcon();
    tIcon.shadow = "http://www.friesemerencampings.nl/design/icon.gif";
    tIcon.iconSize = new GSize(26, 21);
    tIcon.shadowSize = new GSize(26, 21);
    tIcon.iconAnchor = new GPoint(13, 11);
    tIcon.infoWindowAnchor = new GPoint(13,11);
    tIcon.infoShadowAnchor = new GPoint(13,11);
    map.addControl(new GOverviewMapControl(new GSize(49,49)));         
    addLocationToMap('Camping Poelzicht', 52.982705, 5.590432, './index.php?doc=poelzicht');
    addLocationToMap('Sathe Landzicht', 52.977896, 5.484871, './index.php?doc=landzicht');
    addLocationToMap('De Wetterspetter', 52.940052, 5.585926, './index.php?doc=wetterspetter');
    addLocationToMap('De Pressefinne', 52.937944, 5.560396, './index.php?doc=pressefinne');
    addLocationToMap('Camping Ykema', 52.986723, 5.510008, './index.php?doc=ykema');
    addLocationToMap('Camping De Oosthoek', 52.957236, 5.539434, './index.php?doc=oosthoek');
    addLocationToMap('Lān en Mar', 52.965455, 5.585518, './index.php?doc=lanenmar');
    addLocationToMap('Camping Het Klokhuis', 52.978571, 5.556722, './index.php?doc=klokhuis');
    tooltip = document.createElement("div");
    document.getElementById("map").appendChild(tooltip);
    tooltip.style.visibility="hidden";
    setTimeout("changeMapOverview()", 2000);
  }
}

function changeMapOverview() {
    var omap = MM_findObj("map_overview");
    omap.firstChild.style.border = "none";
    omap.firstChild.style.backgroundColor = "#0078A0";
    omap.firstChild.firstChild.style.border = "none";
    omap.firstChild.firstChild.style.height = "49px";
    omap.firstChild.firstChild.style.width = "49px";
}

function addLocationToMap( name, x, y, link ) {
  var point = new GLatLng(x,y);
  var marker = new GMarker(point, {icon: tIcon});
  marker.tooltip = '<div class="tooltip">'+name+'</div>';
  GEvent.addListener(marker, "click", function() {
    location.href = link;
  });     
  GEvent.addListener(marker, "mouseover", function() {
    showTooltip(marker);
  });                         
  GEvent.addListener(marker,"mouseout", function() {
    tooltip.style.visibility="hidden"
  });             
  map.addOverlay(marker);  
}

function showTooltip(marker) {
  tooltip.innerHTML = marker.tooltip;
  var point=map.getCurrentMapType().getProjection().fromLatLngToPixel(map.getBounds().getSouthWest(),map.getZoom());
  var offset=map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
  var anchor=marker.getIcon().iconAnchor;
  var width=marker.getIcon().iconSize.width;
  var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(offset.x - point.x - anchor.x + width,- offset.y + point.y +anchor.y)); 
  pos.apply(tooltip);
  tooltip.style.visibility="visible";
}