//
//	a cross browser version of my glow.htc
//	mo /mircho@hotmail.com/
//
cFader = {
	speed	: 30,
	steps	: 8,
	active	: 0,

	//this means that the background color or the foreground color will fade
	colorfade	: false,
	
	startColor	: '#EFE686',
	endColor	: '#ffffff'
}

cFader.colorToNumber = function( sColor ){
	sRCol = /^#/
	return parseInt( '0x'+sColor.replace( sRCol, '' ) )
}

cFader.numberToColor = function( nColor ){
	nColor |= 1<<24
	return '#'+nColor.toString(16).substr(1)
}

// if bColor is true or unset then change the color of the element
// if bColor is false then change the background image of the element
cFader.fadeIn = function( sId ){
	var hElement = document.getElementById( sId )
	var sSC = hElement.getAttribute( 'fadestart' ) ? hElement.getAttribute( 'fadestart' ) : this.startColor
	var sEC = hElement.getAttribute( 'fadeend' ) ? hElement.getAttribute( 'fadeend' ) : this.endColor

	var nStartC = cFader.colorToNumber( sSC )
	var nEndC = cFader.colorToNumber( sEC )

	var nStartR = (nStartC & 0xff0000) >>> 16
	var nStartG = (nStartC & 0x00ff00) >>> 8
	var nStartB = (nStartC & 0x0000ff)
	
	var nEndR = (nEndC & 0xff0000) >>> 16
	var nEndG = (nEndC & 0x00ff00) >>> 8
	var nEndB = (nEndC & 0x0000ff)
	
	var bColorFade = hElement.getAttribute( 'fader' ) ?  hElement.getAttribute( 'fader' ) == 'color' : cFader.colorfade

	for( var nStep = 0; nStep <= this.steps; nStep++ ){
		nColor = nStartR * ( ( cFader.steps - nStep ) / cFader.steps ) + nEndR * ( nStep / cFader.steps ) << 16 | nStartG * ( ( cFader.steps - nStep ) / cFader.steps ) + nEndG * ( nStep / cFader.steps ) << 8 | nStartB * ( ( cFader.steps - nStep ) / cFader.steps ) + nEndB * ( nStep / cFader.steps )
		sColor = cFader.numberToColor( nColor )
		if ( bColorFade ){
			setTimeout( 'cFader.setElementColor( "'+sId+'", "'+sColor+'" )', cFader.speed * ( nStep + 1 ) )
		} else {
			setTimeout( 'cFader.setElementBGColor( "'+sId+'", "'+sColor+'" )', cFader.speed * ( nStep + 1 ) )
		}
	}
}

cFader.fadeOut = function( sId ){
	var hElement = document.getElementById( sId )
	var sSC = hElement.getAttribute( 'fadestart' ) ? hElement.getAttribute( 'fadestart' ) : this.startColor
	var sEC = hElement.getAttribute( 'fadeend' ) ? hElement.getAttribute( 'fadeend' ) : this.endColor

	var nStartC = cFader.colorToNumber( sSC )
	var nEndC = cFader.colorToNumber( sEC )

	var nStartR = (nStartC & 0xff0000) >>> 16
	var nStartG = (nStartC & 0x00ff00) >>> 8
	var nStartB = (nStartC & 0x0000ff)
	
	var nEndR = (nEndC & 0xff0000) >>> 16
	var nEndG = (nEndC & 0x00ff00) >>> 8
	var nEndB = (nEndC & 0x0000ff)
	
	var bColorFade = hElement.getAttribute( 'fader' ) ?  hElement.getAttribute( 'fader' ) == 'color' : cFader.colorfade

	for( var nStep = 0; nStep <= this.steps; nStep++ ){
		nColor = nEndR * ( ( cFader.steps - nStep ) / cFader.steps ) + nStartR * ( nStep / cFader.steps ) << 16 | nEndG * ( ( cFader.steps - nStep ) / cFader.steps ) + nStartG * ( nStep / cFader.steps ) << 8 | nEndB * ( ( cFader.steps - nStep ) / cFader.steps ) + nStartB * ( nStep / cFader.steps )
		sColor = cFader.numberToColor( nColor )
		if ( bColorFade ){
			setTimeout( 'cFader.setElementColor( "'+sId+'", "'+sColor+'" )', cFader.speed * ( nStep + 1 ) )
		} else {
			setTimeout( 'cFader.setElementBGColor( "'+sId+'", "'+sColor+'" )', cFader.speed * ( nStep + 1 ) )
		}
	}
}

cFader.setElementColor = function( sId, sColor ){
	document.getElementById( sId ).style.color = sColor
}

cFader.setElementBGColor = function( sId, sColor ){
	document.getElementById( sId ).style.backgroundColor = sColor
}