var LogoLeiste = new Class({
	initialize: function(){
		this.lis = $('logoList').getElements('li');
		this.lis.each(function(li){
			li.addEvent('mouseenter', this.mouseenter.bindWithEvent(this, li));
			li.addEvent('mouseleave', this.mouseleave.bindWithEvent(this));
			li.store('width', li.getSize().x)
		}, this);
	},
	mouseenter: function(e, activeLi){
		this.lis.each(function(li){
			var isActive = li === activeLi
			this.checkFx(li).start('width', li.retrieve('width')+ (isActive? 100 : -20))
			.chain (function(){
				this.changeBackground(li, isActive)
			}.bind(this));
		}, this)
	},
	mouseleave: function(){
		this.lis.each(function(li){
			this.changeBackground(li, false);
			this.checkFx(li).start('width', li.retrieve('width'));
		}, this)
	},
	checkFx: function(li){
		var fx = li.retrieve('fx');
		if(!fx){
			fx = new Fx.Tween(li, {link: 'cancel'})
			li.store('fx', fx); 
		}
		return fx;
	},
	changeBackground: function(li, isActive){
		li[(isActive ? 'add' : 'remove') + 'Class']('hover')
		
	}
})

var Menue = new Class({
	initialize: function(){
		var nav = $('nav'),
		lis = $A(nav.getChildren())
		lastLi = lis.pop();	
		lis.each(function(li){
			var ul = li.getElement('ul') || false;
			if(ul){
				ul.setStyle('opacity', 0)
			}
			li.addEvents({
				'mouseleave': this.blendOut.pass([ul,li], this),
				'mouseenter': this.blendIn.pass([ul,li], this)
			})
			if(li.hasClass('active') && ul){
				this.lastLi = li;
				this.lastUl = ul;
				this.blendIn(ul,li);
				nav.addEvent('mouseleave', this.back.bind(this, [ul, li]));
				lastLi.addEvent('mouseenter', this.back.bind(this, [ul, li]));
			}
		}, this);
		
		nav.removeClass('jsFree');
	},
	back: function(ul, li){
		var f = function(){
			this.blendIn(ul, li);
		}.bind(this)
		this.timer3 = f.delay(810)
		
	},
	blendOut: function(ul,li){
		if (ul) {
			this.timer = function(){ul.setStyle('opacity', 0)}.delay(800);
		}
		if(li){
			this.timer2 = function(){li.removeClass('jsHover')}.delay(800);
		}
	},
	blendIn: function(ul,li){
		if(this.timer){
			$clear(this.timer);
		}
        if(this.timer2){
            $clear(this.timer2);
        }
        if(this.timer3){
            $clear(this.timer3);
        }
		if(this.lastUl && this.lastUl != ul){
			this.lastUl.setStyle('opacity', 0);
		}
		if(this.lastLi && this.lastLi != li){
			this.lastLi.removeClass('jsHover')
		}
		if(ul){
			ul.setStyle('opacity', 1);
		}
		if(li){
			li.addClass('jsHover');
		}
		
		this.lastUl = ul;
		this.lastLi = li;
	}
})

var Tabs = new Class({
	initialize: function(){
		$$('.jsTabBox').each(function(tab){
			tab.getElements('a.jsTabButton').each(function(link){
				var tabBox =  $(link.get('href').split('#')[1].replace('#', ''));

				link.addEvent('click', this.toggleTab.bindWithEvent(this, [link.getParent(), tabBox, tab]));
				if(link.getParent().hasClass('active')){
					tabBox.style.display =  '';
					tab.store('activeTab', link.getParent())
					.store('activeTabBox', tabBox)
				}else{
					tabBox.style.display = 'none'
				}
			}, this)
		}, this)
	},
	toggleTab: function(event, activeTab, activeTabBox, box){
		event.stop();
//		if(!this.firstClick && activeTabBox.id === 'topic-1'){
//			this.firstClick = true;
//			activeTabBox.getElement('h3 span').setStyle('margin-left', 0);
//		}
		box.retrieve('activeTab').removeClass ('active');
		box.retrieve('activeTabBox').style.display = 'none';
		box.retrieve('activeTabBox').className = 'jsHide';
		activeTabBox.className = 'jsHide';
		box.store('activeTab', activeTab.addClass('active'))
		.store('activeTabBox', activeTabBox.setStyle('display', ''));
		
	}
})


var Vorbelegung = new Class({
	initialize: function(value, select){
		select.addEvents({
			'blur': this.blur.pass([value, select], this),
			'focus': this.focus.pass([value, select], this)
		});
	},
	blur: function(value, select) {
		if(select.value === '') {
			select.value = value;
		}
	},
	focus: function(value, select){
		if(select.value === value) {
			select.value = '';
		}
	}
})