function StartAnimation(id) {
	animationId = id;
	if (animationCancelId == id) animationCancelId = 0;
	if (animationImages[parseInt(id)]) {
		if (animationImages[parseInt(id)][1]) {
			//window.clearTimeout(animationTimeout);
			AnimateNext(id);
			window.clearInterval(animationInterval);
			animationInterval = window.setInterval("AnimateNext('"+id+"')", 1500);
		}
	} else {
		Request(id);
	}
}

function StopAnimation(id) {
	animationCancelId = id;
	window.clearInterval(animationInterval);
}

function Request(id) {
	var img = document.getElementById(id);
	img.src = ANIMATION_IMAGE_TRANPARENT;
	img.style.background = 'url(' + ANIMATION_IMAGE_LOADING + ') center center no-repeat';
	setElementOpacity(img, 0.5);
	var animationRequest = GetXmlHttp();
    animationRequest.open("GET", '/json_get_pictures.php?products_id=' + parseInt(id) + '&client_id=' + id, true);
    animationRequest.onreadystatechange =  function() {
		RequestComplete(animationRequest);
	};

	animationRequest.send(null);
}

function RequestComplete(request) {
	if(request && request.readyState == 4) {
		request.onreadystatechange = null;
		if (request.status == 200) {
			var response;
			eval('response = ' + request.responseText);
			var id = response['client_id'];
			animationImages[parseInt(id)] = response['images'];
			var img = document.getElementById(id);
			var img2 = document.getElementById(id+'2');
			img.src = img2.src;	
			if (animationId == id && id != animationCancelId ) {
				StartAnimation(animationId);
			} else {
				img.style.background = '';
			}
		}
	}
}

function AnimateNext(id) {
	if ( !(animationImages[parseInt(id)][animationPos]) ) animationPos = 0;
	var img = document.getElementById(id);
	var img2 = document.getElementById(id+'2');
	img2.src = img.src;
	setElementOpacity(img, 0.07);
	setElementOpacity(img2, 1);
	img.src =  animationImages[parseInt(id)][animationPos];
	animationNextImg.src = animationImages[parseInt(id)][animationPos+1];
	animationPos ++;
	animationTimeout = window.setTimeout("AnimateNext3('"+id+"', 0.14)", 30);
}

function AnimateNext3(id, opacity) {
	if (animationId == id) {
		var img = document.getElementById(id);
		var img2 = document.getElementById(id+'2');
		if (animationCancelId == id) {
			setElementOpacity(img, 1);
			setElementOpacity(img2, 0);
		} else {
			setElementOpacity(img, opacity);
			setElementOpacity(img2, 1 - opacity);
			if (opacity > 1) return;
			animationTimeout = window.setTimeout("AnimateNext3('"+id+"', "+(opacity+0.07)+")", 30);
		}
	} else {
		setElementOpacity(img, 1);
		setElementOpacity(img2, 0);
	}
}

function GetXmlHttp() {
	var animationRequest;
	try {
		animationRequest = new XMLHttpRequest();
	} catch (trymicrosoft) {
		try {
			animationRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (othermicrosoft) {
			try {
				animationRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (failed) {
				animationRequest = false;
			}
		}
	}
	animationRequest.onreadystatechange = RequestComplete;
	return animationRequest;
}

var ANIMATION_IMAGE_LOADING = '/images/icons/loading2.gif';
var ANIMATION_IMAGE_TRANPARENT = '/images/pixel_trans.gif';
var animationId = 0;
var animationCancelId = 0;
var animationPos = 0;
var animationInterval;
var animationTimeout;
var animationImages = new Array();
var animationNextImg = new Image();
