var SelectorBox = Class.create();

SelectorBox.prototype = {
	initialize: function() {		
		this.searchSelectorBoxs();		
	},
	
	searchSelectorBoxs: function() {   
        this.searchSelectorBoxs = Prototype.emptyFunction;

        document.observe('click', (function(event){
            var target = event.findElement('a[rel^=selector]');
            if (target) {
                event.stop();
                this.addEvents(target);   
            }
        }).bind(this));
    },
    
    addEvents: function(target){
    	this.headerSelector = document.getElementById('header-'+target.id);
		if (!this.headerSelector) return;
		document.body.appendChild(this.headerSelector);
		this.selectorLink = document.getElementById(target.id);
				
		this.showSelector(this.selectorLink);
		
		Event.observe(this.selectorLink, 'mouseout', this.delayedHideSelector.bindAsEventListener(this));
		
		//Event.observe(this.selectorLink, 'click', this.hideSelector.bindAsEventListener(this));
		Event.observe(this.headerSelector, 'click', this.hideSelector.bindAsEventListener(this));
		
		Event.observe(this.headerSelector, 'mouseout', this.delayedHideSelector.bindAsEventListener(this));
		Event.observe(this.headerSelector, 'mouseover', this.clearHideSelector.bindAsEventListener(this));
    	
    },

	showSelector: function(selectorLink) {
		//Event.stop(e);
		//var selectorLink = Event.element(e);		
		selectorLink.blur();
		this.clearHideSelector();
		if (this.visible) {
			this.hideSelector();
		}
		else {
			var leftBorder = selectorLink.cumulativeOffset()[0] + selectorLink.offsetWidth;
			var topBorder = selectorLink.cumulativeOffset()[1] + selectorLink.offsetHeight +1;
			
			var queryString = selectorLink.rel.replace(/^[^,]+,?/, '');	
			
			if(queryString=='wide'){
				this.headerSelector.style.left = (leftBorder - 289) + 'px';
			}else{
				this.headerSelector.style.left = (leftBorder - 169) + 'px';
			}
			this.headerSelector.style.top = (topBorder-1) + 'px';
			try {
				Effect.Appear(this.headerSelector, {duration:0.3});
			} catch(e) {
				Element.show(this.headerSelector);
			}
			this.visible = true;
		}
	},

	hideSelector: function(){
		if (this.visible) {
			try {
				Effect.Fade(this.headerSelector, {duration:0.3});
			} catch(e) {
				Element.hide(this.headerSelector);
			}
			this.visible = false;
		}
	},

	delayedHideSelector: function(e) {
		if (this.visible){
			this.clearHideSelector();
			this.delayID = setTimeout(this.hideSelector.bind(this), 250);
		}
	},

	clearHideSelector: function(){
		if (this.delayID) {
			clearTimeout(this.delayID);
			this.delayID = null;
		}
	}
};

document.observe('dom:loaded', function () { new SelectorBox(); });



/****************\
* Formularfelder leeren
\*'**************/
function clearValue(feld) {
	document.getElementById(feld).value = "";
	return true;
}


/****************\
* Hover - der Listenspalten
\*'**************/
function hover(element){
	$(element).addClassName('hover');
	/*var siblings = $(element).siblings();
	for (var i = 1; i < siblings.length ; i++){
		siblings[i].addClassName('hover');
	}*/
}

function hoverOut(element){
	$(element).removeClassName('hover');
	/*var siblings = $(element).siblings();
	for (var i = 1; i < siblings.length ; i++){
		siblings[i].removeClassName('hover');
	}*/
}


function adjustHeight(elements){
	for (var i = 1; i < elements.length ; i++){
		alert(siblings[i].getHeight());
	}
}


/*Zusatzinfos Detailansicht zeigen/verbergen*/
function show_hide(element)
{
	if(document.getElementById(element).style.display == 'none') {
		$(element).show();
		$('plus').src = '/images/minus.png';
	}else{
		$(element).hide();
		$('plus').src = '/images/plus.png';
	}

}