addLoadEvent( function() { new InfoLayer() } );


function InfoLayer()
{
	var infoLayer = document.getElementById( 'infoLayer' );
	var caption   = document.getElementById( 'caption' );	
	
	if ( infoLayer && caption ) {
		caption.innerHTML += ( caption.innerHTML != '' ? ' | ' : '' ) +
		                     "<span id='btnInfo'>Info...</span>";
							
		var layerStepCount  = 7;   // May be changed
		var layerOpacity    = 0;   // Do not change
		var layerStepSize   = Math.floor( 80 / layerStepCount );
		
		var infoStepCount   = 40;  // May be changed
		var infoOpacity     = 100; // Do not change
		var infoStepSize    = Math.floor( 100 / infoStepCount );		
		var maxLayerOpacity = layerStepCount * layerStepSize;
		
		var btnInfo = document.getElementById( 'btnInfo' );
		var timerToggle, timerBlink;
				
		hideInfo = function() {
			clearTimeout( timerToggle );
			timerToggle = null;
			setOpacity( infoLayer, layerOpacity );
			if ( layerOpacity > 0 ) {
				layerOpacity -= layerStepSize;
				timerToggle = setTimeout( "hideInfo()", 5 );
			}
		}
		
		showInfo = function() {
			if ( timerBlink != 'undefined' ) {
				setOpacity( btnInfo, 100 );				
				clearTimeout( timerBlink );
				timerBlink = null;
			}
			if ( timerToggle != 'undefined' ) {
				clearTimeout( timerToggle );
				timerToggle = null;
			}
			setOpacity( infoLayer, layerOpacity );
			if ( layerOpacity < maxLayerOpacity ) {
				layerOpacity += layerStepSize;
				timerToggle = setTimeout( "showInfo()", 5 );
			}
		}
		
		blinkInfo = function() {
			if ( infoOpacity <= 20 || infoOpacity >= 100 ) {
				infoStepSize *= -1;
			}
			infoOpacity += infoStepSize;
			setOpacity( btnInfo, infoOpacity );
			timerBlink = setTimeout( "blinkInfo()", 20 );
		}
		
		btnInfo.onmouseover = showInfo;
		btnInfo.onmouseout  = hideInfo;
		blinkInfo();
	}
}


		
function setOpacity( obj, opacity )
{
	if ( obj != 'undefined' ) {
		obj.style.opacity = opacity / 100;
		obj.style.filter  = "alpha( opacity:" + opacity + " )";
	}
}