﻿/**************************Image Rotator Class**************************/
/*   Once preload fucntion is called the class will run on its own.    */
/* User controls allow for moving forward and backward through images. */
/*       Allows for multiple instances of RIs on same page.            */
/***********************************************************************/

function imageRotator(id, preloader, link, controls, img, time)
{
    //instance specific variables
    this.ID = id;
    this.preloader = document.getElementById(preloader);
    this.imglink = document.getElementById(link);
    this.controls = document.getElementById(controls);
    this.image = document.getElementById(img);
    this.pauseTime = time;
    
        //image data variables
        this.paths;
        this.names;
        this.urls;
       // this.targets;
        this.numImgs;
    
    //process tracking variables
    this.firstTime = true;
    this.currentImg = null; //rotation tracker
    this.g_iStep = 1; //preload tracker
    this.fading = false; //control blocker
    
    //tween objects
    this.fadeOutLoader = new OpacityTween(this.preloader, Tween.regularEaseOut, 100, 0, .75);
    this.fadeOutImg = new OpacityTween(this.image, Tween.regularEaseOut, 100, 0, 1.5);
    this.fadeInImg = new OpacityTween(this.image, Tween.regularEaseIn, 0, 100, 1.5);
    this.fadeOutCtrl = new OpacityTween(this.controls, Tween.regularEaseOut, 100, 0, 1.5);
    this.fadeInCtrl = new OpacityTween(this.controls, Tween.regularEaseIn, 0, 100, 1.5);
        //timer animation allows for a pause between animations - no visual effect 
        this.timer = new OpacityTween(this.preloader, Tween.regularEaseOut, 0, 0, this.pauseTime);
    
        //class reference for tween objects
        this.fadeInImg.data = this;
        this.fadeOutImg.data = this;
        this.fadeOutLoader.data = this;
        this.timer.data = this; 
        
     
    //class methods 
    
        //preloader methods
        this.preload = preload;
        this.update = OnImgUpdate;
        this.start = OnCompletion;
        
        //animation methods
        this.rotate = rotate;
        this.moveNext = skipToNext;
        this.moveLast = skipToPrevious;
        
        //tween objects' method assignments
        this.fadeOutLoader.onMotionFinished = fadeOutFinished
        this.fadeOutImg.onMotionFinished = fadeOutFinished;
        this.fadeInImg.onMotionFinished = fadeInFinished;
        this.timer.onMotionFinished = next;
}

function preload(){//preloads images to browser cache
    var oPreload = new ImagePreload(this, this.paths, this.update, this.start );
}
function OnImgUpdate(iProgress){//updates loadbar each time image is loaded
     var oSpan;
   
   if( (iProgress >= 1) && (iProgress <= 10) && (iProgress > this.data.g_iStep) )
   {  
       
       for(var i = this.data.g_iStep; i <= iProgress; i++)
       {
           oSpan = document.getElementById( "sDot" + i + "_" + this.data.ID + "" );
           oSpan.className = "FullDot_" + this.data.ID;
       }
       this.data.g_iStep = iProgress;
   }
}
function OnCompletion(){  
    //set animation variables
    this.data.numImgs = this.data.paths.length; 
    this.data.currentImg = 0; 
    this.data.fading = true;
    
    //start rotation
    this.data.fadeOutLoader.start();    
}
function fadeOutFinished(){
  //update image properties  
  this.data.image.src=this.data.paths[this.data.currentImg];
  this.data.image.alt=this.data.names[this.data.currentImg];
  this.data.imglink.href=this.data.urls[this.data.currentImg];
 // this.data.imglink.target=this.data.targets[this.data.currentImg];
  
  if(this.data.firstTime)
  {//needed to hide preloader and display image 
      this.data.preloader.style.display = "none";
      this.data.image.style.display = "block";
      this.data.controls.style.display = "block";
  }
  
  //begin fade-in of new image
  this.data.fadeInImg.start();
  this.data.fadeInCtrl.start();
}
function fadeInFinished(){   
    this.data.timer.start();//start timer
    
    this.data.fading = false;//re-enable controls
    if(this.data.firstTime) this.data.firstTime = false;
}
function rotate(){//initiates each animation 
    this.fading = true;//disable controls while images are in transition       
    this.fadeOutImg.start(); this.fadeOutCtrl.start();//begin transition
}
function next(){//controls automated looping of images
    if(this.data.currentImg >= this.data.numImgs-1)this.data.currentImg = 0; else this.data.currentImg++; 
   this.data.rotate();
}
function skipToNext(){//user control, skip to next image
    if(!this.fading){
        this.timer.stop();
        if(this.currentImg >= this.numImgs-1)this.currentImg = 0; else this.currentImg++; 
        this.rotate();}
}
function skipToPrevious(){//user control, skip to previous image
    if(!this.fading){
        this.timer.stop();
        if(this.currentImg <= 0)this.currentImg = this.numImgs-1; else this.currentImg--; 
        this.rotate();}
}