// xBrowserVisuals.js
// Contains all the cross-browser code to simulate IE filters on other browsers.

/*** For fading objects in and out, i.e. IE filter BlendTrans with changing only visibility of any DOM object ***/

function fadeInOut(id, opacStart, opacEnd, millisec)
{ 
    // speed for each frame 
    var speed = Math.round(millisec / 100); 
    var timer = 0; 

    // determine the direction for the blending, if start and end are the same nothing happens 
    if (opacStart > opacEnd)
    { 
        for(i = opacStart; i >= opacEnd; i--)
        { 
            setTimeout("setOpacity(g('" + id + "'), " + i + ");", (timer * speed));
            timer++; 
        } 
    }
    else if (opacStart < opacEnd)
    { 
        for(i = opacStart; i <= opacEnd; i++) 
        { 
            setTimeout("setOpacity(g('" + id + "'), " + i + ");", (timer * speed));
            timer++;
        } 
    } 
} 

/*** For fading 1 image into another, i.e. IE filter BlendTrans with changing src of image object ***/

var CrossFadeObjArray = new Array(0);

function CrossFadeClass(imgObj)
{
	CrossFadeObjArray.push(this);
	this.arrayId = CrossFadeObjArray.length - 1;
	this.clock = null;
	this.count = 1;
	this.obj = imgObj;
	this.crossfade = crossfadeSetup;	// call this to setup and start crossfade
}

function crossfadeSetup(startImg, endImg, durationSec)
{
	// If the object isn't in the middle of a crossfading operation already
	if (this.clock == null)
	{
		// Set img object to show starting image 
		this.obj.src = startImg;
		// Note down what ending image is
		this.newSrc = endImg;
		
		// Check if the browser doesn't support opacity
		if ( (typeof(this.obj.style.opacity) == 'undefined') && (typeof(this.obj.style.MozOpacity) == 'undefined') &&
			 (typeof(this.obj.style.KhtmlOpacity) == 'undefined') && (typeof(this.obj.filters) != 'object') )
		{
			// Then just show the ending image
			this.obj.src = this.newSrc;
		}
		// Otherwise if opacity is supported
		else
		{
			// Create a new image object and give it the ending image
			this.newObj = document.getElementsByTagName('body')[0].appendChild(document.createElement('img'));
			this.newObj.className = "idup4fade";
			this.newObj.src = this.newSrc;

			// Position new image object to superimpose original image
			this.newObj.style.left = getRealPosition(this.obj, 'x') + 'px';
			this.newObj.style.top = getRealPosition(this.obj, 'y') + 'px';
			
			// Set fade duration in seconds and number of fade iterations as 20 steps per second
			this.duration = durationSec * 1000;
			this.numiter = durationSec * 20;
			
			// Start the timer to call a fade iteration every 1000 / 20 = 50 milliseconds
			this.clock = setInterval("crossfadeIter('" + this.arrayId + "');", 50);
		}
	}
}

// Called automatically by timer for each iteration
function crossfadeIter(arrayId)
{
	var crossfadeObj = CrossFadeObjArray[arrayId];

	// Decrement counter
	crossfadeObj.count -= (1 / crossfadeObj.numiter);
	
	// If the counter has reached the bottom
	if(crossfadeObj.count < (1 / crossfadeObj.numiter))
	{
		// clear the timer
		clearInterval(crossfadeObj.clock);
		crossfadeObj.clock = null;
		
		// reset the counter
		crossfadeObj.count = 1;
		
		// set the original image to the src of the new image
		crossfadeObj.obj.src = crossfadeObj.newSrc;
	}
	
	// Update opacity levels on both objects
	if (crossfadeObj.count == 1)
		setOpacity(crossfadeObj.obj, 0.9999999 * 100);
	else
		setOpacity(crossfadeObj.obj, crossfadeObj.count * 100);
	setOpacity(crossfadeObj.newObj, (1 - crossfadeObj.count) * 100);

	// Show the new image that's fading in, now that we've done at least 1 iteration
	crossfadeObj.newObj.style.visibility = 'visible';
	
	// Make sure new image stays on top of original image
	crossfadeObj.newObj.style.left = getRealPosition(crossfadeObj.obj, 'x') + 'px';
	crossfadeObj.newObj.style.top = getRealPosition(crossfadeObj.obj, 'y') + 'px';
	
	// If the counter is at the top, which is just after the timer has finished
	if (crossfadeObj.count == 1)
	{
		// Remove the duplicate image
		crossfadeObj.newObj.parentNode.removeChild(crossfadeObj.newObj);
	}
}

// Returns absolute x or y position of the object relative to the whole body document
function getRealPosition(obj, coords)
{
	var pos = 0;
	var tmp = obj;
	while (tmp != null)
	{
		pos += (coords == 'x') ? tmp.offsetLeft : tmp.offsetTop;
		tmp = tmp.offsetParent;
	}
	return pos;
}