var ajaxObj = getAjaxObj ();
var detailsDiv = "detailsDiv";
var imgDiv = "imageDiv";

function $(id) {
	return document.getElementById (id);
}

function getAjaxObj () {
	if (window.XMLHttpRequest) {
		return new XMLHttpRequest ();
	}
	else if (window.ActiveXObject) {
		return new ActiveXObject ("Microsoft.XMLHTTP");
	}
}

function fillDiv (myDivId, text) {
	$(myDivId).innerHTML = text;
}

function clearDiv (myDivId) {
	fillDiv (myDivId, "");
}

function setLoading (myDivId) {
	fillDiv (myDivId, "Loading...");
}

function getImage (section, imgNumber) {
	
	if (null == ajaxObj) {
		alert ("Ajax not supported");
		return false;
	}
			
	setLoading (detailsDiv);
	var ajaxObj1 = getAjaxObj ();
	ajaxObj1.onreadystatechange = function () {
		if (ajaxObj1.readyState == 4) {
			fillDiv (detailsDiv, ajaxObj1.responseText);
		}
	};
	ajaxObj1.open ("GET", "./"+section+"/details_"+imgNumber+".html", true);
	ajaxObj1.send (null);
	
	setLoading (imgDiv);
	var ajaxObj2 = getAjaxObj ();
	ajaxObj2.onreadystatechange = function () {
		if (ajaxObj2.readyState == 4) {
			fillDiv (imgDiv, ajaxObj2.responseText);
		}
	};
	ajaxObj2.open ("GET", "./"+section+"/image_"+imgNumber+".html", true);
	ajaxObj2.send (null);
	
}