var W3CDOM = (document.createElement && document.getElementsByTagName);

var mouseOvers = new Array();
var mouseOuts = new Array();

window.onload = init;

function getTagsByClass(theTag,theClass)
{
	var theClassTags = new Array();
        var theTags = document.getElementsByTagName(theTag)
	var j=0;
	for (i=0; i<theTags.length; i++)
	{ 
		if (theTags[i].className==theClass)
		{ 
			theClassTags[j] = theTags[i];
			j++;
		} 
	}
	return theClassTags;
}

function init()
{
	if (!W3CDOM) return;
        var imgs = getTagsByClass('img','blend-img');

	for (var i=0;i<imgs.length;i++)
	{
		document.getElementById(imgs[i].id + "_div").style.backgroundImage = "url(" + imgs[i].src + ")";
		if (imgs[i].id.indexOf('flip-') != -1) {
			imgs[i].onmouseover = mouseGoesOver;
			imgs[i].onmouseout = mouseGoesOut;
			var suffix = imgs[i].src.substring(imgs[i].src.lastIndexOf('.'));
			mouseOuts[i] = new Image();
			mouseOuts[i].src = imgs[i].src;
			mouseOvers[i] = new Image();
			mouseOvers[i].src = imgs[i].src.substring(0,imgs[i].src.lastIndexOf('.')) + "_flip" + suffix;
			imgs[i].number = i;
		}
	}

}

function mouseGoesOver()
{
    blendimage(this.id + "_div", this.id, mouseOvers[this.number].src, 500);
}

function mouseGoesOut()
{
    blendimage(this.id + "_div", this.id, mouseOuts[this.number].src, 500);
}

function changeOpac(opacity, id)
{ 
	 var object = document.getElementById(id).style; 
	 object.opacity = (opacity / 100); 
	 object.MozOpacity = (opacity / 100); 
	 object.KhtmlOpacity = (opacity / 100); 
	 object.filter = "alpha(opacity=" + opacity + ")"; 
}

function blendimage(divid, imageid, imagefile, millisec)
{ 
	var speed = Math.round(millisec / 100); 
	var timer = 0; 
	document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")";
	 
	var later = (new Date()).getTime() + 100;
	while(true) { if ((new Date()).getTime() > later) { break; }}
	 
	changeOpac(0, imageid); 
	document.getElementById(imageid).src = imagefile; 
	for(i = 0; i < 100; i++)
	{ 
		setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed)); 
		timer++; 
	}
}