// JavaScript Document

var map;
var kml;
var siteLabel = new Array();
var siteHtml = new Array();
var siteIcons = new Array();
var placeLabel = new Array();
var placelabel;
var mwpopup;

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);
	placelabel = document.createElement("div");
	document.getElementById("map").appendChild(placelabel);
	placelabel.style.visibility="hidden";
	placelabel.style.zIndex="99";
	document.getElementById("map").style.visibility = 'visible';
	kml = new GGeoXml("http://www.midlothianwildlife.com/kml/midlothianareapolygonlightblue.kml");
}

function loadSites(){
	loadPlacesXML("xml/sites.xml.asp");
}

function loadPlacesXML(url){
	
	document.getElementById("sitesmenu").innerHTML = '<div id=\"viewinglocationstitle\" class=\"viewinglocationstitle\">Viewing Locations</div>';
	
	var placeMarker;
	placeLabel = new Array();
	map.clearOverlays();
	GDownloadUrl(url, 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 location = markers[i].getAttribute("location");
		var description = markers[i].getAttribute("description");
		var animals = markers[i].getAttribute("animals");
		var thumbnail = markers[i].getAttribute("thumbnail");
		var picture = markers[i].getAttribute("picture");
		var email = markers[i].getAttribute("email");
		var landline = markers[i].getAttribute("landline");
		var mobile = markers[i].getAttribute("mobile");
		var fax = markers[i].getAttribute("fax");
		var website = markers[i].getAttribute("website");
		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 pushpinicon = "menuMarker.gif";
			
		var marker = "gfx/markers/" + pushpinicon;			
	
		placeMarker = addMarker(id, marker, location, animals, description, thumbnail, picture, email, landline, mobile, fax, latitude, longitude, zoom);
		document.getElementById("sitesmenu").innerHTML += '<a name=\"sitelistitemanchor' + id + '\"><div id=\"sitelistitem' + id + '\" class=\"sitelistitem\" onmouseover=\"loadStyle(\'sitelistitem' + id + '\', \'mouseover\')\" onmouseout=\"loadStyle(\'sitelistitem' + id + '\', \'mouseout\')\" onmousedown=\"loadStyle(\'sitelistitem' + id + '\', \'mousedown\')\" onclick=\"openInfoWindow(' + id + ')\"><img src=\"gfx/markers/menuMarker.gif\" align=\"absmiddle\"> ' + location + '<div>';		
		siteIcons[id] = placeMarker;
	  }
	}
	catch(e){
	document.getElementById("sitesmenu").innerHTML += e.message + '<br>';
	}
	});
	
}

function addMarker(id, marker, location, animals, description, thumbnail, picture, email, landline, mobile, fax, latitude, longitude, zoom){
	
	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 = 'nopicture100x100.gif';
	
	GEvent.addListener(icon, "mouseover", function() {
		showPlaceLabel(icon, location);
	  });
	  
	GEvent.addListener(icon, "mouseout", function() {
		hidePlaceLabel();
	});
	  
	GEvent.addListener(icon, "click", function() {
		openInfoWindow(id, icon);
	  });
	
	map.addOverlay(icon);
	
	siteLabel[id] = 'Site Info';
	
	siteHtml[id] = '<table border=\"0\">';
		siteHtml[id] += '<tr>';	
		
			siteHtml[id] += '<td valign=\"top\">';
				
				siteHtml[id] += '<table border=\"0\">';
					siteHtml[id] += '<tr>';
						siteHtml[id] += '<td valign=\"top\">';
							siteHtml[id] += '<div style=\"font-size:16px\"><strong>' + location + '</strong></div>';
						siteHtml[id] += '</td>';
					siteHtml[id] += '</tr>';
					siteHtml[id] += '<tr>';
						siteHtml[id] += '<td valign=\"top\">';
							siteHtml[id] += animals;
						siteHtml[id] += '</td>';
					siteHtml[id] += '</tr>';
				siteHtml[id] += '</table>';
				
			siteHtml[id] += '</td>';		
			
			siteHtml[id] += '<td width=\"100\" align=\"right\" valign=\"top\">';
				siteHtml[id] += '<img id=\"animalthumbnail\" style=\"border:1px solid #000000;cursor:pointer\" onclick=\"javascript:openMoreInformation(' + id + ')\" src=\"gfx/animals/' + thumbnail + '\" width=\"100\" height=\"100\" style=\"border:0px solid #000000\">';
			siteHtml[id] += '</td>';
			
		siteHtml[id] += '</tr>';
		siteHtml[id] += '<tr>';		
			siteHtml[id] += '<td valign=\"top\" colspan=\"2\">';
				siteHtml[id] += '<a href=\"javascript:openMoreInformation(' + id + ')\">More Information</a><br>';
			siteHtml[id] += '</td>';
		siteHtml[id] += '</tr>';
	siteHtml[id] += '</table>';
	
	return icon;
}

function showAnimalThumbnail(image){
	if(image != '' && image != 'null') document.getElementById("animalthumbnail").src = 'gfx/animals/thumbnails/' + image;
	else document.getElementById("animalthumbnail").src = 'gfx/sites/nopicture100x100.gif';
}

function showAnimalPicture(image, description, animal, locations){
	if(image != '' && image != 'null') document.getElementById("animalpicture").src = 'gfx/animals/thumbnails/' + image;
	document.getElementById("animalinformationwindow").innerHTML = '<table cellpadding=\"0\" cellspacing=\"0\" border=\"0\"><tr><td><img src=\"gfx/animals/thumbnails/' + image + '\" width=\"100\" height=\"100\" style=\"float:left;border:1px solid #000000;cursor:pointer\" onClick=\"openPopupPicture(\'gfx/animals/' + image + '\')\"></td><td width=\"10\">&nbsp;</td><td valign=\"top\"><strong>' + animal +  '</strong><span style=\"font-size:12px;padding:3px\"> - ' + description + '<br><br></span><strong>Viewing Locations</strong><span style=\"font-size:12px;padding:3px\"> - ' + locations + '</td></tr></table>';
}

function openPopupPicture(url){
	mwpopup = window.open(url, 'mwpopup', 'menubar=no,scrollbars=no,resizable=yes,location=no,toolbar=no,width=320,height=322', true);	
	mwpopup.focus();
}

var tempX;
var tempY;
var miwX;
var miwY;

function positionAnimalPicture(e) {
}

function hideAnimalPicture(e) {
}

function showAnimalInformation(){
	var image = String(document.getElementById('animalpicture').src).split('/');
	image = image[image.length-1];
	window.open('gfx/animals/300x300/' + image);
}

function showLargeAnimalPicture(){
	var image = String(document.getElementById('animalpicture').src).split('/');
	image = image[image.length-1];
	window.open('gfx/animals/300x300/' + image);
}

function showPlaceLabel(icon, site_name){
	try {
		placelabel.innerHTML = '<div style=\"background:#EEEEEE;border:1px solid #000000;font-size:9pt;text-align:left;padding:3px;z-index:99\">' + 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){
	loadStyle('sitelistitem' + id, 'mousedown');
	location.href = '#sitelistitemanchor' + id;
	document.getElementById("locationinformationwindow").style.visibility = 'hidden';
	document.getElementById("moreinformationwindow").style.visibility = 'hidden';
	document.getElementById("animalinformationwindow").style.visibility = 'hidden';
	document.getElementById("linkswindow").style.visibility = 'hidden';
	siteIcons[id].openInfoWindowHtml(siteHtml[id],{maxWidth:380});
}

function openMoreInformation(id){
	document.getElementById("locationinformationwindow").innerHTML = searchDatabase('sql/getlocationinformation.asp?id=' + id);
	document.getElementById("locationinformationwindow").style.visibility = 'visible';
	document.getElementById("moreinformationwindow").innerHTML = searchDatabase('sql/getmoreinformation.asp?id=' + id);
	document.getElementById("moreinformationwindow").style.visibility = 'visible';
	document.getElementById("animalinformationwindow").style.visibility = 'visible';
}

function openLinksCategory(url){
	document.getElementById("linkswindow").innerHTML = searchDatabase(url);
	document.getElementById("linkswindow").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;
}