// get elements by class
function getElementsByClass(needle, tag) {
	var class_elements = new Array();

	if (tag == null) {
		tag = "*";
	}

	var haystack = document.getElementsByTagName(tag);

	for (c1 = 0, c2 = 0; c1 < haystack.length; c1++) {
		if (haystack[c1].className == needle) {
			class_elements[c2] = haystack[c1];
			c2++;
		}
	}

	return class_elements;
}


// show larger image with caption and other details
function popupImage(larger_pic) {
	document.getElementById("popup_title").firstChild.nodeValue = slideshow[larger_pic].getElementsByTagName("alt")[0].firstChild.nodeValue;
	document.getElementById("popup_image").setAttribute("src", slideshow[larger_pic].getElementsByTagName("filename")[0].firstChild.nodeValue);
	document.getElementById("popup_caption").firstChild.nodeValue = slideshow[larger_pic].getElementsByTagName("caption")[0].firstChild.nodeValue;
	document.getElementById("screen").style.display = "block";
	document.getElementById("popup").style.display = "block";
}

// close popup
function closePopup() {
	document.getElementById("screen").style.display = "none";
	document.getElementById("popup").style.display = "none";
}

var map = null;

function initialize() {
	if (GBrowserIsCompatible()) {
		map = new GMap2(document.getElementById("map"));
		map.addControl(new GSmallMapControl());
		var home = new GLatLng(42.351075,-71.079011);
		map.setCenter(home, 16);
		geocoder = new GClientGeocoder();
	}
}

function mapIt(photo) {
	if (geocoder) {
		geocoder.getLatLng(
			slideshow[photo].getElementsByTagName("geotag")[0].firstChild.nodeValue,
			function(point) {
				if (!point) {
					alert(address + " not found");
				}
				else {
					map.setCenter(point, 13);
					var marker = new GMarker(point);
					map.addOverlay(marker);
					marker.openInfoWindowHtml(slideshow[photo].getElementsByTagName("alt")[0].firstChild.nodeValue);
				}
			}
		);
	}

	document.getElementById("screen2").style.display = "block";
	document.getElementById("map").style.visibility = "visible";
}

// close map popup
function closeMap() {
	document.getElementById("screen2").style.display = "none";
	document.getElementById("map").style.visibility = "hidden";
}

// create variable for XML data
var xmlDoc;

// get XML document in Internet Explorer
if (window.ActiveXObject) {
	xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
}

// get XML document in other browsers (e.g., Firefox)
else if (document.implementation && document.implementation.createDocument) {
	xmlDoc = document.implementation.createDocument("", "", null);
}

// set XML document setting
xmlDoc.async = false;

// load XML file
xmlDoc.load("images.xml");

// get "image" tags in XML file
var slideshow = xmlDoc.getElementsByTagName("image");

// prepare popup links
window.onload = function() {
	// get larger pic links
	var popup_links = getElementsByClass("popup", "a");

	// popup links show larger images with caption and other details
	for (n = 0; n < popup_links.length; n++) {
		popup_links[n].onclick = function() {
			popupImage(this.title);
			return false;
		}
	}

	// get map links
	var map_links = getElementsByClass("map_popup", "a");

	// map links show place photo was taken on Google Maps
	for (n = 0; n < map_links.length; n++) {
		map_links[n].onclick = function() {
			mapIt(this.title);
			return false;
		}
	}

	document.getElementById("screen2").onclick = function() {
		closeMap();
	}

	initialize();
}

window.onunload = function() {
	GUnload();
}