// This function picks up the click and opens the corresponding info window
function MyClick(i) {
	gmarkers[i].openInfoWindowHtml(htmls[i]);
}
// ---- show or hide a specific color according to what was clicked in the legend
// ---- cb: add code to limit the sidebar html too
function FilterMarkers(markerchecked){
	// was this marker on or off?
	var NewState = document.getElementById(markerchecked).checked;
	sidebar_html = '<ul class="none">';
	document.getElementById("sidebar").innerHTML = sidebar_html;
	map.closeInfoWindow();
	for (var i=0;i<gmarkers.length;i++) {
		// matched to the one clicked. change its state and hide/show it
		if (gmarkers[i].type==markerchecked)  {
			if (NewState) {
				gmarkers[i].show();
				gmarkers[i].check = true;
			}
			else {
				gmarkers[i].hide();
				gmarkers[i].check = false;
		   }
		}
		// set up the sidebar listing, only showing the checked ones
		if (gmarkers[i].check) {
			sidebar_html += '<li><a href="javascript:MyClick(' + i + ')">'+ titles[i] + '</a></li>';
		}
  	}
	// put the assembled sidebar html contents into the sidebar div
	sidebar_html += '</ul>';
	document.getElementById("sidebar").innerHTML = sidebar_html;
}
// ----  A function to create the marker and set up the event window ---------
function CreateMarker(point,name,html,icontype) {
	// tooltip doesn't seem to be working at the moment
   var marker = new GMarker(point, {icon:gicons[icontype], title:name});
   // create the listener for the click; append the affiliation to the html
   gmarkers.push(marker);
   marker.type = icontype;
	marker.check = true;
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml(html);
	});
	// save the info we need to use later for the sidebar
	gmarkers[i] = marker;
	htmls[i] = html;
	titles[i] = name;
	// add a line to the sidebar html
	sidebar_html += '<li><a href="javascript:MyClick(' + i + ')">' + name + '</a></li>';
	i++;
return marker;
}
// ------  Determine what type the icon should be and add to the infowindow --
function SetIconType(ii,rci,rcistyle){
	var aff = "other";
	if (ii) {
		aff = "ii";
		}
	if (rci && rcistyle =="weeks") {
		aff = "weeks";
		}
	if (rci && rcistyle =="points") {
		aff = "points";
		}
	if (ii && rcistyle =="weeks") {
		aff = "iiweeks";
		}
	if (ii && rcistyle =="points") {
		aff = "iipoints";
		}
return aff;
}
// ------   Read the xml file and set up the sidebar -------------------------
function ReadMap(url,maplat,maplng,zoom) {
	// check all the boxes in the legend and reset all the variables
	document.getElementById('weeks').checked = true;
	document.getElementById('points').checked = true;
	document.getElementById('iiweeks').checked = true;
	document.getElementById('iipoints').checked = true;
	document.getElementById('ii').checked = true;
	document.getElementById('other').checked = true;
	sidebar_html = '<ul class="none">';
	gmarkers = [];
	htmls = [];
	titles = [];
	i = 0;
	html = "";
  	// insert loading text into sidebar
  	document.getElementById("sidebar").innerHTML = "loading new resorts...";
	var request = GXmlHttp.create();
	request.open("GET", url, true);
	request.onreadystatechange = function() {
		if (request.readyState == 4) {
	      if (request.status != 200) {
	         alert("Sorry, that region is under construction");
	         return;
	      }
	      var xmlDoc = request.responseXML;
	      if (!xmlDoc) {
	         alert("invalid xml file");
	         return;
	      }
			var xmlDoc = request.responseXML;
			// obtain the array of markers
			var markers = xmlDoc.documentElement.getElementsByTagName("marker");
			// hide the info window, otherwise it still stays open where the marker used to be
			map.getInfoWindow().hide();
			map.clearOverlays();
			// empty the array, reset the sidebar and index
			gmarkers = [];
			sidebar_html = '<ul class="none">';
			i = 0;
			for (var i = 0; i < markers.length; i++) {
				// obtain the attribues of each marker
				var lat = parseFloat(markers[i].getAttribute("lat"));
				var lng = parseFloat(markers[i].getAttribute("lng"));
				var point = new GLatLng(lat,lng);
				var html = markers[i].getAttribute("html");
				var label = markers[i].getAttribute("label");
				var ii = markers[i].getAttribute("ii");
				var rci = markers[i].getAttribute("rci");
				var rcistyle = markers[i].getAttribute("rcistyle");
				// determine the icontype and add it to the infowindow html
				icontype = SetIconType(ii,rci,rcistyle);
				if (!(icontype=="other")) {
					html = html + "<br>";
				}
				if (icontype=="ii" || icontype == "iipoints" || icontype == "iiweeks") {
					html = html + "<br>II code: " +ii;
				}
				if (icontype=="weeks" || icontype=="points" || icontype=="iipoints" || icontype=="iiweeks") {
					html = html + "<br>RCI code: " +rci;
				}
				// create the marker
				var marker = CreateMarker(point,label,html,icontype);
				map.addOverlay(marker);
			}
			// put the assembled sidebar_html contents into the sidebar div
			sidebar_html += '</ul>';
			document.getElementById("sidebar").innerHTML = sidebar_html;
			// ---- Center the map on the area ------------------------------------------
			map.setCenter(new GLatLng(parseFloat(maplat),parseFloat(maplng)), zoom);
		}
	}
	request.send(null);
}
// ----------------------------------------------------------------------------
function Begin(XMLfile,lat,lng,zoom){
	// display the map and map controls and set continuous zoom
	map = new GMap2(document.getElementById("map"));
	map.addControl(new GLargeMapControl());
	map.addControl(new GMapTypeControl());
	map.enableContinuousZoom();
	map.enableDoubleClickZoom();
	// ---- Center the map on the area ------------------------------------------
	map.setCenter(new GLatLng(parseFloat(lat),parseFloat(lng)), zoom);
	// ---- Add a map overview --------------------------------------------------
	map.addControl(new GOverviewMapControl());
	// ---- add listener to show lat/long information ---------------------------
	GEvent.addListener(map, 'moveend', function() {
		var center = map.getCenter();
		var latStr = 'lat=\"' + Math.round(center.y*1000000)/1000000;
		var lngStr = ' lng=\"' + Math.round(center.x*1000000)/1000000;
		document.getElementById("note").innerHTML = "* - Resort may be in the wrong spot." +
			"  Double click on the correct spot and send me: " + latStr +"\"" + lngStr +"\"";
	});
	ReadMap(XMLfile,lat,lng,zoom);
}
// ===========================================================================
if (GBrowserIsCompatible()){
	// define global variables
	var map;
	var sidebar_html = "";
	var gmarkers = [];
	var htmls = [];
	var titles = [];
	var i = 0;
	var iconStr;
	var html = "";
	// Create the tiny marker icon
	var icon = new GIcon();
	icon.shadow = "mm_20_shadow.png";
	icon.iconSize = new GSize(12, 20);
	icon.shadowSize = new GSize(22, 20);
	icon.iconAnchor = new GPoint(6, 20);
	icon.infoWindowAnchor = new GPoint(5, 1);
	//icon.imageMap = [4,0,0,4,0,7,3,11,4,19,7,19,8,11,11,7,11,4,7,0];
	//icon.transparent = "mapIcons/mm_20_transparent.png";

	var gicons=[];
	gicons["ii"] = new GIcon(icon, "mm_20_yellow.png");
	gicons["weeks"] = new GIcon(icon, "mm_20_red.png");
	gicons["points"] = new GIcon(icon, "mm_20_blue.png");
	gicons["iiweeks"] = new GIcon(icon, "mm_20_orange.png");
	gicons["iipoints"] = new GIcon(icon, "mm_20_green.png");
	gicons["other"] = new GIcon(icon, "mm_20_white.png");
}