// IXF1.11 :: Image cross-fade
// *****************************************************
// DOM scripting by brothercake -- http://www.brothercake.com/
//******************************************************

//
// class cCache
//
function cCache() {
  this.aCache = [];
  this.iCount = 0;
  this.urlPic = [];
  this.load = function (urlPic) {
    for(i=0; i< this.iCount; i++ ) {
      if ( this.urlPic[i] == urlPic) {
        return 0;
      }
    }
  	this.aCache[this.iCount] = new Image;
    this.aCache[this.iCount].src = urlPic;
    this.urlPic[this.iCount] = urlPic;
    this.iCount++;
  }
  this.count = function() {
    return this.iCount;
  }

} // end class /////////////////////////////////////////////////////////////////

//
// cPicMod
//
function cPicMod(elem) {
  this.elem             = elem ;  // element to modify
  this.clock            = null;
  this.count            = 1;
  this.iPicNamesInList  = 0;   // names in array (-1)
  this.aPicNames   = new Array();
  this.iPicShowing = 0;
  this.ispeed = 0.5;
  this.resoluton  = 40;

  this.AddPic = function (PicName) {
    if (r = myCache.load(PicName) !=0) {
      this.aPicNames[this.iPicNamesInList] = PicName;
      this.iPicNamesInList++;
      }
    return r;
  }

  this.crossfade = function() { // prepare a fade
    this.iPicShowing++;

    if (this.iPicShowing >= this.iPicNamesInList) {
      this.iPicShowing = 0;  // back to start!
    }
//    crossfade(document.getElementById(this.elem), this.aPicNames[this.iPicShowing], '1');

  	//if the timer is not already going
	  if(this.clock == null)	{
  		//copy the image object
  		this.obj = document.getElementById(this.elem);

	  	//copy the image src argument
		  this.src = this.aPicNames[this.iPicShowing];

  		//store the supported form of opacity
	  	if(typeof this.obj.style.opacity != 'undefined')			      this.type = 'w3c';
	 		else if(typeof this.obj.style.MozOpacity != 'undefined')	  this.type = 'moz';
  		else if(typeof this.obj.style.KhtmlOpacity != 'undefined')  this.type = 'khtml';
			else if(typeof this.obj.filters == 'object') {
  			//weed out win/ie5.0 by testing the length of the filters collection (where filters is an object with no data)
	  		//then weed out mac/ie5 by testing first the existence of the alpha object (to prevent errors in win/ie5.0)
		  	//then the returned value type, which should be a number, but in mac/ie5 is an empty string
			  this.type = (this.obj.filters.length > 0 && typeof this.obj.filters.alpha == 'object' && typeof this.obj.filters.alpha.opacity == 'number') ? 'ie' : 'none';
        this.resoluton=10;
  		}
	  	else  this.type = 'none';


		//if any kind of opacity is supported
		if(this.type != 'none')
		{
			//create a new image object and append it to body
			//detecting support for namespaced element creation, in case we're in the XML DOM
			this.newimg = document.getElementsByTagName('body')[0].appendChild((typeof document.createElementNS != 'undefined') ? document.createElementNS('http://www.w3.org/1999/xhtml', 'img') : document.createElement('img'));

			//set positioning classname
			this.newimg.className = 'idupe';

			//set src to new image src
			this.newimg.src = this.src;

			//move it to superimpose original image
			this.newimg.style.left = this.getRealPosition(this.obj, 'x') + 'px';
			this.newimg.style.top = this.getRealPosition(this.obj, 'y') + 'px';

			//copy and convert fade duration argument
			this.length = this.ispeed * 1000;

			//create fade resolution argument as 20 steps per second
			this.numFrames = this.ispeed * this.resoluton;

			//start the timer
    var thisObj = this;
		this.clock = setInterval(function() {thisObj.cron_crosfade() }, this.length/this.numFrames);
		}
		//otherwise if opacity is not supported
		else
		{
			//just do the image swap
			this.obj.src = this.src;
      return 0;
		}
	}
	return 0;
  }
//crossfade timer function
  this.cron_crosfade = function() {
  	//decrease the counter on a linear scale
	  this.count -= (1 / this.numFrames);

  	//if the counter has reached the bottom
	  if(this.count < (1 / this.numFrames)) {
		  //clear the timer
  		clearInterval(this.clock);
	  	this.clock = null;
		  //reset the counter
  		this.count = 1;

	  	//set the original image to the src of the new image
		  this.obj.src = this.src;
  	}

	  //set new opacity value on both elements
  	//using whatever method is supported
	  switch(this.type)	{
		  case 'ie' :
			  this.obj.filters.alpha.opacity = this.count * 100;
  			this.newimg.filters.alpha.opacity = (1 - this.count) * 100;
	  		break;
  		case 'khtml' :
	  		this.obj.style.KhtmlOpacity = this.count;
		  	this.newimg.style.KhtmlOpacity = (1 - this.count);
			  break;
  		case 'moz' :
	  		//restrict max opacity to prevent a visual popping effect in firefox
		  	this.obj.style.MozOpacity = (this.count == 1 ? 0.9999999 : this.count);
			  this.newimg.style.MozOpacity = (1 - this.count);
    		break;
  		default :
	  		//restrict max opacity to prevent a visual popping effect in firefox
		  	this.obj.style.opacity = (this.count == 1 ? 0.9999999 : this.count);
			  this.newimg.style.opacity = (1 - this.count);
  	}

	  //now that we've gone through one fade iteration
  	//we can show the image that's fading in
	  this.newimg.style.visibility = 'visible';

  	//keep new image in position with original image
	  //in case text size changes mid transition or something
  	this.newimg.style.left = this.getRealPosition('x') + 'px';
	  this.newimg.style.top = this.getRealPosition('y') + 'px';

  	//if the counter is at the top, which is just after the timer has finished
	  if(this.count == 1)	{
		  //remove the duplicate image
  		this.newimg.parentNode.removeChild(this.newimg);
	  	this.clock=null;
  	}
  };
  //get real position method
  this.getRealPosition = function(axis) {
  	this.pos = (axis == 'x') ? this.obj.offsetLeft : this.obj.offsetTop;
	  this.tmp = this.obj.offsetParent;
  	while(this.tmp != null)	{
  		this.pos += (axis == 'x') ? this.tmp.offsetLeft : this.tmp.offsetTop;
	  	this.tmp = this.tmp.offsetParent;
  	}
	  return this.pos;
  };
}// end class /////////////////////////////////////////////////////////////////

////////////////////////////////////////////////////////////////////////////////
myCache= new cCache();
myPicMod1 = new cPicMod('UpholsteredPic');
myPicMod2 = new cPicMod('WoodPic');
myPicMod3 = new cPicMod('MetalPic');
//
//
//



/*******************************************************


/*****************************************************************************
*****************************************************************************/

var iTimer          = 0;


function doNextPic() {
//  doLoadPic();

  if (myCache.count()!=0 ) { // no pics? forget it!
    iTimer++;

    switch (iTimer) {

      case 2:   myPicMod1.crossfade();
                iTimer = 0;

                break;
      }
  }
}


var clock2 = setInterval('doNextPic()', 3000);



////////////////////////////////////////////////////////////////////////////////