// JavaScript Document
//<![CDATA[
if (GBrowserIsCompatible())
{
  // this variable will collect the html which will eventualkly be placed in the side_bar
  var sideBarCollections = [];
    
  // arrays to hold copies of the markers and html used by the side_bar
  // because the function closure trick doesnt work there
  var gmarkers = [];
  var htmls = [];
  var renderMarkers = [];
  var i = 0;

  // An array of GIcons, to make the selection easier
  var icons = [];

  // This icon uses the same shape as the default Google marker
  // So we can use its details for everything except the image
  var BuildingIcon = new GIcon();
  BuildingIcon.image = "http://ema2.net/Imap/icons/building.png";
  icons[0] = BuildingIcon;

  var EntIcon = new GIcon();
  EntIcon.image = "http://ema2.net/Imap/icons/entertainment.png";
  icons[1] = EntIcon;

  var RestIcon = new GIcon();
  RestIcon.image = "http://ema2.net/Imap/icons/restaurant.png";
  icons[2] = RestIcon;

  var POIIcon = new GIcon();
  POIIcon.image = "http://ema2.net/Imap/icons/POI.png";
  icons[3] = POIIcon;

  var ShopIcon = new GIcon();
  ShopIcon.image = "http://ema2.net/Imap/icons/shop.png";
  icons[4] = ShopIcon;

  var WorshipIcon = new GIcon();
  WorshipIcon.image = "http://ema2.net/Imap/icons/worship.png";
  icons[5] = WorshipIcon;

  var ServIcon = new GIcon();
  ServIcon.image = "http://ema2.net/Imap/icons/services.png";
  icons[6] = ServIcon;

  var GolfIcon = new GIcon();
  GolfIcon.image = "http://ema2.net/Imap/icons/golf.png";
  icons[7] = GolfIcon;

  var AirportIcon = new GIcon();
  AirportIcon.image = "http://ema2.net/Imap/icons/airport.png";
  icons[8] = AirportIcon;

  var ConventionIcon = new GIcon();
  ConventionIcon.image = "http://ema2.net/Imap/icons/convention_center.png";
  icons[9] = ConventionIcon;

  var MuseumIcon = new GIcon();
  MuseumIcon.image = "http://ema2.net/Imap/icons/museum.png";
  icons[10] = MuseumIcon;	

  var NightlifeIcon = new GIcon();
  NightlifeIcon.image = "http://ema2.net/Imap/icons/nightlife.png";
  icons[11] = NightlifeIcon;

  var RecreationIcon = new GIcon();
  RecreationIcon.image = "http://ema2.net/Imap/icons/recreation.png";
  icons[12] = RecreationIcon;		

  var ThemeparkIcon = new GIcon();
  ThemeparkIcon.image = "http://ema2.net/Imap/icons/theme_park.png";
  icons[13] = ThemeparkIcon;			

  var CollegeIcon = new GIcon();
  CollegeIcon.image = "http://ema2.net/Imap/icons/colleges.png";
  icons[14] = CollegeIcon;			

  var CorpIcon = new GIcon();
  CorpIcon.image = "http://ema2.net/Imap/icons/corp.png";
  icons[15] = CorpIcon;			

  var ParksLoIcon = new GIcon();
  ParksLoIcon.image = "http://ema2.net/Imap/icons/parks_locreg.png";
  icons[16] = ParksLoIcon;			

  var ParksSt = new GIcon();
  ParksSt.image = "http://ema2.net/Imap/icons/parks_state.png";
  icons[17] = ParksSt;			

  var TheatreSt = new GIcon();
  TheatreSt.image = "http://ema2.net/Imap/icons/theatre.png";
  icons[18] = TheatreSt;			

  var HospitalSt = new GIcon();
  HospitalSt.image = "http://ema2.net/Imap/icons/hospital.png";
  icons[19] = HospitalSt;			


// A function to create the marker and set up the event window
  // the icon information is passed to this function
  // "name" = ' is already converted to \'
  // "nName" = \' is reverted back to '
  function createMarker(point,name,html,icontype,itm) {

		var useIcon = new GIcon(icons[icontype]);
		//	useIcon.shadow = "http://ema2.net/Imap/icons/building_s.png";
		//	useIcon.shadowSize = new GSize(56, 32);
		//	useIcon.infoShadowAnchor = new GPoint(0, 0);
		useIcon.iconSize = new GSize(32, 32);
		useIcon.iconAnchor = new GPoint(16, 32);
		useIcon.infoWindowAnchor = new GPoint(16, 0);
		//  useIcon.transparent = "http://ema2.net/Imap/icons/markerTransparent.png";

		// Set up our GMarkerOptions object
        markerOptions = { icon:useIcon };
		var marker = new GMarker(point,useIcon);

		var locName; 
		var nName = name.replace('\\','');
		
	    GEvent.addListener(marker, "click", function() {
			if(setupVals["MapControl"] == "sml") {
				window.open('map-lg.asp?t='+setupVals["typeOfPoints"],'map','menubar=0;scrollbars=1;toolbar=0;');
			} else { 
				marker.openInfoWindowHtml(html);
			}
		});

		// save the info we need to use later for the side_bar
		gmarkers[itm] = marker;
		htmls[itm] = html;

		return marker;
	}
	  
  // This function picks up the click and opens the corresponding info window
  function myclick(i) {
		gmarkers[i].openInfoWindowHtml(htmls[i]);
  }
	
	
  // create the map
  var map = new GMap2(document.getElementById("map_display"));

  if(setupVals["MapControl"] == "sml") {
		map.addControl(new GSmallMapControl());	
  } else {
		map.addControl(new GLargeMapControl());
		map.addControl(new GMapTypeControl());
  }
	 
  map.setCenter(new GLatLng( setupVals["locLat"],setupVals["locLong"]), setupVals["mapZoom"]);


function addMap(startpt) {
	var endpt;
	var progress;
	
	endpt = startpt + 1;
	if (endpt > renderMarkers.length)
		endpt = renderMarkers.length 

	if(document.getElementById("prg"))
		document.getElementById("prg").style.display = "";
	for (var i = startpt; i < endpt; i++) {
			map.addOverlay(renderMarkers[i]);
			if(document.getElementById("side_bar")) {
				document.getElementById("side_bar").innerHTML += sideBarCollections[i];
				if(document.getElementById("prg")) {
					progress = Math.ceil((i/renderMarkers.length)*100) + "%";
					document.getElementById("prg").innerHTML = progress;
					document.getElementById("prg").style.width = progress;
				}
			}
	}

	// if not a small map, open html box of first marker
	if(setupVals["MapControl"] != "sml" && startpt == 0)
	 	myclick('i0_1');

	if (endpt < renderMarkers.length) {
		setTimeout(function() {addMap(endpt);},300);
	} else {
		if(document.getElementById("prg"))
			document.getElementById("prg").style.display = "none";
	}

}


  // Read the data from xml
  var request = GXmlHttp.create();
  request.open("GET", setupVals["qString"], true);
	
  request.onreadystatechange = function() {
	if (request.readyState == 4) {
		var xmlDoc = request.responseXML;
		// obtain the array of markers and loop through it
		var markers = xmlDoc.documentElement.getElementsByTagName("marker");
		
		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 = GXml.value(markers[i].getElementsByTagName("infowindow")[0]);
			var label = markers[i].getAttribute("label");
			var ltype = markers[i].getAttribute("ltype");
			var itm = markers[i].getAttribute("itm");
				
			if (ltype == "Entertainment")
				var marker = createMarker(point,label,html,1,itm);
			else if (ltype == "Restaurant")
				var marker = createMarker(point,label,html,2,itm);
			else if (ltype == "Point of Interests")
				var marker = createMarker(point,label,html,3,itm);
			else if (ltype == "Shopping")
				var marker = createMarker(point,label,html,4,itm);
			else if (ltype == "Worship")
				var marker = createMarker(point,label,html,5,itm);
			else if (ltype == "Services")
				var marker = createMarker(point,label,html,6,itm);
			else if (ltype == "Golf")
				var marker = createMarker(point,label,html,7,itm);
			else if (ltype == "Airports")
				var marker = createMarker(point,label,html,8,itm);
			else if (ltype == "Convention Centers")
				var marker = createMarker(point,label,html,9,itm);
			else if (ltype == "Museums")
				var marker = createMarker(point,label,html,10,itm);
			else if (ltype == "Nightlife")
				var marker = createMarker(point,label,html,11,itm);
			else if (ltype == "Recreation Areas")
				var marker = createMarker(point,label,html,12,itm);
			else if (ltype == "Theme Parks")
				var marker = createMarker(point,label,html,13,itm);	
			else if (ltype == "Colleges Universities")
				var marker = createMarker(point,label,html,14,itm);	
			else if (ltype == "Corporations")
				var marker = createMarker(point,label,html,15,itm);	
			else if (ltype == "Parks - Local/Regional")
				var marker = createMarker(point,label,html,16,itm);	
			else if (ltype == "Parks - State")
				var marker = createMarker(point,label,html,17,itm);	
			else if (ltype == "Theatre")
				var marker = createMarker(point,label,html,18,itm);	
			else if (ltype == "Hospitals")
				var marker = createMarker(point,label,html,19,itm);	
			else
				var marker = createMarker(point,label,html,0,itm);
//			map.addOverlay(marker);

			if (ltype != "None") {
				renderMarkers[i] = marker;
				sideBarCollections[i] = '<div><a href="javascript:myclick(\'' 
										+ itm + '\')" style="color:#000000;font-size:11px;font-family:arial;">' 
										+ label.replace('\\',''); + '</a></div>';
			}
		}
			
		// put the assembled html contents into the side_bar div
		if(document.getElementById("side_bar")) {
			document.getElementById("side_bar").innerHTML = sideBarCollections[0];
			if (ltype == "None")
				document.getElementById("side_bar").innerHTML += "<div style=\"color:#990000;font-style:italic;font-weight:bold;margin-top:15px;border-bottom:1px #eee solid;\">Listing coming soon ...</div>";
		}
		// if not a small map, open html box of first marker
		map.addOverlay(renderMarkers[0]);
		if(setupVals["MapControl"] != "sml")
		 	myclick('i0_1');
			
		}//close if readyState 4
		
	}//close function()

request.send(null);
setTimeout("addMap(1)",1500);


} else {
	alert("Sorry, the Google Maps API is not compatible with this browser");
}

function selDrop(itm,val) {

	var t = eval('document.getElementById("'+itm+'")');
	var maxlng = t.length;

	for(i=0;i<maxlng;i++){
		if(t[i].value == val) {
			t[i].selected = true;
			t[i].checked = true;
		}
	}
}
// This Javascript is based on code provided by the
// Blackpool Community Church Javascript Team
// http://www.commchurch.freeserve.co.uk/   
// http://www.econym.demon.co.uk/googlemaps/
//]]>