var map;
var markerIcon;
var clusterIcon;
var cluster;


function createMarker(vector, eventIndex) 
{
   var marker;

   markerIcon = new GIcon();
   markerIcon.image = (countDays[eventIndex] == 1)? "/images/indicator_googlemaps_orange2.png" : "/images/indicator_googlemaps_blue2.png";
   markerIcon.iconSize = new GSize(24, 24);
   markerIcon.iconAnchor = new GPoint(19, 19);
   markerIcon.infoWindowAnchor = new GPoint(133, 8);           


   marker = new GMarker(vector, {icon:  markerIcon});
   marker.eventIndex = eventIndex;
   GEvent.addListener(marker, 
                      "mouseover", 
                      function() 
                      {
                         //marker.openInfoWindowHtml(getEventHtml(eventIndex));
                         marker.openExtInfoWindow(map,
                                                  "event",
                                                  getEventHtml(eventIndex),
                                                    {beakOffset: 3, 
                                                      paddingX:   40, 
                                                      paddingY:   20});


                      }
                     );
   GEvent.addListener(marker, 
                      "click", 
                      function() 
                      {
                         var eventDayId = (eventDayIds[eventIndex] == "-1")? "" : "/" + eventDayIds[eventIndex];
                         window.location = "/" + eventIds[eventIndex] + eventDayId + "/" + titlesUrls[eventIndex];
                      }
                     );
   return marker;              
}

function initialize()
{      
   if (GBrowserIsCompatible()) 
   {            
      map = new GMap2(document.getElementById("google_maps_canvas"));
      map.setCenter(new GLatLng(52.1326335, 5.29126595), 7);
      map.addMapType(G_PHYSICAL_MAP);
      map.removeMapType(G_HYBRID_MAP);
      map.removeMapType(G_SATELLITE_MAP);
      map.setMapType(G_PHYSICAL_MAP);       
      map.setMapType(G_PHYSICAL_MAP);       

      map.addControl(new GMapTypeControl());
      map.enableGoogleBar();

      markerIcon = new GIcon();
      markerIcon.image = "/images/indicator_googlemaps.png";
      markerIcon.iconSize = new GSize(24, 24);
      markerIcon.iconAnchor = new GPoint(19, 19);
      markerIcon.infoWindowAnchor = new GPoint(19, 19);           

      clusterIcon = new GIcon();
      clusterIcon.image = "/images/indicator_googlemaps_alt.png";
      clusterIcon.iconSize = new GSize(24, 24);
      clusterIcon.iconAnchor = new GPoint(19, 19);
      clusterIcon.infoWindowAnchor = new GPoint(19, 19);           

      GEvent.addListener(map,
                         "zoomend",
                         function()
                         {
                            map.closeExtInfoWindow(); 	                            
                         } 
                        );

   }
}

function myMouseOver(args)
{
   if(args.clusteredMarkers)
   {
      var html = '<div style="width: 180px;" overflow="auto">';
      var min = Math.min(args.clusteredMarkers.length, 5);
      window.status = args.clusteredMarkers.length;
      window.status += "min: " + min+ " ";
         
      for(index = 0; index < min; index++)
      {
         window.status += index + ":";
         marker = args.clusteredMarkers[index]
         html = html + getEventHtml(marker.eventIndex);
         //window.status = window.status + "#" + jobIds[marker.jobIndex];
      }
      html = html + "</div>";
      args.clusterMarker.openInfoWindowHtml(html);
   }   
}

function getEventHtml(eventIndex)
{
   var eventDayId = (eventDayIds[eventIndex] == "-1")? "" : "/" + eventDayIds[eventIndex];

   return "<div class=\"event_inner_contents\"> " 
     +    "   <a href=\"/" + eventIds[eventIndex] + eventDayId +"/" + titlesUrls[eventIndex] + "\"><b>" + titles[eventIndex] + "</b></a>"
     +    "   <br />"  
     +    "   <a href=\"/zoeken/" + organisatorUrls[eventIndex] + "?wis-selecties=1\">" + organisators[eventIndex] + "</a>"
     +    "   <br />" 
     +    ((pePointsNova[eventIndex]>0) ? "   Punten: "    + pePointsNova[eventIndex] + "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;" : "")    
     +    ((cities[eventIndex]!='') ? "Locatie: "   + cities[eventIndex] : '')
     +    "   <br />"
     +    ((dates[eventIndex]!='') ? "   Datum: "     + dates[eventIndex] : '') 
//     +    "   Begintijd: " + beginTimes[eventIndex] 
//     +    "   <br />"
//     +    "   Eindtijd: "  + endTimes[eventIndex] 
     +    "</div>";
}

function placeMarkers()
{
   var markers          = [];   

   for (var event = 0; event < latLngs.length; event++) 
   {                 
      var latitude   = latLngs[event].split(',')[0];
      var longitude  = latLngs[event].split(',')[1];
      if(latitude != '' && longitude != '')
      {                    
         var vector = new GLatLng(latitude, longitude);
         marker = createMarker(vector, event);
         markers.push(marker);
      }
   }     

   cluster = new ClusterMarker(map, {markers:                 markers,
                                     clusterMarkerIcon:       clusterIcon,
                                     clusterMarkerMouseOver : myMouseOver}
                              );
   cluster.fitMapToMarkers();
}