var origPos = new Array();
var z = 999;
var blocked = false;

function getGrowAttr(id) 
{
	var grow = {
		points: { to: [YAHOO.util.Dom.getX(id)-20, YAHOO.util.Dom.getY(id)-15] },
		width: { to: 160 },
		height: { to:120 }
	};
	return(grow);
}

function getShrinkAttr(id)
{
	var shrink = {
		points: { to: origPos[id] },
		width: { to: 120 },
		height: { to:90 }
	};
	return(shrink);
}

function bigUrl(img)
{
	var s = new String(img.src);
	s = s.replace('thumbs/', 'thumbs2/');
	return(s);
}

function smallUrl(img)
{
	var s = new String(img.src);
	s = s.replace('thumbs2/', 'thumbs/');
	return(s);
}

function bigBigUrl(img)
{
	var s = new String(img.src);
	s = s.replace('thumbs2/', '');
	s = s.replace('thumbs/', '');
	return(s);
}


function grow(img)
{
	if(blocked) {
		return;
	}
		
	if(!origPos[img.id]) {
		origPos[img.id] = YAHOO.util.Dom.getXY(img.id);
	}
	img.style.zIndex = ++z;
	var anim = new YAHOO.util.Motion(img.id, getGrowAttr(img.id), 0.2, YAHOO.util.Easing.backout);
	anim.onStart.subscribe(
		function() 
		{
			img.src = bigUrl(img);
			
		}
	);
	anim.animate();
}

function shrink(img)
{

	var anim = new YAHOO.util.Motion(img.id, getShrinkAttr(img.id), 0.2, YAHOO.util.Easing.backout);
	anim.onComplete.subscribe(
		function() 
		{
			img.src = smallUrl(img);
			
		}
	);
	anim.animate();
}

function getPrev(imgId)
{
	var imgs = getE('imageTable').getElementsByTagName('img');
	for(var i=0;i<imgs.length;i++) {
		if(imgs[i].id == imgId) {
			var prev = (i > 0) ? imgs[i-1] : imgs[imgs.length-1];
			return(prev);
		}
	}
}

function getNext(imgId)
{
	var imgs = getE('imageTable').getElementsByTagName('img');
	for(var i=0;i<imgs.length;i++) {
		if(imgs[i].id == imgId) {
			var nex = (i < imgs.length-1) ? imgs[i+1] : imgs[0];
			return(nex);
		}
	}
}


// TODO: Use DOM instead of innerHTML
function showBigImg(img)
{
	var bigImg = getE('bigImage');
	bigImg.style.display = 'block';
	//unfade('bigImage');
	bigImg.innerHTML = '<img src="' + bigBigUrl(img) + '" alt="" width="640" height="480" style="border: 1px solid black;" /><br />';
	
	bigImg.innerHTML += '<img src="http://www.aquam.com/ui/img/gauche_off.gif" alt="" style="cursor:hand;cursor:pointer;margin:15px;" onclick="showBigImg(getPrev(\'' + img.id + '\'));return false;" onmouseover="this.src=\'http://www.aquam.com/ui/img/gauche_on.gif\';" onmouseout="this.src=\'http://www.aquam.com/ui/img/gauche_off.gif\';" />';
	bigImg.innerHTML += '<img src="http://www.aquam.com/ui/img/fermer_off.gif" alt="" style="cursor:hand;cursor:pointer;margin:15px;" onmouseover="this.src=\'http://www.aquam.com/ui/img/fermer_on.gif\';" onmouseout="this.src=\'http://www.aquam.com/ui/img/fermer_off.gif\';" />';
	bigImg.innerHTML += '<img src="http://www.aquam.com/ui/img/droite_off.gif" alt="" style="cursor:hand;cursor:pointer;margin:15px;" onclick="showBigImg(getNext(\'' + img.id + '\'));return false;" onmouseover="this.src=\'http://www.aquam.com/ui/img/droite_on.gif\';" onmouseout="this.src=\'http://www.aquam.com/ui/img/droite_off.gif\';" />';

}

function fade(objId, level) 
{
	
	var attributes = {
		opacity: { to: level }
	};
	
	var anim = new YAHOO.util.Anim(objId, attributes, 1, YAHOO.util.Easing.easeOut);
	anim.animate();
}

function unfade(objId)
{
	var attributes = {
		opacity: { to: 1, from: 0.4 }
	};
	
	var anim2 = new YAHOO.util.Anim(objId, attributes, 1, YAHOO.util.Easing.easeOut);
	anim2.animate();
}

// Reset the "original position" array when the window is resized
addEvent(window, 'resize', function () { origPos = new Array(); });