/**
 * @author Theo Bakker, WHELP.nl
 * @title 36
 */

//load Google Map
var address;
var geocoder;
var gmarkers = [];
var html;
var htmls =[];
var i = 0;
var icon;
var label;
var map;
var marker;
var markers;
var randomnumber;
var side_bar_html = "";
var xml;
var iconpath = "http://www.whelp.nl/googlemaps/images/";

function load() {
  if (GBrowserIsCompatible()) {

	var map = new GMap2(document.getElementById("map"));
	var geocoder = new GClientGeocoder();
	var mini = new GOverviewMapControl(new GSize(100,100));

	//add controls
    map.addControl(new GMapTypeControl());
	map.addControl(mini);
	//mini.hide();

	//create randomnumber to prevent caching and retrieve xml file
	var randomnumber=Math.floor(Math.random()*11111)
    GDownloadUrl("/calendar.xml?random="+randomnumber, function(data, responseCode) {
    var xml = GXml.parse(data);

	//store markers in markers array
    var markers = xml.documentElement.getElementsByTagName("marker");


	//loop over the markers array
    for (var i = 0; i < markers.length; i++) {
		var lat = markers[i].getAttribute("lat");
		var lng = markers[i].getAttribute("lng");
		var url = markers[i].getAttribute("url");
		var html = GXml.value(markers[i].getElementsByTagName("infowindow")[0]);
		var date = markers[i].getAttribute("date");
		var label = markers[i].getAttribute("label");
		var iconColor = markers[i].getAttribute("iconColor");

		icon = getIcon(date, iconColor);
        showLatLng(map,geocoder,lat,lng,html,label,icon,url, date);
    } //close for loop

  	}); //close GDownloadUrl
  } //close GBrowserIsCompatible
} //close load

//Create marker and set up event window
function createMarker(point,html,label,icon, date){
  var marker = new GMarker(point,icon);
  GEvent.addListener(marker, "click", function() {
     marker.openInfoWindowHtml(html);
  });
  // save the info we need to use later for the side_bar
  gmarkers[i] = marker;
  htmls[i] = html;
  // add a line to the side_bar html
  side_bar_html += '<a href="javascript:myclick(' + i + ')"><b>' + label + '</b> ' + date + '</a><br>';
  document.getElementById("side_bar").innerHTML = side_bar_html;
  i++;
  return marker;
}


function showLatLng(map,geocoder,lat,lng,html,label,icon,url, date) {
	var point = new GLatLng( lat, lng );
	map.setCenter(point, 6);
	html = date + '<br />' + html;
	if (url && url != 'undefined') {	
	var marker = createMarker(point,html+'<br/><br/><a target="_blank" href="'+url+'">Website</a>',label,icon);
	} else {
	var marker = createMarker(point,html,label,icon, date);
	}
	map.addOverlay(marker);
	map.addControl(new GMapTypeControl());
}

// create marker icon
function getIcon(text, color){
	icon = new GIcon();
	icon.image = "http://www.faolansnuttah.nl/images/gMapIcon.png.php?imgTitle="+escape(text)+"&bgColor="+color;
	//icon.iconSize = new GSize(24, 23);
	icon.iconAnchor = new GPoint(20, 0);
	icon.infoWindowAnchor = new GPoint(20, 10);
	return icon;
}

// This function picks up the click and opens the corresponding info window
function myclick(i) {
	GEvent.trigger(gmarkers[i], "click");
}