/*
 *  DECLARE CLASS:
 *      EtechSlideShow
 *
 *      properties:
 *          id      :   id of Slideshow
 *          images  :   list of Images
 *          names   :   list of Image Names
 *          links   :   list of Image Links
 *          timeFadeIn  : time for Fade-In Effect   (in Seconds)
 *          timeFadeOut : time for Fade-Out Effect  (in Seconds)
 *          timeDisplay : time for Display Image    (in Seconds)
 *
 *      functions:
 *          next    :   continue with Next Image of SlideShow   <==="
 *          fadeIn  :   start Fade-In Effect                        "
 *          fadeOut :   start Fade-Out Effect                       "
 *                                                                  "
 *      static functions:                                           "
 *          changeOpac : change Opacity of a Element                "
 *          next    :   call to Next function -----------------------
 *          
 */
function EtechSlideShow (id , images , names , links , timeFadeIn , timeFadeOut , timeDisplay ) {
    //
    this.id = id;
    this.images = images;
    this.names = names;
    this.links = links;
    this.timeFadeIn = timeFadeIn;
    this.timeFadeOut = timeFadeOut;
    this.timeDisplay = timeDisplay;
    
    //init Current Idx
    this._currentIdx = 0;
    
    //fadeOut from 2rd image.
    //for(i = 1; i < this.images.length; i++){
    //	EtechSlideShow.changeOpac( 0 , 'etech_slideshow_' + this.id + "_image_" + i);
    //}
    
    //next
    setTimeout("EtechSlideShow.next(\"" + this.id + "\")"  , this.timeDisplay);		
}

EtechSlideShow.prototype.next = function (){
    //Fade Out
    this.fadeOut(this._currentIdx);
    
    //next Image
    this._currentIdx++;
    if(this._currentIdx >= this.images.length) this._currentIdx = 0;    

    //Fade-In
    this.fadeIn(this._currentIdx);

    //change Link
    document.getElementById('etech_slideshow_' + this.id + '_link').href = this.links[this._currentIdx];
    document.getElementById('etech_slideshow_' + this.id + '_link').title = this.names[this._currentIdx];    

    //next
    setTimeout("EtechSlideShow.next(\"" + this.id + "\")"  , this.timeDisplay);
}

EtechSlideShow.prototype.fadeIn = function(image_idx) {
    var speed = Math.round(this.timeFadeIn / 100);
    var timer = 0;
    var id = 'etech_slideshow_' + this.id + "_image_" + image_idx;

    for(i = 0; i <= 100; i++) {
        setTimeout("EtechSlideShow.changeOpac(" + i + ",'" + id + "')",(timer * speed));
        timer++;
    }   
}

EtechSlideShow.prototype.fadeOut = function(image_idx) {
    var speed = Math.round(this.timeFadeOut / 100);
    var timer = 0;
    var id = 'etech_slideshow_' + this.id + "_image_" + image_idx;
    
    for(i = 100; i >= 0; i--) {
        setTimeout("EtechSlideShow.changeOpac(" + i + ",'" + id + "')",(timer * speed));
        timer++;
    }
}

/*
 *  Static Functions
 */

EtechSlideShow.next = function(id){
    slideshow = window['etech_slideshow_' + id];
    slideshow.next();
}

EtechSlideShow.changeOpac = function (opacity, id) {
    var object = document.getElementById(id).style;
    
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
}