// IXF1.11 :: Image cross-fade 
// *****************************************************
// DOM scripting by brothercake -- http://www.brothercake.com/
//******************************************************
//global object

var ixf = { 'clock' : null, 'count' : 1 }
/*******************************************************



/*****************************************************************************
 List the images that need to be cached
*****************************************************************************/

ixf.imgs = [
	'buttons/udm4-whitebutton88x31.gif',
	'buttons/udm4-greenbutton88x31.gif',
	'buttons/udm4-purplebutton88x31.gif'
	];

/*****************************************************************************
*****************************************************************************/



//cache the images
ixf.imgsLen = ixf.imgs.length;
ixf.cache = [];
for(var i=0; i<ixf.imgsLen; i++)
{
	ixf.cache[i] = new Image;
	ixf.cache[i].src = ixf.imgs[i];
}
function fadeImage(id) {
  var obj = document.getElementById(id);
  var objstyle = obj;
  if (obj) {
    if(objstyle) objstyle = obj.style;
    if(obj.filters && obj.filters.blendTrans) obj.filters.blendTrans.Apply();
    objstyle.visibility = 'hidden';
    if(obj.filters && obj.filters.blendTrans) obj.filters.blendTrans.Play();
  }
};
function flipImage(id,src) {
  var obj = document.getElementById(id);
  var objstyle = obj;
  if (obj) {
    if(objstyle) objstyle = obj.style;
    if(obj.filters && obj.filters.blendTrans) obj.filters.blendTrans.Apply();
    obj.src = src;
    objstyle.visibility = 'visible';
    if(obj.filters && obj.filters.blendTrans) obj.filters.blendTrans.Play();
  }
};
function showdebug(txt) {
	var obj = document.getElementById('debugDiv'); 
	if(!obj) return;
	var dbg = obj.innerHTML; 
	obj.innerHTML = dbg + '<br/>' + txt;
	//document.getElementById('debugDiv').innerHTML = txt;
}
//crossfade setup function
function crossfade()
{
	//showdebug('crossfade('+arguments[0]+')');
	var obj = document.getElementById(arguments[0]);
	if(!obj) {
		//showdebug('crossfade('+arguments[0]+') object not found');
		return;
	}
	var theixf;
	if(obj.ixf) {
		theixf = obj.ixf;
	} else {
		//showdebug('crossfade('+arguments[0]+') creating ixf');
		theixf = { 'clock' : null, 'count' : 1 }
		theixf.cache = [];
		obj.ixf = theixf;
		//if the timer is not already going
		//get real position method
		theixf.getRealPosition = function()
		{
			this.pos = (arguments[1] == 'x') ? arguments[0].offsetLeft : arguments[0].offsetTop;
			this.tmp = arguments[0].offsetParent;
			while(this.tmp != null)
			{
				this.pos += (arguments[1] == 'x') ? this.tmp.offsetLeft : this.tmp.offsetTop;
				this.tmp = this.tmp.offsetParent;
			}
			
			return this.pos;
		};
	}
	if(theixf.clock == null)
	{
		//showdebug('crossfade('+arguments[0]+') ixf.clock = null');
		//copy the image object 
		theixf.obj = obj;
		
		//copy the image src argument 
		theixf.src = arguments[1];
		
		//store the supported form of opacity
		if(typeof theixf.obj.style.opacity != 'undefined')
		{
			theixf.type = 'w3c';
		}
		else if(typeof theixf.obj.style.MozOpacity != 'undefined')
		{
			theixf.type = 'moz';
		}
		else if(typeof theixf.obj.style.KhtmlOpacity != 'undefined')
		{
			theixf.type = 'khtml';
		}
		else if(typeof theixf.obj.filters == 'object')
		{
			//weed out win/ie5.0 by testing the length of the filters collection (where filters is an object with no data)
			//then weed out mac/ie5 by testing first the existence of the alpha object (to prevent errors in win/ie5.0)
			//then the returned value type, which should be a number, but in mac/ie5 is an empty string
			theixf.type = (theixf.obj.filters.length > 0 && typeof theixf.obj.filters.alpha == 'object' && typeof theixf.obj.filters.alpha.opacity == 'number') ? 'ie' : 'none';
		}
		else
		{
			theixf.type = 'none';
		}
		//showdebug('crossfade('+arguments[0]+') theixf.type = \''+theixf.type+'\'');
		if(theixf.type == 'none') {
			//showdebug('crossfade('+arguments[0]+') running ie code');
			//fadeImage(arguments[0]);
			// STYLE="position: relative; filter: blendTrans(duration=1);"
			if(theixf.ieclock) {
				clearTimeout(theixf.ieclock);
			}
			theixf.ieclock = setTimeout('flipImage(\''+arguments[0]+'\',\''+arguments[1]+'\')',50);
			return;
		}
		
		//change the image alt text if defined
		if(typeof arguments[3] != 'undefined' && arguments[3] != '')
		{
			theixf.obj.alt = arguments[3];
		}
		
		//if any kind of opacity is supported
		if(theixf.type != 'none')
		{
			if(!theixf.newimg) {
				//create a new image object and append it to body
				//detecting support for namespaced element creation, in case we're in the XML DOM
				theixf.newimg = document.getElementsByTagName('body')[0].appendChild((typeof document.createElementNS != 'undefined') ? document.createElementNS('http://www.w3.org/1999/xhtml', 'img') : document.createElement('img'));

				//set positioning classname
				theixf.newimg.className = 'idupe';

				//move it to superimpose original image
				theixf.newimg.style.left = theixf.getRealPosition(theixf.obj, 'x') + 'px';
				theixf.newimg.style.top = theixf.getRealPosition(theixf.obj, 'y') + 'px';
				theixf.newimg.style.zIndex = 10;
			}
			
			//set src to new image src
			theixf.newimg.src = theixf.src
			
			//copy and convert fade duration argument 
			theixf.length = parseInt(arguments[2], 10) * 1000;
			
			//create fade resolution argument as 20 steps per transition
			theixf.resolution = parseInt(arguments[2], 10) * 20;
			set_crossfade(theixf);
			//start the timer
			theixf.clock = setInterval('document.getElementById(\''+arguments[0]+'\').ixf.crossfade()', theixf.length/theixf.resolution);
		}
		
		//otherwise if opacity is not supported
		else
		{
			//just do the image swap
			theixf.obj.src = theixf.src;
		}
		
	}
};


//crossfade timer function
function set_crossfade(theixf) {
	theixf.crossfade = function()
	{
		//decrease the counter on a linear scale
		theixf.count -= (1 / theixf.resolution);
		
		//if the counter has reached the bottom
		if(theixf.count < (1 / theixf.resolution))
		{
			//clear the timer
			clearInterval(theixf.clock);
			theixf.clock = null;
			
			//reset the counter
			theixf.count = 1;
			
			//set the original image to the src of the new image
			theixf.obj.src = theixf.src;
		}
		
		//set new opacity value on both elements
		//using whatever method is supported
		switch(theixf.type)
		{
			case 'ie' :
				theixf.obj.filters.alpha.opacity = theixf.count * 100;
				theixf.newimg.filters.alpha.opacity = (1 - theixf.count) * 100;
				break;
				
			case 'khtml' :
				theixf.obj.style.KhtmlOpacity = theixf.count;
				theixf.newimg.style.KhtmlOpacity = (1 - theixf.count);
				break;
				
			case 'moz' : 
				//restrict max opacity to prevent a visual popping effect in firefox
				theixf.obj.style.MozOpacity = (theixf.count == 1 ? 0.9999999 : theixf.count);
				theixf.newimg.style.MozOpacity = (1 - theixf.count);
				break;
				
			default : 
				//restrict max opacity to prevent a visual popping effect in firefox
				theixf.obj.style.opacity = (theixf.count == 1 ? 0.9999999 : theixf.count);
				theixf.newimg.style.opacity = (1 - theixf.count);
		}
	
		//keep new image in position with original image
		//in case text size changes mid transition or something
		theixf.newimg.style.left = theixf.getRealPosition(theixf.obj, 'x') + 'px';
		theixf.newimg.style.top = theixf.getRealPosition(theixf.obj, 'y') + 'px';
		
		//now that we've gone through one fade iteration 
		//we can show the image that's fading in
		theixf.newimg.style.visibility = 'visible';
		
		//if the counter is at the top, which is just after the timer has finished
		if(theixf.count == 1)
		{
			//remove the duplicate image
			// commented out FB 20060325 
			//theixf.newimg.parentNode.removeChild(theixf.newimg);
		}
	};
}