// file: image.js
// version: 2.2
// author: KBE20090928



// ----- object: image
TECHHOUSE.image = {};



// ----- object: image.doublefade
TECHHOUSE.image.doublefade = function( parms ) {

	this.img1elem = document.getElementById( parms.image1 );
	this.img2elem = document.getElementById( parms.image2 );
	this.speed = ( parms.speed ) ? parms.speed : 5;
	this.change = ( parms.change ) ? parms.change : 5;

	TECHHOUSE.changeOpacity( this.img1elem, 100, true );
	TECHHOUSE.changeOpacity( this.img2elem, 0, true );

	this.img1opacity = 100;
	this.img2opacity = 0;

	this.timer = null;
	this.fadeOperation = 0; // 0=no fading, 1=1down2up in progress, 2=1up2down in progress

	var that = this;

	function fade1down2up() {
		that.fadeOperation = 1;
		beginFade();
		}

	function fade1up2down() {
		that.fadeOperation = 2;
		beginFade();
		}

	function beginFade() {
		if( that.timer ) { clearTimeout( that.timer ); }

		var fade = function() {
			if( ( that.fadeOperation == 1 ) && ( that.img1opacity > 0 ) ) {
				that.img1opacity -= that.change;
				that.img1opacity = ( that.img1opacity < 0 ) ? 0 : that.img1opacity;
				that.img2opacity += that.change;
				that.img2opacity = ( that.img2opacity > 100 ) ? 100 : that.img2opacity;
				TECHHOUSE.changeOpacity( that.img1elem, that.img1opacity, true );
				TECHHOUSE.changeOpacity( that.img2elem, that.img2opacity, true );
				that.timer = setTimeout( fade, that.speed );
				}
			else if ( ( that.fadeOperation == 2 ) && ( that.img1opacity < 100 ) )
			{
				that.img1opacity += that.change;
				that.img1opacity = ( that.img1opacity > 100 ) ? 100 : that.img1opacity;
				that.img2opacity -= that.change;
				that.img2opacity = ( that.img2opacity < 0 ) ? 0 : that.img2opacity;
				TECHHOUSE.changeOpacity( that.img1elem, that.img1opacity, true );
				TECHHOUSE.changeOpacity( that.img2elem, that.img2opacity, true );
				that.timer = setTimeout( fade, that.speed );
				}
			else {
				that.fadeOperation = 0;
				}
			}
		that.timer = setTimeout( fade, that.speed );

		}

	// attach events
	if( this.img1elem && this.img2elem ) {

		if( TECHHOUSE.browser.name == 'MSIE' ) {
			this.img1elem.attachEvent( 'onmouseover', fade1down2up );
			this.img1elem.attachEvent( 'onmouseout', fade1up2down );
			}
		else {
			this.img1elem.addEventListener( 'mouseover', fade1down2up, false );
			this.img1elem.addEventListener( 'mouseout', fade1up2down, false );
			}

		}

	}






// ----- object: image.preload
TECHHOUSE.image.preload = function( parms ) {

	this.path = ( parms.path ) ? parms.path : '';
	this.filename = ( parms.filename ) ? parms.filename : '';

	var i;

	this.filenameArr = this.filename.split( ',' );

	// one image only
	if( this.filenameArr.length == 0 ) {
		this.filenameArr[ 0 ] = this.filename;
		}

	// preload images
	this.sourceArr = [];

	for( i = 0; i < this.filenameArr.length; i++ ) {
		this.sourceArr[ i ] = new Image();
		this.sourceArr[ i ].src = this.path + this.filenameArr[ i ];
		}

	}



// ----- object: image.autofade
/*
imageObj : object from TECHHOUSE.image.preload();
imageTopId : id of top image element
imageBottomId : id of bottom image element
randomize : show images in random order? true or false
rotateDelay : pause between image rotation (in ms)
fadeDelay : pause between image fade step (in ms)
fadeChange : change in opacity at each fade step (1-100)
fadeMSIE : true = change opacity for MSIE via "alpha(opacity=N)"
*/
TECHHOUSE.image.autofade = function( parms ) {

	var that = this;

	this.imageObj = ( parms.imageObj ) ? parms.imageObj : undefined;
	this.imageTopId = ( parms.imageTopId ) ? parms.imageTopId : undefined;
	this.imageBottomId = ( parms.imageBottomId ) ? parms.imageBottomId : undefined;
	this.randomize = ( parms.randomize ) ? parms.randomize : false;
	this.rotateDelay = ( parms.rotateDelay ) ? parms.rotateDelay : 3000;
	this.fadeDelay = ( parms.fadeDelay ) ? parms.fadeDelay : 5;
	this.fadeChange = ( parms.fadeChange ) ? parms.fadeChange : 5;
	this.fadeMSIE = ( parms.fadeMSIE ) ? parms.fadeMSIE : true;

	if( !parms.fadeMSIE ) { this.fadeMSIE = false; }

	// make array of preloaded image numbers
	this.imageNumberArr = [];
	for( var i = 0; i < this.imageObj.sourceArr.length; i++ ) {
		this.imageNumberArr[ i ] = i;
		}

	// randomize image numbers
	if( this.randomize ) {
		TECHHOUSE.randomizeArray( { arr: this.imageNumberArr } );
		}

	// fades top image out and bottom image in and then changes top image source
	this.topOut = function() {
		that.imageTopOpacity -= that.fadeChange;
		that.imageTopOpacity = ( that.imageTopOpacity < 0 ) ? 0 : that.imageTopOpacity;
		that.imageBottomOpacity += that.fadeChange;
		that.imageBottomOpacity = ( that.imageBottomOpacity > 100 ) ? 100 : that.imageBottomOpacity;
		TECHHOUSE.changeOpacity( that.imageTopElem, that.imageTopOpacity, that.fadeMSIE );
		TECHHOUSE.changeOpacity( that.imageBottomElem, that.imageBottomOpacity, that.fadeMSIE );

		if( that.imageTopOpacity > 0 ) {
			setTimeout( that.topOut, that.fadeDelay );
			}
		else {
			that.fadeDirection = 2;
			}

		}

	// fades bottom image out and top image in and then changes bottom image source
	this.bottomOut = function() {
		that.imageTopOpacity += that.fadeChange;
		that.imageTopOpacity = ( that.imageTopOpacity > 100 ) ? 100 : that.imageTopOpacity;
		that.imageBottomOpacity -= that.fadeChange;
		that.imageBottomOpacity = ( that.imageBottomOpacity < 0 ) ? 0 : that.imageBottomOpacity;
		TECHHOUSE.changeOpacity( that.imageTopElem, that.imageTopOpacity, that.fadeMSIE );
		TECHHOUSE.changeOpacity( that.imageBottomElem, that.imageBottomOpacity, that.fadeMSIE );

		if( that.imageBottomOpacity > 0 ) {
			setTimeout( that.bottomOut, that.fadeDelay );
			}
		else {
			that.fadeDirection = 1;
			}

		}

	// rotates images
	this.rotate = function() {

		// next image
		that.imageNo++;
		if( that.imageNo >= that.imageNumberArr.length ) {
			that.imageNo = 0;
			}

		if( that.fadeDirection == 1 ) {
			that.imageBottomElem.src = that.imageObj.sourceArr[ that.imageNumberArr[ that.imageNo ] ].src;
			that.topOut();
			}

		else {
			that.imageTopElem.src = that.imageObj.sourceArr[ that.imageNumberArr[ that.imageNo ] ].src;
			that.bottomOut();
			}

		}

	// start rotating and fading images
	this.imageTopElem = document.getElementById( this.imageTopId );
	this.imageBottomElem = document.getElementById( this.imageBottomId );
	this.imageTopOpacity = 100;
	this.imageBottomOpacity = 0;
	this.fadeDirection = 1;
	this.imageNo = 0;

	if( this.imageTopElem && this.imageBottomElem ) {
		this.imageTopElem.src = this.imageObj.sourceArr[ this.imageNumberArr[ this.imageNo ] ].src;

		if( this.imageNumberArr.length > 1 ) {
			this.rotateTimer = setInterval( this.rotate, this.rotateDelay );
			}

		}

	}