function swapArrow(imgObj, selected, direction) {
	var imgSrc = widgetSitePrefix+"images/arrow_"+direction+"_unselected.png";
	if (selected) {
		imgSrc = widgetSitePrefix+"images/arrow_"+direction+"_selected.png";
	}

	imgObj.src = imgSrc;
}

function fadeToNextImage(imageId, direction) {
	var fadeAnimator;
	var shell = document.getElementById(imageId + 'Shell');
	
	// create new Animator the first time
	if (!fadeAnimator)
	{
		fadeAnimator = new Animator();

		fadeAnimator.element = shell;
		fadeAnimator.from = 1.0;
		fadeAnimator.to = 0.0;
		fadeAnimator.duration = 400;
		fadeAnimator.whenfinished = function () {fadeInToNextImage(imageId,direction);};
		fadeAnimator.animationStep = function(element, newValue) {setOpacity(element,newValue)};
	}
	fadeAnimator.startAnimation();

}

function setOpacity(element,newValue) {
	element.style.opacity = newValue;
}

function fadeInToNextImage(imageId, direction) {
	var shell = document.getElementById(imageId + 'Shell');
	var image = document.getElementById(imageId);
	var link =  document.getElementById(imageId + 'Link');
	
	// change image/link here
	var maxPos = imageList[imageId].length-1;
	var currentPos = imagePos[imageId];

	if (direction == 'right')
	{
		if (currentPos == maxPos)
		{
			currentPos = 0;
		}
		else
		{
			currentPos++;
		}
	}
	else
	{
		if (currentPos == 0)
		{
			currentPos = maxPos;
		}
		else
		{
			currentPos--;
		}
	}

	image.src = widgetSitePrefix+imageList[imageId][currentPos];
	image.title = titleList[imageId][currentPos];
	link.href = widgetSitePrefix+downloadList[imageId][currentPos];
	imagePos[imageId] = currentPos;
	link.innerHTML = 'download ('+downloadSizeList[imageId][currentPos]+'kb)';

	// fade in again
	var fadeAnimator;

	// create new Animator the first time
	if (!fadeAnimator)
	{
		fadeAnimator = new Animator();

		fadeAnimator.element = shell;
		fadeAnimator.from = 0.0;
		fadeAnimator.to = 1.0;
		fadeAnimator.duration = 600;
		fadeAnimator.whenfinished = null;
		fadeAnimator.animationStep = function(element, newValue) {setOpacity(element,newValue)};
	}
	fadeAnimator.startAnimation();
}

var imageList = new Array(2);
var downloadList = new Array;
var downloadSizeList = new Array;
var titleList = new Array;
var imagePos = new Array;

imageList['mailImage'] = new Array(
	"images/CheckerWithoutMail.jpg",
	"images/HeroWithMail.jpg",
	"images/MoominWithoutMail.jpg",
	"images/BatmanWithMail.jpg");
downloadList['mailImage'] = new Array(
	"widgets/MailChecker.wdgt.zip",
	"widgets/MailHero.wdgt.zip",
	"widgets/MailMoomin.wdgt.zip",
	"widgets/MailBatman.wdgt.zip");
downloadSizeList['mailImage'] = new Array(
	100,
	128,
	116,
	116);
titleList['mailImage'] = new Array(
	"Mail Checker\ndesign(ish): Aidan Kane\nhttp://www.theaxisofcool.com/",
	"Mail Hero\ndesign: Oscar Cortez\nhttp://www.drastudio.com/",
	"Mail Moomin\ndesign concept:Violeta Bazzano\n(violetabazzano@gmail.com)\ndesign realizacion: Ernesto Bazzano",
	"Mail Batman\ndesign(ish): Aidan Kane\nhttp://www.theaxisofcool.com/");
imagePos['mailImage'] = 0;

// preload images
preloadImages(imageList['mailImage'], imagePos['mailImage']);

function preloadImages(arr, notNeeded)
{
	var imageStash = new Array(arr.length);
	for (var i = 0; i < arr.length; i++)
	{
		if (i != notNeeded)
		{
			imageStash[i] = new Image();
			imageStash[i].src = widgetSitePrefix+arr[i];
		}
	}
}