/******************************************************** 
  
  Home page scripts for Fade In/Fade Out animation in
  Done by  Sasa Jovanovic. 10/28/2010
  
*********************************************************/

/* Hold info about images used on home page */
/* NOTE: Number of images on home page is not hard coded & user is allowed to add them */
var currImage=0;
var noOfImgs=0;
var lnks=new Array();
var imgs=new Array();

/* Opacity tween animation globals */
var OTT;
var oT1;
var oT2;
var oT3;
var oT4;
var oT5;

function initializePage() {
   var i;
   
   /* Counting how many images are going to be in slide show */
   for (i=0;i<document.getElementById("slideShowImages").childNodes.length;i++) {
	   if (document.getElementById("slideShowImages").childNodes.item(i).tagName=="A") {		    
		    imgs[noOfImgs]=document.getElementById("slideShowImages").childNodes.item(i).childNodes.item(0).src
		    lnks[noOfImgs]=document.getElementById("slideShowImages").childNodes.item(i).href;
			noOfImgs++;
	   }
   }

    /* Initialization of starting elements
	   ImageBack => Image to be faded in 
	   Image => Image to be faded out
	   imageLInk => on click folow this link
	*/
   document.getElementById("ImageBack").style.backgroundImage="url("+ imgs[0] + ")"
   document.getElementById("Image").style.backgroundImage="url("+ imgs[0] + ")"
   document.getElementById("imageLink").href=lnks[0]

   /* Delays for atransparency animation is half a second  and it is defined as last parameter on object initialization */
   oT1 = new OpacityTween(document.getElementById("pageContent"),Tween.regularEaseIn,0,100,0.5);
   oT2 = new OpacityTween(document.getElementById("mainMenu"),Tween.regularEaseIn,0,100,0.5);
   oT3 = new OpacityTween(document.getElementById("ImageBack"),Tween.regularEaseIn,0,100,0.5);
   oT4 = new OpacityTween(document.getElementById("quickInfo"),Tween.regularEaseIn,0,100,0.5);
   oT5 = new OpacityTween(document.getElementById("copyRight"),Tween.regularEaseIn,0,100,0.5);

   /* Sequecnce of events first event starts imdiatelly, others are delayed via javascript setTimer function. 
      Last parameter is for delay in miliseconds: 500 means half a second */
	  
   oT1.start()                              
   setTimeout ( "oT2.start()", 500 );
   setTimeout ( "oT3.start()", 1000 );
   setTimeout ( "oT4.start()", 1500 );
   setTimeout ( "oT5.start()", 1800 );
   setTimeout ( "rotateImagesWithFadeInOut()", 3500 );  /* This is delaying animation from page load */

}

/* This slade show is rotating images with transparency animation in cycles from last to first */
function rotateImagesWithFadeInOut() {
	
   /* Set image to be faded out opaque */
   /* There are two layers one above other and fadding in/out is simply done by fading out top layer */
   document.getElementById("Image").style.backgroundImage="url("+ imgs[currImage] + ")"
   setOpacity("Image",100)
   
   currImage++;                            /* Set counter to next image */
   if (currImage>=noOfImgs) currImage=0;   /* and chek end to rotate */
   
   /* Set image and link */
   document.getElementById("imageLink").href=lnks[currImage]
   document.getElementById("ImageBack").style.backgroundImage="url("+ imgs[currImage] + ")"
   
   OTT = new OpacityTween(document.getElementById("Image"),Tween.regularEaseIn,100,0,0.5); /* Define fading out params and start animation*/
   OTT.start() 
   setTimeout ( "rotateImagesWithFadeInOut()", 2000 );    /* Delay for next image to be active in slide show */
}