//Time (in milliseconds) between fade parts
	var fadetime=30;
	var fadeinc =5;

	var pageState = new Object();
	
//Loads the images into view.
	function renderImages()
	{ if(imageReady())
	  {
         var img = document.getElementById("mainimage");
		 img.src = pageState.rollOverCache[pageState.currnumber].main.src;
         linkimg = document.getElementById("linkbar");
         linkimg.src = pageState.rollOverCache[pageState.currnumber].link.src;
         linkimg.onmouseover = function() {this.src=pageState.rollOverCache[pageState.currnumber].link_over.src;}
         linkimg.parentNode.setAttribute("href",RolloverConfig.links[pageState.currnumber]);
         //linkimg.onclick=function() { window.open(RolloverConfig.links[pageState.currnumber],'_self') };
         linkimg.onmouseout =  function() {this.src=pageState.rollOverCache[pageState.currnumber].link.src; }
         for(var i=0; i<pageState.buttonCache.length; i++)
         { if(i!=pageState.currnumber) pageState.buttonCache[i].src=pageState.rollOverButton.up.src
           else pageState.buttonCache[i].src=pageState.rollOverButton.down.src
           //pageState.buttonCache[i].height=28
         }
      };
	}
   //If we've already loaded the image, return true.  
	function imageReady()
	{ if(typeof(pageState.rollOverCache[pageState.currnumber])!='undefined' && 
	    typeof(pageState.rollOverCache[pageState.currnumber].main)!='undefined' &&
        pageState.rollOverCache[pageState.currnumber].main.complete
        )
	  	return true;
	  	return false;
	}
	
   function imageSleeper()
   { var timeout = 300; //alert("HERE");     
   
   ; try {
    //Go ahead if the image has already been loaded and the page isn't frozen.
     if(imageReady() && !pageState.frozen)
     { timeout=fadetime;
       var img = document.getElementById("mainimage");
       //Load the image if it needs it.
       if(img.src!=pageState.rollOverCache[pageState.currnumber].main.src) 
       { renderImages();
       }
       var opac = getOpacity(img);
       //If we just reached zero opacity, then change the state to "fading in" and load a new image.
       if(opac==0) { pageState.fadestate=fadeinc; pageState.currnumber=(pageState.currnumber+1)%RolloverConfig.names.length; }
       //If we just reached 100%, then wait a bit before fading out.
       else if(opac==100 && pageState.fadestate==fadeinc) { pageState.fadestate=0; timeout=3000 }
       //Start fading out if we aren't currently fading in.
       else if(pageState.fadestate==0) pageState.fadestate=-fadeinc;
       //changeOpacity(img,Math.round(Math.random()*100));
       changeOpacity(img,opac+pageState.fadestate);
       changeOpacity(document.getElementById("linkbar"),opac+pageState.fadestate);

     }//Wait for the image to load for .3 seconds if it hasn't yet. 
     else timeout=300;
     setTimeout('imageSleeper()',timeout);	
    } catch(e) { alert(e) };
   }

   function getOpacity(imageobject) 
   { 
   if(typeof(imageobject.style.MozOpacity)!='undefined')
      if(/(^\d+$)|(^\d+\.\d+$)/.test(imageobject.style.MozOpacity))
    	return imageobject.style.MozOpacity*100;      
      else
      	return 100;
 	 else if (typeof(imageobject.filters)!='undefined')
        return imageobject.filters.alpha.opacity;
     else return null
   };
   
   function changeOpacity(imageobject, opacity){
 	if(typeof(imageobject.style.MozOpacity)!='undefined')
	    imageobject.style.MozOpacity=opacity/100;
 	else if (typeof(imageobject.filters)!='undefined')
    	imageobject.filters.alpha.opacity=opacity
	}
   
   function freezeFullOpacity()
   {
     pageState.frozen = true;
   	 changeOpacity(document.getElementById("mainimage"),100);
  	 changeOpacity(document.getElementById("linkbar"),100);
   	 pageState.fadeState=fadeinc;
   }

   function thaw()
   { pageState.frozen=false;
   }
   
   //Creates a path given an extension object and a name.
   function buildPath(name, extension)
   {
     return extension.path+name+extension.extension
   }

   //Loads all of the images, starting with the "startnumber" image.  This is done one at a time.
   //We only need the first image when the page loads.  All the rest can wait.
   function imageLoader()
   { pageState.count=(pageState.count+1)%RolloverConfig.names.length
     if(typeof(pageState.rollOverCache[pageState.count])=='undefined')
   	   { var currtreb = new Object()
   	   ; currtreb.main = new Image()
  	   ; currtreb.link = new Image()
 	   ; currtreb.link_over = new Image()
  	       //currtreb.main.onload=imageLoader; 
   	   ; currtreb.main.src = buildPath(RolloverConfig.names[pageState.count],RolloverConfig.main)
  	   ; currtreb.link.src = buildPath(RolloverConfig.names[pageState.count],RolloverConfig.link)
 	   ; currtreb.link_over.src = buildPath(RolloverConfig.names[pageState.count],RolloverConfig.link_over)

   	   ; pageState.rollOverCache[pageState.count]=currtreb
   	   ; if(pageState.count!=pageState.startnumber)
   	   		setTimeout('imageLoader();',100)
//   	   	 else { parent.document.getElementById('loadingImg').style.visibility="hidden"; }
   	   }
   }

function pageStateInit()
{
	//Used to determine if we're fading in or out.  Start with in, and the image thread will transition.
	pageState.fadestate = fadeinc;
	//The first image used.  Used to deal with page loads.
	pageState.startnumber = Math.round(Math.random()*(RolloverConfig.names.length-1));
	//The current image being loaded.
	pageState.count=pageState.startnumber;
	//The current image to be displayed
	pageState.currnumber=(pageState.count+1)%RolloverConfig.names.length;
	//If frozen is true, stop the fade thread from taking any actions.
	pageState.frozen = false;
	
	//RollOverCache stores all the images used in the rollover.
	pageState.rollOverCache = new Array();
	pageState.buttonCache=new Array();
	pageState.rollOverButton = new Object();
	pageState.rollOverButton.down = new Image();
	pageState.rollOverButton.up = new Image();
	pageState.rollOverButton.down.src = RolloverConfig.button.down;
	pageState.rollOverButton.up.src = RolloverConfig.button.up;
	
	buttons = document.getElementById("buttonrow");
	for(i=0; i<RolloverConfig.names.length; i++)
	{ newIMG = document.createElement("img");
	  newIMG.src = pageState.rollOverButton.up.src;
	  newIMG.buttonNo=i;    	  
	  //newIMG.style.cursor='pointer';
	  newIMG.onmouseover = function() 
	  { this.src=pageState.rollOverButton.down.src;
	      pageState.currnumber = this.buttonNo;
	      freezeFullOpacity();
		  renderImages();
	  }
	  
	  newIMG.onmouseout = function() { thaw(); };
	  //newIMG.style.cursor="hand";
	  buttons.appendChild(newIMG);
	  pageState.buttonCache[i]=newIMG;
	  buttons.appendChild(document.createElement("br"));
	};
}