function switchContainer(item)
{
    var cnt = 1;
    for(var i = 1; i < 4; i++)
    {
        var container = document.getElementById('item'+i)
        if(i == item)
        {
            container.style.top = 0;
        }
        else
        {
            container.style.top = (213*cnt)+'px';
            cnt++;
        }
    }
}
function impeller(trigger)
{
    var parentDiv = trigger.parentNode;
    var contentContainer = parentDiv.getElementsByTagName('div')[0];
    
    var contentDivs = contentContainer.getElementsByTagName('div');
    
    var hidden = 0;
    
    for(var i = 0; i< contentDivs.length; i++)
    {
        if(contentDivs[i].style.display == 'none')
        {
            hidden++;
        }
    }
    for(var i = 0; i< contentDivs.length; i++)
    {
        if(i < hidden +2)
        {
            contentDivs[i].style.display = 'none';
        }
        if (hidden == contentDivs.length-2)
        {
            contentDivs[i].style.display = '';
        }
    }
    
}

var Banderole = Class.create({
    
    options: new Hash({
        duration: 750
    }),
    
    initialize: function(container){
        this.activePart = 0;
        this.padding = 10;
        this.container = $(container)
        this.contentHolder = this.container.select('div.impeller_content')[0]
        this.setContentWidth();
        this.attach();
    },
    
    setContentWidth: function(){
        var width = this.contentHolder.select('div')[0].getWidth() * this.getContentDivsCount() + ( this.padding * (this.getContentDivsCount()/2) );
        this.contentHolder.setStyle({
            width: width    
        });
    },
    
    getContentWidth: function(){
        return (this.contentHolder.select('div')[0].getWidth() * this.getContentDivsCount());
    },
    
    getContentDivsCount: function()
    {
        return this.getContentDivs().length;
    },
    
    getContentDivs: function()
    {
        return this.contentHolder.select('div');
    },
    
    goTo: function(d)
    {
        var count = this.getContentDivsCount();
        
        if(d == '+')
        {
            var left = ( this.contentHolder.select('div')[0].getWidth() * 2 ) * (this.activePart + 1) - this.padding;

            if(left >= this.getContentWidth()-100)
            {
                left = this.padding;
                this.activePart = 0;
            }
            else
            {
                this.activePart++;
                left*=-1;
            }
   
        }
        else if(d == '-')
        {
            var part = this.activePart - 1 > 0 ? this.activePart - 1 : 0;
            var left = (this.contentHolder.select('div')[0].getWidth() * 2 ) * part -  this.padding;
    
            if(this.activePart == 0)
            {
                left = (this.contentHolder.select('div')[0].getWidth() * (count - 2)) - this.padding;
                left*=-1;
                this.activePart = Math.round(this.getContentDivsCount()/2) - 1;
            }
            else
            {
                this.activePart--;
                left*=-1;
            }
        }
        
        var pos = parseInt(this.contentHolder.getStyle('left'), 10);
        new Fx.Style(this.contentHolder,'left',{duration: this.options.get('duration')}).start(pos, left);
    },
    
    attach: function()
    {
        var nextBtn = this.container.select('a.right')[0];
        nextBtn.observe('click', function(e){
            Event.stop(e);
            this.goTo('+');
        }.bind(this));
        
        var prevBtn = this.container.select('a.left')[0];
        prevBtn.observe('click', function(e){
            Event.stop(e);
            this.goTo('-');
        }.bind(this));
    }
});

var Fadingtabs = Class.create({

	//interval ist die Zeit in Sekunden bis zum nächsten reiterwechsel
    options: new Hash({
        duration: 750,
        interval: 6,
        inprogress: false
    }),
    
    initialize: function(containerId)
    {
        this.options.set('container', $(containerId));
        
        this.activeTab = 0;
        this.tabCount = this.getContentDivs().length;
        
        this.hideContentDivs();
        this.attach();
    },
    
    hideContentDivs: function()
    {
        var divs = this.getContentDivs();
        divs.each(function(div,i){
            if(i != this.activeTab)
            {
                div.setStyle({
                    opacity: 0,
                    zIndex: 0
                });
            }
        }, this);
    },
    
    getContentDivs: function()
    {
        return this.options.get('container').select('div.item');
    },
    
    hightlightTab: function(no)
    {
        var tabs = this.options.get('container').select('div.tabs li');
        
        tabs.each(function(a){
            a.removeClassName('current');
        });
        
        tabs[no].addClassName('current');
        
    },
    
    showNext: function()
    {
        var tab = this.activeTab + 1 < this.tabCount ? this.activeTab + 1 : 0;
        this.showTab(tab);
    },
    
    showTab: function(no)
    {
        if(!this.options.get('inprogress') && no != this.activeTab)
        {
            this.options.set('inprogress', true);
            
            this.hightlightTab(no);
            
            var divs = this.getContentDivs();
            
            divs[this.activeTab].setStyle({
                zIndex: 0   
            });
            
            divs[no].setStyle({
                zIndex: 1
            });
            new Fx.Opacity(divs[no], {duration: this.options.get('duration')}).start(0, 1);
            
            window.setTimeout(function() {
                divs[this.activeTab].setStyle({
                    opacity: 0
                });
                this.activeTab = no;
                this.options.set('inprogress', false);
            }.bind(this), this.options.get('duration'));
        }
    },
    
    slide: function()
    {
        this.pe = new PeriodicalExecuter(function(){
            this.showNext()
        }.bind(this), this.options.get('interval'));
    },
    
    attach: function()
    {
        var tabs = this.options.get('container').select('div.tabs li a');
        
        tabs.each(function(a,i){
            a.observe('click', function(e){
                Event.stop(e);
                this.pe.stop(); // stoppt interval
                this.showTab(i);
                this.slide();
            }.bind(this));
        }, this);

        this.slide();
    }
    
});

Event.observe(window, 'load', function(){
    if($('tabs'))
    {
        new Fadingtabs('tabs');
    }
    if($('banderole'))
    {
        new Banderole('banderole');
    }
});