function loadSlideshow(request) {
	//load slideshow data and start the show
	var xml_doc = false;
	//parse the XML
	if (window.ActiveXObject) {
		xml_doc = new ActiveXObject('Microsoft.XMLDOM');
		xml_doc.async = 'false';
		xml_doc.loadXML(request.responseText);
	} else if (window.DOMParser) {
		xml_doc = new DOMParser().parseFromString(request.responseText, 'text/xml');
	}
	//load the slideshow data
	if (xml_doc) {
		var images = $('slideshow-image-holder');
		var slides = $('slideshow-slide-control');
		var articles = $('slideshow-article-holder');
		for (var i = 1; i <= 4; i++) {
			//get article data
			var article = xml_doc.getElementsByTagName('article_' + i)[0];
			var article_url = article.getElementsByTagName('article_url')[0];
			var article_title = article.getElementsByTagName('title')[0].getElementsByTagName('a')[0];
			var article_dek = article.getElementsByTagName('dek')[0];
			var article_img = article.getElementsByTagName('img')[0];
			//different properties for browser compatibility
			if (article_url.textContent) {
				article_url = article_url.textContent;
			} else if (article_url.innerText) {
				article_url = article_url.innerText;
			} else {
				article_url = article_url.childNodes[0].nodeValue;
			}
			if (article_title.textContent) {
				article_title = article_title.textContent;
			} else if (article_title.innerText) {
				article_title = article_title.innerText;
			} else {
				article_title = article_title.childNodes[0].nodeValue;
			}
			if (article_dek.textContent) {
				article_dek = article_dek.textContent;
			} else if (article_dek.innerText) {
				article_dek = article_dek.innerText;
			} else {
				article_dek = article_dek.childNodes[0].nodeValue;
			}
			if (article_img.textContent) {
				article_img = article_img.textContent;
			} else if (article_img.innerText) {
				article_img = article_img.innerText;
			} else {
				article_img = article_img.childNodes[0].nodeValue;
			}
			//generate slideshow HTML
			articles.innerHTML += '<div id="slideshow-article-' + i + '" class="slideshow-article" style="display:none;">'
					+ '<div class="headline"><a href="' + article_url
					+ '">' + article_title + '</a></div>'
					+ '<div class="dek">' + article_dek + ' <strong><a href="' + article_url + '">Read More &raquo;</a></strong></div>'
					+ '</div>';
			images.innerHTML += '<a href="'+ article_url + '"><img id="slideshow-image-' + i + '" src="'
					+ article_img + '" style="display: none;" /></a>';
			slides.innerHTML += '<li id="slideshow-control-' + i + '">'
					+ '<div id="slideshow-active-' + i
					+ '" class="active" style="display: none;" onclick="setPausedSlide(' + i + ');">'
					+ i + '</div>'
					+ '<div id="slideshow-inactive-' + i
					+ '" class="inactive" onclick="setPausedSlide(' + i + ');">'
					+ i + '</div>'
					+ '</li>';
		}
		//play the slideshow
		startSlideshow();
	}
}

var slideshow_timer = false;
var slideshow_block = false;
var active_slide = false;
var slide_seconds = 10.0;
var effect_options = {
		duration: 1.0
	}

function toggleElement(element_id) {
	//scriptaculous fade effect for a DOM element
	Effect.toggle(element_id, 'appear', effect_options);
}
function toggleSlide(slide) {
	//toggle all elements in a slide
	toggleElement('slideshow-article-' + slide);
	toggleElement('slideshow-image-' + slide);
	toggleElement('slideshow-active-' + slide);
	toggleElement('slideshow-inactive-' + slide);
	return slide;
}

function turnOffElement(element_id) {
	//scriptaculous fade effect for a DOM element
	if ($(element_id).style.display != 'none') {
		toggleElement(element_id);
	}
}
function turnOffSlide(slide) {
	//toggle all elements in a slide
	turnOffElement('slideshow-article-' + slide);
	turnOffElement('slideshow-image-' + slide);
	turnOffElement('slideshow-active-' + slide);
	turnOnElement('slideshow-inactive-' + slide);
	return slide;
}

function turnOnElement(element_id) {
	//scriptaculous fade effect for a DOM element
	if ($(element_id).style.display == 'none') {
		toggleElement(element_id);
	}
}
function turnOnSlide(slide) {
	//toggle all elements in a slide
	turnOnElement('slideshow-article-' + slide);
	turnOnElement('slideshow-image-' + slide);
	turnOnElement('slideshow-active-' + slide);
	turnOffElement('slideshow-inactive-' + slide);
	return slide;
}

function setActiveSlide(slide) {
	//set a slide as the (only) active slide
	if (slideshow_block) {
		//don't start a switch if another is already starting
		return false;
	} else {
		slideshow_block = slide;
	}
	//check that all slides are off the but the desired one
	for (var i = 1; i <= 4; i++) {
		if (i == slide) {
			active_slide = turnOnSlide(i);
		} else {
			turnOffSlide(i);
		}
	}
	//release block after effect time has passed
	function releaseBlock() {
		slideshow_block = false;
	}
	setTimeout(releaseBlock, effect_options.duration * 1000);
	return active_slide;
}
function playSlide(slide) {
	if (!slide) {
		//pick a starting slide unless it was specified
		if (active_slide) {
			slide = active_slide + 1;
			if (slide > 4) {
				slide = 1;
			}
		} else {
			slide = 1;
		}
	}
	setActiveSlide(slide);
	//pick the next slide
	var next_slide = slide + 1;
	if (next_slide > 4) {
		next_slide = 1;
	}
	function nextSlide() {
		playSlide(next_slide);
	}
	//change slide after set time period
	slideshow_timer = setTimeout(nextSlide, slide_seconds * 1000);
}

function startSlideshow() {
	//play from current position
	playSlide();
	$('slideshow-play-control').className = 'slideshow-control-playing';
	$('slideshow-play-control').onclick = stopSlideshow;
	$('slideshow-play-curve').onclick = stopSlideshow;
}
function stopSlideshow() {
	//pause the show
	if (slideshow_timer) {
		clearTimeout(slideshow_timer);
	}
	$('slideshow-play-control').className = 'slideshow-control-paused';
	$('slideshow-play-control').onclick = startSlideshow;
	$('slideshow-play-curve').onclick = startSlideshow;
}

function setPausedSlide(slide) {
	//set a slide and pause the show
	stopSlideshow();
	setActiveSlide(slide);
}

function getIEVersion() {
	// Returns the version of Internet Explorer or false if not using IE
	var rv = false;
	if (navigator.appName == 'Microsoft Internet Explorer') {
		var ua = navigator.userAgent;
		var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
		if (re.exec(ua) != null) {
			rv = parseFloat( RegExp.$1 );
		}
	}
	return rv;
}

function getTransparentCode(image_url, container_id, width, height) {
	//gets the code to display a transparent image
	var ie_version = getIEVersion();
	if (ie_version && (ie_version >= 5.5) && (ie_version < 7)) {
		//a version of IE that does not support transparent images natively
		return '<span id="' + container_id
				+ '" style="width: ' + width + 'px; height: ' + height
				+ 'px; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\''
				+ image_url + '\');">&nbsp;</span>';
	} else {
		//a browser that does not need the workaround
		return '<img src="' + image_url + '" alt="" id="' + container_id
				+ '" style="width: ' + width + 'px; height: ' + height + 'px;" />';
	}
}



// main routine

if (slideshow_url) {

	//generate HTML
	document.write('\
			<div id="slideshow-container">\
				<div id="slideshow-image-holder"></div>\
				<ul id="slideshow-slide-control"></ul>\
				<div id="slideshow-play-control"></div>\
				' + getTransparentCode('http://media.smithsonianmag.com/designimages/curve.png', 'slideshow-play-curve', 76, 66) + '\
				<div id="slideshow-article-holder"></div>\
			</div>\
		');

	//load the slideshow
	var get_params = {
			method: 'get',
			onSuccess: loadSlideshow
		};
	var getter = new Ajax.Request(slideshow_url, get_params);
}