var map;
var currentselected=0;
var greenIcon = getGIcon("/exploreli/images/green.png");
var greenIconSelected = getGIcon("/exploreli/images/green_highlight.png");
var selectedhotels=Array();
var unselectedhotels=Array();
var lastdiv;

function getGIcon(imageurl) {
	var theicon=new GIcon();
  theicon.image = imageurl;
  theicon.shadow = "images/shadow50.png";
  theicon.iconSize = new GSize(32, 32);
  theicon.shadowSize = new GSize(37, 34);
  theicon.iconAnchor = new GPoint(9, 34);
  theicon.infoWindowAnchor = new GPoint(19, 2);
	return theicon;
}
      
function init() {
	map = new GMap2(document.getElementById("map"));
	map.addControl(new GSmallMapControl());
	map.setCenter(new GLatLng(centerLatitude, centerLongitude), startZoom);
	updateMarkers();
	GEvent.addListener(map,'zoomend',function() {
		updateMarkers();
	});
	GEvent.addListener(map,'dragend',function() {
		updateMarkers();
	});
}

function hoteltypesortfunction(a, b){
	var val_a=0;
	var val_b=0;
	
	if (a=='primary') {
		val_a=1;
	}if (b=='primary') {
		val_b=1;
	}
	if (a=='elementary') {
		val_a=2;
	}if (b=='elementary') {
		val_b=2;
	}
	if (a=='middle') {
		val_a=3;
	}if (b=='middle') {
		val_b=3;
	}
	if (a=='high') {
		val_a=4;
	}if (b=='high') {
		val_b=4;
	}
	if (val_a>0 && val_b>0) {
		return (val_a-val_b);
	}
	return (a<b); //otherwise sort by type name if unknown type
		
}

function updateMarkers() {
	lastdiv=0;
	currentselected=0;
	//remove the existing points
	map.clearOverlays();
	//create the boundary for the data
	var bounds = map.getBounds();
	var southWest = bounds.getSouthWest();
	var northEast = bounds.getNorthEast();
	var getVars = 'ne=' + northEast.toUrlValue()
	+ '&sw=' + southWest.toUrlValue()
	//log the URL for testing
	//GLog.writeUrl('js/server_hotels.php?'+mapVar+'&'+getVars);
	//retrieve the points using Ajax
	var request = GXmlHttp.create();
	request.open('GET', 'js/server_hotels.php?'+mapVar+'&'+getVars, true);

	request.onreadystatechange = function() {
		if (request.readyState == 4) {
			var jscript = request.responseText;
			var points;
			var resultslist=new Array();
			eval(jscript);
			var totalresults=0;
			for (i in points) {
				++totalresults;
				if (resultslist[points[i].level]==undefined) {
					resultslist[points[i].level]="";
				}
				resultslist[points[i].level]+="\n<br><div id=\"hoteldiv"+totalresults+"\"><li>"+points[i].hotel;
				resultslist[points[i].level]+="<br/><a href=\"#top\" onClick='selectAndCenterMap("+totalresults+","+points[i].lat+","+points[i].lng+");'>Center map on hotel</a></li></div>\n";
			
			}
			var rlkeys=new Array(resultslist.length);
			for (hoteltype in resultslist) {
				//document.write(hoteltype);
				rlkeys.push(hoteltype);
			}
			rlkeys.sort(hoteltypesortfunction);
			
			
			totalresults=0;
			//create each point from the list
			for (i in points) {
				++totalresults;
				var point = new GLatLng(points[i].lat,points[i].lng);
				var marker = createMarker(point,points[i].hotel,points[i].level,totalresults,false);
				map.addOverlay(marker);
				marker = createMarker(point,points[i].hotel,points[i].level,totalresults,true);
				map.addOverlay(marker);
				marker.hide();
			}
			var resultstext="";
			for (level in rlkeys) {
				var thekey=rlkeys[level];
				resultstext+="<div class=\"title\">"+thekey+"</div>\n<ul>"+resultslist[thekey]+"</ul><br>\n";
			}
			var divel=document.getElementById('listdiv');
			divel.innerHTML="<div class=\"results\">"+totalresults+" hotels were found in this area. Drag map or zoom to search nearby areas.</div>"+resultstext;
		} //end if readystate 4
		
	}
 
	request.send(null);
}

function selectAndCenterMap(itemnum,maplat, maplong) {
	map.panTo(new GLatLng(maplat,maplong), 13);
	markselected(itemnum);
	return true;
}

function createMarker(point, html, level,itemnum,isselected) {
	
	if (!isselected) {
		var icon=greenIcon; 
	} else {
		var icon=greenIconSelected; 
	}
	//alert("isselected: "+isselected+", image is "+icon.image);
	var marker = new GMarker(point,icon);
	GEvent.addListener(marker, 'click', function() {
					var markerHTML = html;
					marker.openInfoWindowHtml(markerHTML);
					markselected(itemnum);
	});
	if (isselected) {
		marker.hide();
		selectedhotels[itemnum]=marker;
	}
	else {
		marker.show();
		unselectedhotels[itemnum]=marker;
	}
	return marker;
}

function markselected(itemnum) {
		if (currentselected>0) {
			selectedhotels[currentselected].hide();
			unselectedhotels[currentselected].show();
    }
    unselectedhotels[itemnum].hide();
    selectedhotels[itemnum].show();
    currentselected=itemnum;
		if (lastdiv!=undefined && lastdiv != 0) {lastdiv.style.backgroundColor="white";}
	  var thediv=document.getElementById("hoteldiv"+itemnum);
	  thediv.style.backgroundColor="#eeeeee"
	  lastdiv=thediv;
	  document.getElementById("map").focus();
}

window.onload = init;