var request = null;
try {
	request = new XMLHttpRequest();
} catch (trymicrosoft) {
	try {
		request = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (othermicrosoft) {
		try {
			request = new ActiveXObject("Microsoft.XMLHTTP");
		} catch (failed) {
			request = null;
		}
	}
}

var responseXML;

if(request==null){
	alert("Error creating XMLHttp Request Object.");
}

function fetchThumbnails(typeThumbnails) { //Appel AJAX afin de préremplir le document à la volée.
	request.open("GET","call_soap.php?catalogName=SquareBook&field=Categories&value=" + typeThumbnails + "&dummy="+new Date().getTime(),true);
	request.onreadystatechange=processXMLResponse;
	request.send(null);
}

function processXMLResponse() {
	var firstThumb, firstWidth, firstHeight;
	if (request.readyState == 4) {
		if (request.status == 200) {
			responseXML = request.responseXML;
			thumbnailCount = responseXML.getElementsByTagName("response")[0].firstChild.nodeValue;
			var tr = document.createElement("tr");
			for (y = 0; y < thumbnailCount; y++) {
				var td = document.createElement("td");
				td.setAttribute("height", "100");
				td.setAttribute("align", "right");
				td.setAttribute("scope", "row");
				var path = responseXML.getElementsByTagName("path")[y].firstChild.nodeValue;
				var img = document.createElement("img");
				img.setAttribute("src", path);
				if (img.width != 0) {
					if (y==0) firstWidth = (img.width * 100 / img.height);
					if (y==0) firstHeight = 100;
					img.setAttribute("width", (img.width * 100 / img.height) + "");
					img.setAttribute("height", "100");
				}
				else {
					if (y==0) firstHeight = 100;
					img.setAttribute("height", "100");
				}
				img.setAttribute("border", "0");
				img.setAttribute("style","padding: 0 5px;");
				img.setAttribute("id", "thumb" + y);
				if (y==0) firstThumb = "thumb" + y;
				img.onclick = function() { updatePreview(this.id, this.width, this.height); };
				td.appendChild(img);
				tr.appendChild(td);
			}
			document.getElementById("thumbnails").appendChild(tr);
			updatePreview(firstThumb, firstWidth, firstHeight);
		} else {
			//alert("Error :"+request.responseText);
		}
	}
}
function updatePreview(id, the_width, the_height){

	var thumbnailCount=responseXML.getElementsByTagName("response")[0].firstChild.nodeValue;
	
	id=parseInt(id.substring(5));
	var idPreview=id+parseInt(thumbnailCount);
	var path=responseXML.getElementsByTagName("path")[idPreview].firstChild.nodeValue;
	var img=document.createElement("img");
	img.setAttribute("src",path);
	img.setAttribute("height","258");
	while (document.getElementById("inZoom").firstChild)
		document.getElementById("inZoom").removeChild(document.getElementById("inZoom").firstChild);
	document.getElementById("inZoom").appendChild(img);
}

var iThumbnailsLeftPos = 0;
var iThumbnailMaxMove = 120;
var iThumbnailsWidth = 400;

function ToTheLeft() {
	if (iThumbnailsLeftPos <= iThumbnailMaxMove) iThumbnailsLeftPos = 0;
	else iThumbnailsLeftPos = iThumbnailsLeftPos - iThumbnailMaxMove;
	new Effect.Move('thumbnails', { x: -iThumbnailsLeftPos, y: 0, mode: 'absolute' });
}

function ToTheRight() {
	if (iThumbnailsLeftPos < $('thumbnails').getWidth() - iThumbnailsWidth) {
		iThumbnailsLeftPos = iThumbnailsLeftPos + iThumbnailMaxMove;
		new Effect.Move('thumbnails', { x: -iThumbnailsLeftPos, y: 0, mode: 'absolute' });
	}
}