// JavaScript Document


function swapImages( img1, img2 ) {
	var swapping = document.getElementById('swapping');

	if( swapping.value == 'false' ) {
		swapping.value = 'true';
		blankAndSwap( img1, img2 );
		fadeInRe( img1, img2, 0 );
	}
}

/* Fade in two images in sync */
function fadeIn( img1, img2 ) {
	fadeInRe( img1, img2, 0 );
}

/* Fade out two images in sync */
function fadeOutAndSwap( img1, img2 ) {
	fadeOutRe( img1, img2, 10 );
}

/* Fade in one image */
function fadeInSingle( img ) {
	fadeInSingleRe( img, 0 );
}

/* Fade in a single image then execute the passed function */
function fadeInSingleThen( img, nextFunction ) {
	document.getElementById( img ).style.visibility='visible';
	fadeInSingleThenRe( img, 0, nextFunction );
}


/*
	Make the images visible and fade them in
*/
function initImage() {
	/* Make images transparent */
	setOpacity('mainimg',0);
	setOpacity('sideimg1',0);
	setOpacity('sideimg2',0);
	setOpacity('sideimg3',0);
	setOpacity('sideimg4',0);

	/* Make images visible */
	document.getElementById('mainimg').style.visibility='visible';
	document.getElementById('sideimg1').style.visibility='visible';
	document.getElementById('sideimg2').style.visibility='visible';
	document.getElementById('sideimg3').style.visibility='visible';
	document.getElementById('sideimg4').style.visibility='visible';

	/* Hide loading images */
	document.getElementById('maindiv').style.background='#fff 50% 50% no-repeat';
	document.getElementById('sidediv1').style.background='#fff 50% 50% no-repeat';
	document.getElementById('sidediv2').style.background='#fff 50% 50% no-repeat';
	document.getElementById('sidediv3').style.background='#fff 50% 50% no-repeat';
	document.getElementById('sidediv4').style.background='#fff 50% 50% no-repeat';

	/* Fade in images */
	fadeInSingle('mainimg');
	fadeInSingle('sideimg1');
	fadeInSingle('sideimg2');
	fadeInSingle('sideimg3');
	fadeInSingle('sideimg4');

	/* Allow swapping */
	document.getElementById('swapping').value = 'false';
}


/*
	Fade a single image in recursuve function
*/
function fadeInSingleRe( img, opacity ) {
	var speed = 1;
	if( navigator.appName == 'Netscape' ) {
		speed = 2;
	}

	if( opacity <= 10 ) {
		setOpacity( img, opacity );
		window.setTimeout("fadeInSingleRe('"+img+"',"+(opacity+speed)+")", 10);
	}
}


/*
	Fade a single image in recursuve function
*/
function fadeInSingleThenRe( img, opacity, nextFunction ) {
	var speed = 1;
	if( navigator.appName == 'Netscape' ) {
		speed = 2;
	}

	//alert(opacity);

	if( opacity == 6 ) {
		//alert("xxx");
		eval(nextFunction);
	}

	if( opacity <= 20 ) {
		setOpacity( img, opacity );
		window.setTimeout("fadeInSingleThenRe('"+img+"',"+(opacity+speed)+", '"+nextFunction+"')", 10);
	}
}


/*
	Blank the two images and swap them
*/
function blankAndSwap( img1, img2 ) {
	var imgtag1 = document.getElementById(img1);
	var imgtag2 = document.getElementById(img2);

	imgtag1.opacity='0';
	imgtag2.opacity='0';

	var temp = imgtag1.src;
	imgtag1.src = imgtag2.src;
	imgtag2.src = temp;
}

/*
	Recursive fade out function
*/
function fadeOutRe( img1, img2, opacity ) {
	var speed = 1;
	if( navigator.appName == 'Netscape' ) {
		speed = 2;
	}

	if( opacity >= 0 ) {
		setOpacity( img1, opacity );
		setOpacity( img2, opacity );
		if( opacity > 0 ) {
			window.setTimeout("fadeOutRe('"+img1+"','"+img2+"',"+(opacity-speed)+")", 10);
		}
		else {
			blankAndSwap( img1, img2 );
			window.setTimeout("fadeInRe('"+img1+"','"+img2+"',"+(opacity)+")", 10);
		}
	}
}


/*
	Recursive fade in function
*/
function fadeInRe( img1, img2, opacity ) {
	var speed = 1;
	if( navigator.appName == 'Netscape' ) {
		speed = 2;
	}

	if( opacity <= 10 ) {
		setOpacity( img1, opacity );
		setOpacity( img2, opacity );
		window.setTimeout("fadeInRe('"+img1+"','"+img2+"',"+(opacity+speed)+")", 10);
	} else {
		document.getElementById('swapping').value = 'false';
	}
}

/*
	Set the opacity of the image with the passed ID
*/
function setOpacityHS(tag, opacity) {
	obj = document.getElementById(tag);

	opacity *= 5;

	opacity = (opacity == 100)?99.999:opacity;

	// IE/Win
	obj.style.filter = "alpha(opacity:"+opacity+")";

	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;

	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;

	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}


/*
	Set the opacity of the image with the passed ID
*/
function setOpacity(tag, opacity) {
	obj = document.getElementById(tag);

	opacity *= 10;

	opacity = (opacity == 100)?99.999:opacity;

	// IE/Win
	obj.style.filter = "alpha(opacity:"+opacity+")";

	// Safari<1.2, Konqueror
	obj.style.KHTMLOpacity = opacity/100;

	// Older Mozilla and Firefox
	obj.style.MozOpacity = opacity/100;

	// Safari 1.2, newer Firefox and Mozilla, CSS3
	obj.style.opacity = opacity/100;
}
