/**
 * Banner fading Klasse
 * Die Klasse selektiert anhand einer css Klasse die zu fadenden Banner.
 * Die Banner sollten einfach übereinander geladen werden. 
 * Der Konstruktor schaltet, außer dem ersten sichtbaren Banner, aller Banner 
 * auf unsichtbar und beginnt dann mit der Rotation.
 * 
 * @param cssClass string 
 * @param standZeit int in Sekunden
 * @param fadeDauer int in Sekunden
 * @author Cordt Aukamp
 */
function bannerFader(cssClass, standZeit, fadeDauer)
{
    
    this.repo = $$('.' + cssClass);
    this.standZeit = standZeit;
    this.fadeDauer = fadeDauer;
    this.executor = null;
    this.executorIsRunning = false;
    this.fadeNext = -1;

    this.getActive = function(){
        return this.repo.indexOf(
                    this.repo.detect(function(item){
                            return item.visible();
        }));
    };

    this.clearVisible = function() {
        this.repo.each(function(item){
            if (item != this.repo[this.active] && item.visible()) {
                item.fade({duration:.01,from:1.0,to:0.0});
                item.style.zIndex = 1;
            }
        }, this);
    };
    
    this.fade = function(){
        this.lastActive = this.active;
        
        if( this.fadeNext == -1 ) {
            var next = this.active + 1;
            if (next >= this.repo.size()){
                next = 0;
            }
        } else {
            var next = this.fadeNext;
            this.fadeNext = -1;
        }
        
        this.repo[this.active].style.zIndex = 1;
        this.repo[next].style.zIndex = 2;
        this.repo[next].appear({
            queue: {position:'front',scope:'bannerFader'},
            duration:this.fadeDauer,
            from:0.0,
            to:1.0,
            afterFinish:(function(){
                this.repo[this.lastActive].fade({
                    queue: {position:'front',scope:'bannerFader'},
                    duration:.01,
                    from:1.0,
                    to:0.0
                });
            }).bind(this)
        });
        
        this.active = next;
    };
    
    this.stopAndShow = function(index) {
        this.stop();
        if( this.active != index ) {
            this.fadeNext = index;
            this.fade();
        }
    };
    
    this.stop = function () {
        if( this.executorIsRunning ) {
            this.executor.stop();
            this.executorIsRunning = false;
        }
    };
    
    this.start = function() {
        if( !this.executorIsRunning ) {
            this.executor = new PeriodicalExecuter((function(){this.fade()}).bind(this), this.standZeit);
            this.executorIsRunning = true;
        }
    };
    
    this.active = this.getActive();
    this.repo[this.active].style.zIndex = 2;
    this.clearVisible();
    this.executor = new PeriodicalExecuter((function(){this.fade()}).bind(this), this.standZeit);
    this.executorIsRunning = true;
}