var map      = null;
var arPolygons = new Array();
var bound    = null;
var markers  = new Array();

// Initialize Google maps
function initialize()
{
    if (GBrowserIsCompatible())
    {
        // Initialize map object
        map = new GMap2(document.getElementById("gmap"));
        bound = new GLatLngBounds();
        map.setCenter(new GLatLng(51.721683, 5.641773), 10);
        
        //Set controls
        map.setMapType(G_NORMAL_MAP);
        map.addControl(new GLargeMapControl());
        map.enableContinuousZoom();
        map.enableDoubleClickZoom();
        
        //Add weideblik marker
        var locationCamping = {
         name: 'De Buitenhorst',
         address: 'Franse Baan<br>5364 RS Schaijk<br>Tel: 0486-464686',
         coord: new GLatLng(51.721683, 5.641773)
        };
        var icon   = new GIcon(G_DEFAULT_ICON, 'gfx/marker_buitenhorst.png');
        icon.iconSize = new GSize(55, 55);
        icon.shadowSize = new GSize(55, 55);
        icon.iconAnchor = new GPoint(27, 55);
        icon.infoWindowAnchor = new GPoint(27, 27);
        icon.mozPrintImage = 'gfx/marker_buitenhorst.png';
        icon.transparent = 'gfx/marker_buitenhorst.png';
        icon.imageMap = [0,0, 54,0, 54,54, 0,54];
        var marker = new GMarker(locationCamping['coord'], {zIndexProcess:orderOfCreation,icon:icon});
        GEvent.addListener(marker, "click", function() {
           map.openInfoWindowHtml(locationCamping['coord'], '<p><strong>'+locationCamping['name']+'</strong><br>'+locationCamping['address']+'</p>');
        });
        map.addOverlay(marker);
        
        //Add markers
        for (var i=0; i<loc.length; i++)
           createMarker( loc[i] );
        
        /*/Add polygons
        for (var i=0; i<arPolygons.length; i++)
           createPolygon( arPolygons[i] );*/
    }
}
window.setTimeout(initialize, 0);



function orderOfCreation(marker, b)
{
   return 1;
}

function createMarker(pData)
{
   //Create marker
   var point  = new GLatLng(pData.coords[0], pData.coords[1]);
   var marker = new GMarker(point, {zIndexProcess:orderOfCreation});
   var state  = 'inactive';
   
   GEvent.addListener(marker, 'mouseover', function()
   {	
	   $('#infoWindow').show();
	   $('#infoWindow').html('<div class="infoWindowLocation"><strong>'+pData.htmltitle+'</strong><br>Klik voor meer informatie</div>');
	   //Set marker Over image
	   if(state != 'active')
		   marker.setImage('gfx/markerOver.png');
   });
   
   GEvent.addListener(marker, 'mouseout', function()
   {
	   $('#infoWindow').hide();
	   $('#infoWindow').html('');
	   //Set marker original image
	   if(state != 'active')
		   marker.setImage('gfx/markerOriginal.png');
   });
   //Add onclick > request
   GEvent.addListener(marker, 'click', function()
   {
	  loadPage(pData.ids);
	  map.panTo(point);
      //Set marker active image
      marker.setImage('gfx/markerVisited.png');
      state = 'active';
      
      //set menu items active
      $('ul.locmenu ul').slideUp('normal');
      $('.active').removeClass('active');
      $('#' + pData.ids).parent().slideDown('normal').addClass('active');
      $('#' + pData.ids).addClass('active');
      
   });
   
   markers.push({
	   marker: marker,
	   point: point,
	   id: pData.id,
	   ids: pData.ids
   });
   //Add to map
   map.addOverlay(marker);
}

function loadPage(ids)
{
	$('#contentLocation').html('<div class="titleContainer"><h1>Loading...</h1></div><div class="text"><img src="gfx/ajax-loader.gif"> Een ogenblik geduld aub. De pagina wordt geladen.</div><br class="clear"><br class="clear">');
    $('#contentLocation').load('./omgeving/request/' + ids);
}

function loadMarker(ids)
{
	for (var i=0; i<markers.length; i++)
	{
		if (markers[i].ids == ids)
		{
			loadPage( markers[i].ids );
			markers[i].marker.setImage('gfx/markerVisited.png');
			
			map.panTo(markers[i].point);
			return;
		}
	}
}


/*
function createPolygon(pData)
{
   //Create polygon 1
   var polygon = new GPolygon(
      pData.coords,     //Coordinates
      "#2B7878", 4, 0.6,  //Stroke
      "#96B73C", 0.8    //Fill
   );
   
   //Add onclick functionality
   GEvent.addListener(polygon, 'click', function()
   {
      $('#main').load('./camping-brabant/request/' + pData.pageIds); 
   });
   
   //Change cursor on mouse-over
   GEvent.addListener(polygon, 'mouseover', function() {
      map.getDragObject().setDraggableCursor('pointer');
   });
   GEvent.addListener(polygon, 'mouseout', function() {
      map.getDragObject().setDraggableCursor('default');
   });
   
   //Add to map
   map.addOverlay(polygon);
   
   //Add contents in polygon
   var label = new ELabel(pData.labelCoords, pData.label, 'mapLabel');
   map.addOverlay(label);
}
*/