var Interface = {};

Interface.Tabbox = Class.create({
	initialize: function(tab, box, options) {
		this.tab = $(tab);
		this.box = $(box);
		//this.active = 0;
		
		this.options = options || { };
		this.options.paramName = this.options.paramName || this.tab.name;
		this.options.slotName = this.options.slotName || 'tabslot';
		this.options.hover = this.options.hover || false;
		this.active = this.options.active || 0;
		
		this.tabitems = this.tab.getElementsByTagName('li');
		this.boxitems = this.box.getElementsByClassName(this.options.slotName);

		// hide inactive boxes
		for(var i=0;i<this.boxitems.length;i++){
			if(i!=this.active){
				this.tabitems[i].className = '';
				this.boxitems[i].style.display = 'none';
			}else{
				this.tabitems[i].className = 'active';
				this.boxitems[i].style.display = 'block';
			}
			
			Event.observe(this.tabitems[i], this.options.hover ? 'mouseover' : 'click', this.onClick.bindAsEventListener(this,i));
		}
	},
	
	hide: function(Box) {
		//Effect.BlindUp(this.boxitems[Box],{duration:0.5 });
		this.boxitems[Box].style.display = 'none';
	},
	
	show: function(Box) {
		//Effect.BlindDown(this.boxitems[Box],{duration:0.5 });
		this.boxitems[Box].style.display = 'block';
	},
	
	onClick: function(event) {
		this.tabitems[this.active].className = '';
		this.hide(this.active);
		
		var data = $A(arguments);
		this.active = data[1];
		if($('activetab')) {
			$('activetab').value=data[1];
			$('form_bewerbung').request({
				//onComplete: function(){ alert('Form data saved!') }
			})
		}
		var link = this.tabitems[this.active].getElementsByTagName('a')[0];
		link.blur();
		
		this.tabitems[this.active].className = 'active';
		this.show(this.active);
		MakeSifr();
		event.stop();
	}
});