
var HandyDetail = {

	init: function() {

		this.options = Object.extend({
			initialWidth: 480,
			initialHeight: 300
		}, {});

		$each(document.links, function(el){
			if (el.rel && el.rel.test(/^detail_view$/i)){
				el.onclick = this.click.pass(el, this);
			}
		}, this);
		
		this.eventKeyDown = this.keyboardListener.bindAsEventListener(this);
		this.eventPosition = this.scrollEvent.bind(this);
		document['addEvent']('keydown', this.eventKeyDown);
		window['addEvent']('scroll', this.eventPosition);

	},


	click: function(link){

		var elements = $A(document.getElementsByTagName('object'));
		if (window.ie) elements.extend(document.getElementsByTagName('select'));
		elements.each(function(el){
			if ( ! el.className.test(/tarifwahl/i) )
				el.style.visibility = 'hidden';
		});

		this.overlay = new Element('div').setProperty('id', 'detailOverlay').injectInside(document.body);

        this.center = $('container_tarife').
					  //setProperty('id', 'detailCenter').
					  setStyle('z-index', '9999').
					  setStyles( {
						width: this.options.initialWidth+'px',
					  	height: this.options.initialHeight+'px',
						marginLeft: '-'+(this.options.initialWidth/2)+'px',
						display: 'block',
						opacity: 0
					  });

		var wh = (window.getHeight() == 0) ? window.getScrollHeight() : window.getHeight();
		var st = document.body.scrollTop  || document.documentElement.scrollTop;
		this.top = st + (wh / 15);
		this.center.setStyles({top: this.top+'px'});

		var ww = (window.getWidth() == 0) ? window.getScrollWidth()-22 : window.getWidth();
		var wh = (window.getHeight() == 0) ? window.getScrollHeight() : window.getHeight();
		var st = document.body.scrollTop  || document.documentElement.scrollTop;
		this.overlay.setStyles({top: st+'px', height: wh+'px', width:ww+'px', opacity: 0});

		this.fx = {
			overlay: this.overlay.effect('opacity', {duration: 200}),
			centerHeight: this.center.effect('opacity', {duration: 500, transition: Fx.Transitions.linear})
		};

		this.fx.overlay.start(0, .8);
		this.fx.centerHeight.start(0, 1);
		
		return false;

	},
	
	
	close: function() {
		this.overlay.remove();
		this.center.setStyle('display', 'none');
		var elements = $A(document.getElementsByTagName('object'));
		if (window.ie) elements.extend(document.getElementsByTagName('select'));
		elements.each(function(el){ el.style.visibility = ''; });
	},
	
	
	keyboardListener: function(event){
		switch (event.keyCode){
			case 27: case 88: case 67: this.close(); break;
		}
	},
	

	scrollEvent: function (event) {

		var ww = (window.getWidth() == 0) ? window.getScrollWidth()-22 : window.getWidth();
		var wh = (window.getHeight() == 0) ? window.getScrollHeight() : window.getHeight();
		var st = document.body.scrollTop  || document.documentElement.scrollTop;
		this.overlay.setStyles({top: st+'px', height: wh+'px', width:ww+'px'});

		var wh = (window.getHeight() == 0) ? window.getScrollHeight() : window.getHeight();
		var st = document.body.scrollTop  || document.documentElement.scrollTop;
		this.top = st + (wh / 15);
		this.center.setStyles({top: this.top+'px'});

	}



};




window.addEvent('domready', HandyDetail.init.bind(HandyDetail));
