myReferenzen4ward = null;
window.addEvent('domready', function() {
	
	/**
	 * rightSubrow NEWS
	 */
	new Asset.image('tl_files/layout/media/overlay.png');
	new Asset.image('tl_files/layout/cms/overlay.png');
	$$('div.rightNewsItem').each(function(el){
		el.addEvent('mouseover',function(){
			el.getElement('div.rightNewsOverlay').setStyle('display','block');
			el.getElement('div.rightNewsOverlay').fade('in');
		});
		el.addEvent('mouseout',function(){
			el.getElement('div.rightNewsOverlay').fade('out');
		});
	});

	/**
	 * Sidebox-Referenzen sould open a Lightbox 
	 */
	if(myReferenzen4ward==null) myReferenzen4ward = new referenzen4ward();
	myReferenzen4ward.initLightbox($$('div.referenzenSidebar a'));
	
	
	/**
	 * Navigation fading
	 */
	$each($$("#mainNav a"), function(el) {
        if(el.hasClass('active')) return;
		var original = el.getStyle('color');
		var morph = new Fx.Morph(el,{ 'duration':'500', link:'cancel' });
		el.addEvents({
			'mouseenter' : function() { morph.start({ 'color':'#FFFFFF' ,'background-color':'#7E1518'}) },
			'mouseleave' : function() { morph.start({ 'color': '#5F6877','background-color':'#FFFFFF' }) }
		});
	});

	/**
	 * Clear default for input-fields
	 */
	$$(".cleardefault input","input.cleardefault").each(function(el){
		if(el.hasClass('submit')) return // not for submits
		if(el.hasClass('reset')) return // not for resetes
		el.store('defaultValue',el.get('value'));
		el.addEvents({
			'focus':function(e){
				if(e.target.get('value') == e.target.retrieve('defaultValue')) e.target.set('value','');
			},
			'blur':function(e){
				if(e.target.get('value') == '') el.set('value',e.target.retrieve('defaultValue'));
			}
		});
	});
	
	/**
	 * Open links with class=openInLightbox
	 */
	$$("a.openInLightbox").each(function(el){
		el.addEvent('click',function(e){
			e.stop();
			Mediabox.open([[el.get('href'),'','88% 85%']],0,Mediabox.customOptions);
		});
	});
	
	/**
	 * Anchor smooth scrolling
	 */
	new anchorScroller();
	
});

var anchorScroller = new Class({
	Extends: Fx.Scroll,
	
	options: {
		duration: 1600,
		transition: 'expo:in:out'
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.parent(window,this.options);
		
		$$('a[href*="#"]').addEvent('click',function(e){
				e.stop();
				this.clickHandler(e.target);
		}.bindWithEvent(this));
	},
	
	clickHandler: function(el){
		if(!el.href) return;
		var id = el.href.substr(el.href.indexOf('#')+1);
		this.toElement(id);
	}
	
	
});

var merkliste4ward = new Class({
	Implements: [Options],
	
	options: {
		typeSelector: 'click:relay(li)',
		container: 'Merkliste'
	},
	
	initialize: function(options){
		this.setOptions(options);
		this.container = document.id(this.options.container);
		this.list = this.container.getElement('ul');
		this.clickHandlerBound = this.clickHandler.bind(this);
		this.attach();
		
		
		this.msgBox = new Element('div',{
			'id': 'merkliste4wardMsgBox'
		}).inject($$('body')[0]);
		new Asset.images(['tl_files/layout/media/geloeschtBG.png','tl_files/layout/media/gemerktBG.png']);
		
		this.mouseY = this.mouseX = 0;
		document.addEvent('mousedown',function(e){
			this.mouseY = e.page.y;
			this.mouseX = e.page.x;
		}.bindWithEvent(this));

		this.removeButton = '<img src="tl_files/layout/media/filter_x.png" alt="Referenz entfernen" title="Referenz entfernen"/>';
		this.restoreState();
	},
	
	showMsgBox: function(headline,msg) {
		this.msgBox.set('html','<h1>'+headline+'</h1>'+msg);
		x = this.mouseX; y = this.mouseY;
		this.msgBox.position({'x':x-170,'y':y-170});
		this.msgBox.set('tween',{
			property: 'opacity',
			duration: 'normal',
			transition: Fx.Transitions.Quad.easeInOut,
			link: 'chain'
		}).get('tween').start(0,1).wait(3000).start(1,0);
	},
	
	addEntry: function(refId,name,ev){
		this._addEntry(refId,name);
		this.msgBox.setStyle('background-image','url(tl_files/layout/media/gemerktBG.png)');
		this.showMsgBox('Gemerkt ...','<b>Die Website von</b><div class="red">'+name+'</div>wurde auf Ihre Merkliste<br /><b>geschrieben!</b>');
	},

	removeEntry: function(elem){
		this.msgBox.setStyle('background-image','url(tl_files/layout/media/geloeschtBG.png)');
		this.showMsgBox('Gelöscht ...','<b>Die Website von</b><div class="red">'+elem.get('text')+'</div>wurde von Ihre Merkliste<br /><b>gelöscht!</b>');
		this._removeEntry(elem);
	},

	_addEntry: function(refId,name){
		// Dont add entry twice
		if($defined(this.list.getElement('li[value='+refId+']'))) return;
		
		var newElem = new Element('li',{
			'html': this.removeButton+name,
			'value': refId
		}).inject(this.list);
		
		this.saveState();
	},
	
	_removeEntry: function(elem){
		elem.destroy();
		this.saveState();
	},

	saveState: function(){
		var x = new Array();
		var x = this.list.getElements('li').map(function(elem){
			return [elem.get('value'),elem.get('text')];
		});
		Cookie.write('merkliste4ward',JSON.encode(x),{path:'/'});
	},
	
	restoreState: function(){
		if(!$defined(Cookie.read('merkliste4ward')) || Cookie.read('merkliste4ward')=="") return;
		JSON.decode(Cookie.read('merkliste4ward')).each(function(item){
			this._addEntry(item[0],item[1]);
		}.bind(this));
	},
	
	clearEntries: function(){
		this.list.empty();
		this.showMsgBox('Geleert ...','<b>Alle Referenzen wurden<br />entfernt.</b>');
		this.saveState();
	},
	
	attach: function(){
		this.list.addEvent(this.options.typeSelector, this.clickHandlerBound);
		return this;
	},
	
	detach: function(){
		this.list.removeEvent(this.options.typeSelector, this.clickHandlerBound);
	},
	
	clickHandler: function(event, element){
		if($(event.target).get('tag') == 'img') {
			this.removeEntry(element);

		} else {
			return; // nothing todo on li-click
		}
	} 
	
});




var referenzen4ward = new Class({
	Implements: [Options],
	
	options: {
		ajaxUrl: 'referenzenAjax.php'
	},
	timer: 0,
	
	
	initialize: function(options){
		this.setOptions(options);
		
		this.options.detailContainer = new Element('div',{
			'id': 'mb_referenzDetailContainer',
			'styles': {
				'display':'none'
			}
		});
		this.options.detailContainer.inject($('main'));
		
		this.options.People4ward = new Element('div',{
			'id': 'People4ward',
			'styles': {
				'position':'absolute',
				'bottom':'-80px',
				'height':'40px',
				'background':'url(tl_files/layout/media/4wardPeople.png) no-repeat center center'
			}
		});
		
	},

	setupReferenzenPage: function(contentDiv,branchen,techniken){
		this.options.contentDiv = contentDiv;
		this.options.branchen = branchen;
		this.options.techniken = techniken;		
		this.options.fx = new Fx.Tween(this.options.contentDiv,{duration:800,transition: Fx.Transitions.Quint.easeInOut});
		this.options.branchen.getElements('a').addEvent('click',function(el){
			el.stop();
			this.clickBranche(el.target);
		}.bindWithEvent(this));
		
		this.options.techniken.getElements('a').addEvent('click',function(el){
			el.stop();
			this.clickTechnik(el.target);
		}.bindWithEvent(this));
		this.initLightbox(this.options.contentDiv.getElements('div.referenzDetail a').extend(this.options.contentDiv.getElements('div.referenzImg a')).extend(this.options.contentDiv.getElements('#moreRefBody a')));
		this.ReferezenPageOvereffect();
	},
	ReferezenPageOvereffect: function(){
		// The over-effect for the image-bubbles
		this.options.contentDiv.getElements('div.referenzImg img').each(function(elem){
			elem.addEvent('mouseover',function(e){
				$(e.target).set('src','tl_files/layout/media/referenzenOverlay_on.png');
			});
			elem.addEvent('mouseout',function(e){
				$(e.target).set('src','tl_files/layout/media/referenzenOverlay_off.png');
			});
		});
	},	

	
	initLightbox: function(elements){
		elements.addEvent('click',function(e){
			e.stop();
			el = ($(e.target).get('tag')=='a') ? e.target : e.target.getParent('a');
			if(erg = el.get('href').match(/.*id=(\d+).*/)) {
				caption = el.get('href').match(/.*date=([0-9\.]+).*/);
				if(caption)
					this.openLightbox(erg[1],caption[1]);
				else
					this.openLightbox(erg[1],false);
			}
		}.bindWithEvent(this));
	},
	
	openLightbox: function(refId,caption){
		// Run AJAX request
		var ajax = new Request.HTML({
			url: this.options.ajaxUrl,
			onSuccess: function(txt,xml){
				this.options.detailContainer.empty();
				this.options.detailContainer.adopt(txt);
				this.options.People4ward.setStyle('width','700px');
				this.options.People4ward.inject(this.options.detailContainer);
				Mediabox.open([['#mb_referenzDetailContainer',(caption ? 'Website online seit '+caption : ''),'664 440']],0,Mediabox.customOptions);
			}.bind(this)
		}).get('detail=true&id='+refId);		
	},
	
	clickBranche: function(elem){
		if(elem.hasClass('active')) {
			this.options.branchen.getElements('a').removeClass('active');
		} else {
			this.options.branchen.getElements('a').removeClass('active');
			elem.addClass('active');
		}
		this.loadFilter();
	},
	
	clickTechnik: function(elem){
		elem.hasClass('active') ? elem.removeClass('active') : elem.addClass('active');
		this.loadFilter();
	},


	loadFilter: function(){
		// Find Branche
		branchenElem = this.options.branchen.getElement('a.active');
		if($defined(branchenElem)) {
			erg = branchenElem.get('href').match(/.*branche=(\d+).*/);
			branche = erg[1];
		} else {
			branche = '';
		}
		
		// Find Techniken
		var technikenIds = '';
		this.options.techniken.getElements('a.active').each(function(item){
			var erg = item.get('href').match(/.*techniken=(\d+).*/);
			technikenIds += erg[1]+',';
		},this);
		technikenIds = technikenIds.substr(0,technikenIds.length-1);
		
		this.sendRequest('branche='+branche+'&techniken='+technikenIds);
	},
		
	sendRequest: function(getParam){
		// Run AJAX request
		var ajax = new Request.HTML({
			evalScripts: true,
			url: this.options.ajaxUrl,
			onRequest: function(){
				this.options.fx.start('opacity',0);
				this.timer = $time();
			}.bind(this),
			onSuccess: function(txt,xml){
				if($time() - this.timer < 700) {
					(function(){
						this.updateDiv(txt);
						this.options.fx.start('opacity',[0,1]);
					}.bind(this)).delay(900 - ($time()-this.timer));
						
				} else {
					this.updateDiv(txt);
					this.options.fx.start('opacity',[0,1]);
				}
			}.bind(this)
		}).get(getParam);
	},


	updateDiv: function(txt){
		this.options.contentDiv.empty();
		this.options.contentDiv.adopt(txt);
		if ($defined($('moreRefHead'))) {
			new boxToggler($('moreRefHead'), $('moreRefBody'), {
				showOnStart: false
			});
		}
		this.initLightbox(this.options.contentDiv.getElements('div.referenzDetail a').extend(this.options.contentDiv.getElements('div.referenzImg a')).extend(this.options.contentDiv.getElements('#moreRefBody a')));
		this.ReferezenPageOvereffect();
	}

		
});



/**
 * Box Toggler
 */
var boxToggler = new Class ({
	Extends: Fx.Elements,
	Implements: [Options],
	options: {
		showOnStart: true,		
		toggler: $empty,
		body: $empty,
		duration: 700
	},
	
	initialize: function(toggler,body,options){
		// The FX
		this.setOptions(options);
		
		this.options.toggler = toggler;
		this.options.body = body;
		this.options.fx = new Fx.Morph(this.options.body, {
			duration: this.options.duration, 
			transition: Fx.Transitions.Quint.easeInOut,
			link: 'ignore'
		})
		
		
		this.options.toggler.setStyle('cursor','pointer');
		this.options.toggler.addEvent('click',function(el){
			el.stop();
			this.toggle();
		}.bindWithEvent(this));

		if(this.options.showOnStart){
			this.options.toggler.addClass('expanded');
			this.options.body.addClass('expanded');
		} else {
			this.options.body.setStyle('height',0);
		}
		
		this.options.body.setStyles({
			overflow:'hidden'
		});
		
	},
	
	toggle: function() {
		if(this.options.toggler.hasClass('expanded')) {
			this.collapse();
		} else {
			this.expand();
		}
	},
	
	expand: function(){
		this.options.toggler.addClass('expanded');
		this.options.body.addClass('expanded');
		this.options.body.addClass('expanded');
		
		this.options.fx.start({
		    'height': this.options.body.scrollHeight
		});
	},
	
	collapse: function(){
		this.options.toggler.removeClass('expanded');
		this.options.body.removeClass('expanded');
		
		this.options.fx.start({
			'height': '0'
		});		
	}
});




/** Some Mootools-More Addons **/


(function(addEvent, removeEvent){
	
	var match = /(.*?):relay\(([^)]+)\)$/,
		combinators = /[+>~\s]/,
		splitType = function(type){
			var bits = type.match(match);
			return !bits ? {event: type} : {
				event: bits[1],
				selector: bits[2]
			};
		},
		check = function(e, selector){
			var t = e.target;
			if (combinators.test(selector = selector.trim())){
				var els = this.getElements(selector);
				for (var i = els.length; i--; ){
					var el = els[i];
					if (t == el || el.hasChild(t)) return el;
				}
			} else {
				for ( ; t && t != this; t = t.parentNode){
					if (Element.match(t, selector)) return document.id(t);
				}
			}
			return null;
		};

	Element.implement({

		addEvent: function(type, fn){
			var splitted = splitType(type);
			if (splitted.selector){
				var monitors = this.retrieve('$moo:delegateMonitors', {});
				if (!monitors[type]){
					var monitor = function(e){
						var el = check.call(this, e, splitted.selector);
						if (el) this.fireEvent(type, [e, el], 0, el);
					}.bind(this);
					monitors[type] = monitor;
					addEvent.call(this, splitted.event, monitor);
				}
			}
			return addEvent.apply(this, arguments);
		},

		removeEvent: function(type, fn){
			var splitted = splitType(type);
			if (splitted.selector){
				var events = this.retrieve('events');
				if (!events || !events[type] || (fn && !events[type].keys.contains(fn))) return this;

				if (fn) removeEvent.apply(this, [type, fn]);
				else removeEvent.apply(this, type);

				events = this.retrieve('events');
				if (events && events[type] && events[type].keys.length == 0){
					var monitors = this.retrieve('$moo:delegateMonitors', {});
					removeEvent.apply(this, [splitted.event, monitors[type]]);
					delete monitors[type];
				}
				return this;
			}
			return removeEvent.apply(this, arguments);
		},

		fireEvent: function(type, args, delay, bind){
			var events = this.retrieve('events');
			if (!events || !events[type]) return this;
			events[type].keys.each(function(fn){
				fn.create({bind: bind || this, delay: delay, arguments: args})();
			}, this);
			return this;
		}

	});

})(Element.prototype.addEvent, Element.prototype.removeEvent);

/*
---

script: Element.Position.js

description: Extends the Element native object to include methods useful positioning elements relative to others.

license: MIT-style license

authors:
- Aaron Newton

requires:
- core:1.2.4/Element.Dimensions
- /Element.Measure

provides: [Elements.Position]

...
*/

(function(){

var original = Element.prototype.position;

Element.implement({

	position: function(options){
		//call original position if the options are x/y values
		if (options && ($defined(options.x) || $defined(options.y))) return original ? original.apply(this, arguments) : this;
		$each(options||{}, function(v, k){ if (!$defined(v)) delete options[k]; });
		options = $merge({
			// minimum: { x: 0, y: 0 },
			// maximum: { x: 0, y: 0},
			relativeTo: document.body,
			position: {
				x: 'center', //left, center, right
				y: 'center' //top, center, bottom
			},
			edge: false,
			offset: {x: 0, y: 0},
			returnPos: false,
			relFixedPosition: false,
			ignoreMargins: false,
			ignoreScroll: false,
			allowNegative: false
		}, options);
		//compute the offset of the parent positioned element if this element is in one
		var parentOffset = {x: 0, y: 0}, 
				parentPositioned = false;
		/* dollar around getOffsetParent should not be necessary, but as it does not return
		 * a mootools extended element in IE, an error occurs on the call to expose. See:
		 * http://mootools.lighthouseapp.com/projects/2706/tickets/333-element-getoffsetparent-inconsistency-between-ie-and-other-browsers */
		var offsetParent = this.measure(function(){
			return document.id(this.getOffsetParent());
		});
		if (offsetParent && offsetParent != this.getDocument().body){
			parentOffset = offsetParent.measure(function(){
				return this.getPosition();
			});
			parentPositioned = offsetParent != document.id(options.relativeTo);
			options.offset.x = options.offset.x - parentOffset.x;
			options.offset.y = options.offset.y - parentOffset.y;
		}
		//upperRight, bottomRight, centerRight, upperLeft, bottomLeft, centerLeft
		//topRight, topLeft, centerTop, centerBottom, center
		var fixValue = function(option){
			if ($type(option) != 'string') return option;
			option = option.toLowerCase();
			var val = {};
			if (option.test('left')) val.x = 'left';
			else if (option.test('right')) val.x = 'right';
			else val.x = 'center';
			if (option.test('upper') || option.test('top')) val.y = 'top';
			else if (option.test('bottom')) val.y = 'bottom';
			else val.y = 'center';
			return val;
		};
		options.edge = fixValue(options.edge);
		options.position = fixValue(options.position);
		if (!options.edge){
			if (options.position.x == 'center' && options.position.y == 'center') options.edge = {x:'center', y:'center'};
			else options.edge = {x:'left', y:'top'};
		}

		this.setStyle('position', 'absolute');
		var rel = document.id(options.relativeTo) || document.body,
				calc = rel == document.body ? window.getScroll() : rel.getPosition(),
				top = calc.y, left = calc.x;

		var dim = this.getDimensions({computeSize: true, styles:['padding', 'border','margin']});
		var pos = {},
				prefY = options.offset.y,
				prefX = options.offset.x,
				winSize = window.getSize();
		switch(options.position.x){
			case 'left':
				pos.x = left + prefX;
				break;
			case 'right':
				pos.x = left + prefX + rel.offsetWidth;
				break;
			default: //center
				pos.x = left + ((rel == document.body ? winSize.x : rel.offsetWidth)/2) + prefX;
				break;
		}
		switch(options.position.y){
			case 'top':
				pos.y = top + prefY;
				break;
			case 'bottom':
				pos.y = top + prefY + rel.offsetHeight;
				break;
			default: //center
				pos.y = top + ((rel == document.body ? winSize.y : rel.offsetHeight)/2) + prefY;
				break;
		}
		if (options.edge){
			var edgeOffset = {};

			switch(options.edge.x){
				case 'left':
					edgeOffset.x = 0;
					break;
				case 'right':
					edgeOffset.x = -dim.x-dim.computedRight-dim.computedLeft;
					break;
				default: //center
					edgeOffset.x = -(dim.totalWidth/2);
					break;
			}
			switch(options.edge.y){
				case 'top':
					edgeOffset.y = 0;
					break;
				case 'bottom':
					edgeOffset.y = -dim.y-dim.computedTop-dim.computedBottom;
					break;
				default: //center
					edgeOffset.y = -(dim.totalHeight/2);
					break;
			}
			pos.x += edgeOffset.x;
			pos.y += edgeOffset.y;
		}
		pos = {
			left: ((pos.x >= 0 || parentPositioned || options.allowNegative) ? pos.x : 0).toInt(),
			top: ((pos.y >= 0 || parentPositioned || options.allowNegative) ? pos.y : 0).toInt()
		};
		var xy = {left: 'x', top: 'y'};
		['minimum', 'maximum'].each(function(minmax) {
			['left', 'top'].each(function(lr) {
				var val = options[minmax] ? options[minmax][xy[lr]] : null;
				if (val != null && pos[lr] < val) pos[lr] = val;
			});
		});
		if (rel.getStyle('position') == 'fixed' || options.relFixedPosition){
			var winScroll = window.getScroll();
			pos.top+= winScroll.y;
			pos.left+= winScroll.x;
		}
		if (options.ignoreScroll) {
			var relScroll = rel.getScroll();
			pos.top-= relScroll.y;
			pos.left-= relScroll.x;
		}
		if (options.ignoreMargins) {
			pos.left += (
				options.edge.x == 'right' ? dim['margin-right'] : 
				options.edge.x == 'center' ? -dim['margin-left'] + ((dim['margin-right'] + dim['margin-left'])/2) : 
					- dim['margin-left']
			);
			pos.top += (
				options.edge.y == 'bottom' ? dim['margin-bottom'] : 
				options.edge.y == 'center' ? -dim['margin-top'] + ((dim['margin-bottom'] + dim['margin-top'])/2) : 
					- dim['margin-top']
			);
		}
		pos.left = Math.ceil(pos.left);
		pos.top = Math.ceil(pos.top);
		if (options.returnPos) return pos;
		else this.setStyles(pos);
		return this;
	}

});
})();