// JavaScript Document

var map;
var kml;
var markeridcount = 0;
var siteLabel = new Array();
var siteHtml = new Array();
var siteIcons = new Array();
var placeLabel = new Array();
var placelabel;

function getMap(){
	map=new GMap2(document.getElementById("map"));
	map.setCenter(new GLatLng(55.85393225916222, -3.1662683105468607), 10);
	map.addControl(new GMapTypeControl());
	map.addControl(new GScaleControl());
	map.addControl(new GLargeMapControl());
	map.enableContinuousZoom();
	map.enableDoubleClickZoom();
	map.addMapType(G_PHYSICAL_MAP);
	map.setMapType(G_SATELLITE_MAP);
	placelabel = document.createElement("div");
	document.getElementById("map").appendChild(placelabel);
	placelabel.style.visibility="hidden";
	placelabel.style.zIndex="99";
	resizeMap();
	document.getElementById("linkholder").style.display = 'block';
	document.getElementById("map").style.display = 'block';
	document.getElementById("map").style.visibility = 'visible';
	kml = new GGeoXml("http://www.midlothianheritage.com/kml/midlothianareapolygondarkgreenoutlined.kml");
}

function resizeMap(){
	/*var newmapheight;
	if(window.self&&self.innerWidth) newmapheight=self.innerHeight;
	else if(document.documentElement&&document.documentElement.clientHeight) newmapheight = document.documentElement.clientHeight;
	else newmapheight = 360;
	newmapheight = newmapheight - 151;
	document.getElementById("sitesmenu").style.height=newmapheight+'px';
	document.getElementById("mapholder").style.height=newmapheight+'px';
	document.getElementById("mapholder").style.top='151px';
	document.getElementById("map").style.height=newmapheight+'px';
	document.getElementById("map").style.top='151px';
	document.getElementById("linkholder").style.top='151px';
	document.getElementById("linkholder").style.height=newmapheight+'px';
	document.getElementById("links").style.height=newmapheight+'px';
	map.checkResize();*/
}

function loadSites(){
	loadPlacesXML("xml/sites.xml.asp", "prehistoricsites");
	loadPlacesXML("xml/sites.xml.asp", "romansites");
	loadPlacesXML("xml/sites.xml.asp", "medievalsites");
	loadPlacesXML("xml/sites.xml.asp", "postmedievalsites");
	loadPlacesXML("xml/sites.xml.asp", "earlyhistoricsites");
	loadPlacesXML("xml/sites.xml.asp", "_18th19thcenturysites");
	loadPlacesXML("xml/sites.xml.asp", "_20thcenturysites");
}

function toggleSites(category){
	if(document.getElementById(category).style.display == 'block') document.getElementById(category).style.display = 'none';
	else document.getElementById(category).style.display = 'block';
}

function loadPlacesXML(url, category){
	
	var placeMarker;
	placeLabel = new Array();
	map.clearOverlays();
	GDownloadUrl(url + '?category=' + category, function(data, responseCode) {
	  
	var xml = GXml.parse(data);
	  
	try {
	
	  var markers = xml.documentElement.getElementsByTagName("marker");
	  
	  for (var i = 0; i < markers.length; i++) {
		
		var id = parseInt(markers[i].getAttribute("id"));
		var site_name = markers[i].getAttribute("site_name");
		var site_type = markers[i].getAttribute("site_type");
		var description = markers[i].getAttribute("description");
		var thumbnail = markers[i].getAttribute("thumbnail");
		var picture = markers[i].getAttribute("picture");
		var latitude = markers[i].getAttribute("latitude");
		var longitude = markers[i].getAttribute("longitude");
		var zoom = markers[i].getAttribute("zoom");
		var point = new GLatLng(parseFloat(latitude), parseFloat(longitude));
		
		var limit = description.length;
		if(limit > 255) {
			limit = 255;
			description = description.substring(0, limit);
			description += '...';
		}
			
		var marker = "gfx/markers/" + category + ".gif";	
	
		placeMarker = addMarker(id, latitude, longitude, marker, site_name, description, picture, thumbnail, site_type, category, markeridcount);
		document.getElementById(category).innerHTML += '<a name=\"sitelistitemanchor' + id + '\"><div id=\"sitelistitem' + category + id + '\" class=\"sitelistitem\" onmouseover=\"loadStyle(\'sitelistitem' + category + id + '\', \'mouseover\')\" onmouseout=\"loadStyle(\'sitelistitem' + category + id + '\', \'mouseout\')\" onmousedown=\"loadStyle(\'sitelistitem' + category + id + '\', \'mousedown\')\" onclick=\"openInfoWindow(' + markeridcount + ', ' + category + ')\"><img src=\"gfx/markers/' + category + '.gif"\" align=\"absmiddle\" width=\"10\" height=\"10\" style=\"border:0px\"> ' + site_name + '<div>';		
		siteIcons[markeridcount] = placeMarker;
		markeridcount++;
	  }
	  
	}
	catch(e){
	document.getElementById(category).innerHTML += e.message + '<br>' + i;
	}
	});
	
}

function addMarker(id, latitude, longitude, marker, site_name, description, picture, thumbnail, site_type, category, markeridcount){
	
	var gfxdir = 'places';
	
	var icon = new GIcon();
	icon.image = marker;
	icon.iconSize = new GSize(10, 10);
	icon.shadowSize = new GSize(22, 10);
	icon.iconAnchor = new GPoint(6, 10);
	icon.infoWindowAnchor = new GPoint(5, 1);
	icon.infoShadowAnchor = new GPoint(18, 25);
	var bounds = map.getBounds();
	var southWest = bounds.getSouthWest();
	var northEast = bounds.getNorthEast();
	var lngSpan = northEast.lng() - southWest.lng();
	var latSpan = northEast.lat() - southWest.lat();
	var point = new GLatLng(latitude, longitude);
	var icon = new GMarker(point, icon);
	var tabsLabel = new Array();
	var tabsHtml = new Array();
	
	if(thumbnail == '') thumbnail = 'gfx/sites/nopicture50x50.gif';
	else thumbnail = 'gfx/sites/' + thumbnail;
	
	GEvent.addListener(icon, "mouseover", function() {
		showPlaceLabel(icon, site_name, thumbnail);
	  });
	  
	GEvent.addListener(icon, "mouseout", function() {
		hidePlaceLabel();
	});
	  
	GEvent.addListener(icon, "click", function() {
		openInfoWindow(markeridcount, icon);
	  });
	
	map.addOverlay(icon);
	
	var marker = "gfx/markers/" + category + ".gif";
	
	siteLabel[markeridcount] = 'Site Info';
	
	siteHtml[markeridcount] = '<table border=\"0\">';
		siteHtml[markeridcount] += '<tr>';	
		
			siteHtml[markeridcount] += '<td valign=\"top\">';
				
				siteHtml[markeridcount] += '<table border=\"0\">';
					siteHtml[markeridcount] += '<tr>';
						siteHtml[markeridcount] += '<td valign=\"top\">';
							siteHtml[markeridcount] += '<div><strong><img src=\"' + marker + "\" width=\"10\" height=\"10\" style=\"border:0px\" valign=\"absmiddle\"> " + site_name + ' - ' + site_type + '</strong></div>';
						siteHtml[markeridcount] += '</td>';
					siteHtml[markeridcount] += '</tr>';
					siteHtml[markeridcount] += '<tr>';
						siteHtml[markeridcount] += '<td valign=\"top\">';
							siteHtml[markeridcount] += description;
						siteHtml[markeridcount] += '</td>';
					siteHtml[markeridcount] += '</tr>';
				siteHtml[markeridcount] += '</table>';
				
			siteHtml[markeridcount] += '</td>';		
			
			siteHtml[markeridcount] += '<td width=\"100\" align=\"right\" valign=\"top\">';
				if(thumbnail == "") siteHtml[markeridcount] += '<img src=\"gfx/sites/100x100nopicture.gif\" width=\"100\" height=\"100\" style=\"border:1px solid #000000\">';
				else siteHtml[markeridcount] += '<img src=\"' + thumbnail + '\" width=\"100\" height=\"100\" style=\"border:1px solid #000000;cursor:pointer\" onclick=\"javascript:openMoreInformation(' + id + ',\'' + category + '\')\">';
			siteHtml[markeridcount] += '</td>';
			
		siteHtml[markeridcount] += '</tr>';
		siteHtml[markeridcount] += '<tr>';		
			siteHtml[markeridcount] += '<td valign=\"top\" colspan=\"2\">';
				siteHtml[markeridcount] += '<a href=\"javascript:openMoreInformation(' + id + ',\'' + category + '\')\">More Information</a><br>';
			siteHtml[markeridcount] += '</td>';
		siteHtml[markeridcount] += '</tr>';
	siteHtml[markeridcount] += '</table>';
	
	return icon;
}

function showPlaceLabel(icon, site_name, thumbnail){
	try {
		placelabel.innerHTML = '<div style=\"background:#EEEEEE;border:1px solid #000000;font-size:9pt;text-align:left;padding:3px;z-index:99;text-align:center\"><img src=\"' + thumbnail + '\" border=\"0\" width=\"50\" height=\"50\"><br>' + site_name + '</div>';
		var point = map.getCurrentMapType().getProjection().fromLatLngToPixel(map.getBounds().getSouthWest(), map.getZoom());
		var offset = map.getCurrentMapType().getProjection().fromLatLngToPixel(icon.getPoint(),map.getZoom());
		var anchor = icon.getIcon().iconAnchor;
		var width = icon.getIcon().iconSize.width;	
		var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(offset.x - point.x - anchor.x + width,- offset.y + point.y +anchor.y));
		pos.apply(placelabel);
		placelabel.style.visibility = 'visible';
	}
	catch(e){
	}
}

function hidePlaceLabel(){
	placelabel.style.visibility = 'hidden';
}

function openInfoWindow(id, category){
	document.getElementById("moreinformationwindow").style.visibility = 'hidden';
	siteIcons[id].openInfoWindowHtml(siteHtml[id],{maxWidth:380});
}

function openMoreInformation(id, category){
	document.getElementById("moreinformationwindow").innerHTML = searchDatabase('sql/getmoreinformation.asp?id=' + id + '&category=' + category);
	document.getElementById("moreinformationwindow").style.visibility = 'visible';
}

function openLinksCategory(url){
	document.getElementById("moreinformationwindow").innerHTML = searchDatabase(url);
	document.getElementById("moreinformationwindow").style.visibility = 'visible';
}

function loadStyle(menuItem, eventType) {
	var currentClass = document.getElementById(menuItem).className;	
	if(eventType == 'mouseover') {
		if(currentClass != 'sitelistitemselected') document.getElementById(menuItem).className = 'sitelistitemhover';
	}
	if(eventType == 'mouseout') {
		if(currentClass != 'sitelistitemselected') document.getElementById(menuItem).className = 'sitelistitem';
	}
	if(eventType == 'mousedown') {
		var divs = document.getElementsByTagName("div");
		for(i=0;i<divs.length;i++) {
			if(divs[i].className == 'sitelistitemselected') {
				divs[i].className = 'sitelistitem';
			}
		}
		document.getElementById(menuItem).className = 'sitelistitemselected';
	}
}

var searchXmlHttp;
var searchListHtml = "";

function ajaxDatabaseSearch() {  
	try {    
		searchXmlHttp = new XMLHttpRequest();    
	}
	catch (e) {    
		try {      
			searchXmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
		}
		catch (e) {       
			try {        
				searchXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) {        
				alert("Your browser does not support AJAX!");        
				return false;        
			}		      
		}    
	}  
	
	searchXmlHttp.onreadystatechange = function() {
		if(searchXmlHttp.readyState == 0) {
    	}
  		if(searchXmlHttp.readyState == 1) {
    	}
		if(searchXmlHttp.readyState == 2) {
    	}
		if(searchXmlHttp.readyState == 3) {
    	}
		if(searchXmlHttp.readyState == 4) {
    		searchListHtml = searchXmlHttp.responseText;
    	}
  	}
	
}

function searchDatabase(url) {
	ajaxDatabaseSearch();
	searchXmlHttp.open("GET", url, false);
	searchXmlHttp.send(null);
	if(!is_ie) return searchXmlHttp.responseText;
	return searchListHtml;
}