/************************************
	imgtools.js: Javascript Image Manipulation Code
**************************************/
// Simple routines to reveal and hide an object - pass the object id (string)
function RevealObj(objID) 
	{
	var ie4 = document.all
//	var dom = document.getElementById

	var myObj = ie4 ? eval("document.all." + objID) : document.getElementById(objID)
	myObj.style.visibility = "visible";   
}
function HideObj(objID) 
	{
	var ie4 = document.all
//	var dom = document.getElementById

	var myObj = ie4 ? eval("document.all." + objID) : document.getElementById(objID)
	myObj.style.visibility = "hidden";   
}

//	FadeInOut: Toggles the opacity of an element; if invisible (0) makes it 100%, and vise versa
// 		Pass: id of element, time to take fading in/out, in ms
function FadeInOut (id, millisec) { 
    //if an element is invisible, make it visible, else make it ivisible 
//alert ("fadeinout(" + id + "," + millisec)


if(document.getElementById(id).style.opacity == 0) { 
//alert ("current opacity is 0")
	ChangeToOpacity(id, 0, 100, millisec); 
    } 
	else { 
//alert ("current opacity is <> 0")
	ChangeToOpacity (id, 100, 0, millisec); 
    } 
}

//	ChangeToOpacity: Change the opacity of an element between specified start/end values, over
//					  a specified time interval.
// 		Pass: id of element, start & end opacities, time to take changing opacity, in ms
function ChangeToOpacity (id, opacStart, opacEnd, millisec) { 
    //speed for each frame 
    var speed = Math.round(millisec / 100); 
    var timer = 0; 
	var timeOutID;
	
//alert ("ChangeToOpacity(" + id + "," + opacStart + "," + opacEnd + "," + millisec + ")")
    //determine the direction for the blending, if start and end are the same nothing happens 
    if(opacStart > opacEnd) { 
        for(i = opacStart; i >= opacEnd; i--) { 
            timeOutID = setTimeout("SetOpacity(" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } else if(opacStart < opacEnd) { 
        for(i = opacStart; i <= opacEnd; i++) 
            { 
            timeOutID = setTimeout("SetOpacity (" + i + ",'" + id + "')",(timer * speed)); 
            timer++; 
        } 
    } 

return timeOutID;
}

//	SetOpacity: Set the opacity of an element to a specific value
// 		Pass: id of element, desired opacity
//	Can be called directly to instantly change opacity, or thru a wrapper function like ChangeToOpacity()
//		for a timed transtion from one opacity to another
function SetOpacity(vOpac, id) { 

//	var fadeObj = document.getElementById(id).style; 
	var fadeObj = document.getElementById(id); 
/*
	This block of code "looks" better, but doesn't run in Firefox - NONE of the below statements evaluate
	to true.
		if (fadeObj.filters)
			fadeObj.filters.alpha.opacity = vOpac
		if (fadeObj.style.opacity)
			fadeObj.style.opacity = vOpac/101			// official CSS3 - works in newer Mozille
		else if (fadeObj.style.MozOpacity)
			fadeObj.style.MozOpacity = vOpac/101
		else if (fadeObj.style.KhtmlOpacity)
*/
// This code runs in Firefox, but only if the "filters.alpha..." statement is last - for some reason,
// Firefox trips over it and won't run at all unless it sees the other statements first. However, maybe
// something IS wrong with that code, because it looks like IE triggers an error when it sees it.

	fadeObj.style.KhtmlOpacity = vOpac/101		// for Safari on Mac, and Konqueror
	fadeObj.style.opacity = vOpac/101			// official CSS3 - works in newer Mozilla
	fadeObj.style.MozOpacity = vOpac/101		// For older versions of Mozilla
	fadeObj.style.KhtmlOpacity = vOpac/101		// for Safari on Mac, and Konqueror
	fadeObj.style.filter = "alpha(opacity=" + vOpac + ")"	// For IE

}

/*	BlendImage: Blend one image into another

	Pass: 	divID = id string of div containing image
			imageID = id of image object itself within the div
			imgFile = filename of NEW image to be blended in
			millisec = # of millisec to take for transition

Requires a setup something like this; a div with a background image containing image object of same size.
When the page initially loads, the "top" and "bottom" images are the same, with the top transparent 

<div style="background-image: url(someimg.jpg); background-repeat: no-repeat; width: 200px; height: 150px;" id="blenddiv">
    <img src="someimg.jpg" style="width: 200px; height: 150px; border: 0 none; 
		filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0;" id="blendimage" alt="" />
</div>
*/
function BlendImage(divid, imageid, imagefile, millisec) 
	{ 

//alert("BlendImage("+divid+","+imageid+","+imagefile+","+millisec+")");

	var speed = Math.round(millisec / 100); 
    var timer = 0; 
     
    //Set the current image as background 
    document.getElementById(divid).style.backgroundImage = "url(" + document.getElementById(imageid).src + ")"; 
//alert ("Setting background to " + document.getElementById(imageid).src);

    //Make image (foreground) transparent - there should be no VISIBLE change because the background
	//image, which was just changed to match the foreground, is showing through.
	SetOpacity(0,imageid);
	
    //Now put the NEW image into the foreground - but it's invisible because the object is invisible;
	// observer still sees old image.
//alert ("Setting foreground to " + imagefile + ")");
    document.getElementById(imageid).src = imagefile; 

    //Fade in new (foreground) image 
    for (i = 0; i <= 100; i++) { 
       setTimeout("SetOpacity(" + i + ",'" + imageid + "')",   (timer * speed)); 
        timer++; 
    } 
}