// JavaScript Document

/*	*****************************************************************************************
	msGalerieBild
	*****************************************************************************************
*/
var msGalerieBild = new Class ({
	
	bild_url: '',
	bild_url_gross: '',
	bild_url_loading: '',

    /*	*************************************
		Konstruktor
	*/
    initialize: function(bild_url) {
    	this.bild_url = bild_url;
    	this.bild_url_gross = bild_url.replace ('.jpg', '-gross.jpg');
    }

});

/*	*****************************************************************************************
	msGalerie
	*****************************************************************************************
*/
var msGalerie = new Class({

	div_body: null,
	div_all: null,
	galerie: null,
	bilder: false,
	texte: false,

	galerieoverlay: null,
	galeriebild_div: Array,
	galeriebild: Array,
	galeriebild_load: null,
	akt_bild_id: 0,
	prev_bild_id: 1,
	link_vor: null,
	link_zurueck: null,

	fade_duration: 400,	/*	in Millisekunden	*/
	
	akt_bild_nr: 0,

    /*	*************************************
		Konstruktor
	*/
    initialize: function(galerie, galerieoverlay) {

		this.div_body = $('body');
		this.div_all = $('all');
		this.galerie = $(galerie);
		this.galerieoverlay = $(galerieoverlay);
		this.bild_url_loading = '/images/ajax-loader.gif';

		this.bilder = new Array ();
		this.texte = new Array ();
		
		this.galeriebild = new Array (2);

		/*	Unter-Elemente der Galerie ermitteln	*/
		var children = this.galerie.getChildren('div');
		children.each (function (child)
		{
			if (child.hasClass('galeriebild'))
			{
				var el_img = $(child.getElement('img'));
				gb = new msGalerieBild (el_img.src);
				this.bilder[this.bilder.length] = gb;
				this.texte[this.texte.length] = $(child.getElement('span')).clone ();
				child.addEvent('click', this.open.bind(this, this.bilder.length-1));
			}
		}.bind(this));

		/*	Unter-Elemente des Galerieoverlays ermitteln	*/
		var children = this.galerieoverlay.getChildren('div');
		children.each (function (child)
		{
			if (child.hasClass('bild'))
			{
				if (child.hasClass('id0'))		this.galeriebild_div[0] = $(child);
				if (child.hasClass('id1'))		this.galeriebild_div[1] = $(child);
			}

			if (child.hasClass('rechtsoben'))
			{
				this.link_vor = $(child).getElement ('a.vor');
				this.link_zurueck = $(child).getElement ('a.back');
			}

		}.bind(this));

		this.galeriebild_load = new Asset.image('/images/ajax-loader.gif');

		this.link_zurueck.addEvent('click', this.prev.bind(this));
		this.link_vor.addEvent('click', this.next.bind(this));

	},

	/*	Öffnet die Galerie mit einem Bild
	*/
	open: function (bild_nr) {
		this.akt_bild_nr = bild_nr;

		this.galerieoverlay.fade ('hide');
		this.galerieoverlay.fade ('in');

		this.galerieoverlay.setStyle('display', 'block');
		var galerieoverlay_position = this.galerieoverlay.getPosition ();
		var div_body_size = this.div_body.getScrollSize ();
		this.galerieoverlay.setStyle('height', div_body_size.y - galerieoverlay_position.y);

		this.galeriebild_div[this.prev_bild_id].empty ();

		window.location.href = "#atop";

//		window.CALLshowAktBild = this.CALLshowAktBild;
//		window.setTimeout ("CALLshowAktBild()", this.fade_duration);
		
		this.showAktBild ();
	},

	/*	Schließt die Galerie
	*/
	close: function () {
		var myFx = new Fx.Tween (this.galerieoverlay);
		//	complete-Event für das Ausblenden der Galerie
		myFx.addEvent('complete', this.galery_fade_out_complete.bind (this));
		myFx.start ('opacity', 0.0);
	},

	galery_fade_out_complete: function () {
		this.galerieoverlay.setStyle('display', 'none');
	},

	/*	Zeigt das nächste Bild an
	*/
	next: function () {
		if (this.akt_bild_nr < (this.bilder.length - 1))
			this.akt_bild_nr++;
		else
			this.akt_bild_nr = 0;

		this.showAktBild ();
	},

	/*	Zeigt das vorherige Bild an
	*/
	prev: function () {
		if (this.akt_bild_nr > 0)
			this.akt_bild_nr--;
		else
			this.akt_bild_nr = this.bilder.length - 1;

		this.showAktBild ();
	},

	CALLshowAktBild: function () {
	},

	/*	Öffnet die Galerie mit einem Bild
	*/
	showAktBild: function () {

		this.galeriebild_div[this.akt_bild_id].empty ();
		
		//	Lade-Bild als aktuelles Bild zeigen
		this.galeriebild_load.inject (this.galeriebild_div[this.akt_bild_id]);
		this.galeriebild_div[this.akt_bild_id].fade ('show');

		//	Vorheriges Bild ausblenden
		var myFx2 = new Fx.Tween (this.galeriebild_div[this.prev_bild_id], {duration: this.fade_duration});
		myFx2.start ('opacity', 0.0);

		//	Bild in Array-Element laden
		this.galeriebild[this.akt_bild_id] = new Asset.image(this.bilder[this.akt_bild_nr].bild_url_gross,
			{
				onload: this.bild_loaded.bind(this)
			}
		);
	},
	
	bild_loaded: function (tmp_galeriebild) {
		
		//	Neues Bild verstecken und Div leeren
		this.galeriebild_div[this.akt_bild_id].fade ('hide');
		this.galeriebild_div[this.akt_bild_id].empty ();
		//	Positionieren
		var bild_width = this.galeriebild[this.akt_bild_id].get('width');
		var all_size = this.div_all.getSize('width');
		this.galeriebild_div[this.akt_bild_id].setStyle('width', bild_width+'px');
		this.galeriebild_div[this.akt_bild_id].setStyle('left', (all_size.x/2 - bild_width/2)+'px');
		//	Bild und Text einsetzen
		this.galeriebild[this.akt_bild_id].inject (this.galeriebild_div[this.akt_bild_id]);
		(new Element('br')).inject (this.galeriebild_div[this.akt_bild_id]);
		this.texte[this.akt_bild_nr].clone().inject (this.galeriebild_div[this.akt_bild_id]);
		//	Tween anlegen und starten
		var myFx = new Fx.Tween (this.galeriebild_div[this.akt_bild_id], {duration: this.fade_duration});
		myFx.start ('opacity', 1.0);


		this.akt_bild_id = 1 - this.akt_bild_id;
		this.prev_bild_id = 1 - this.prev_bild_id;
	}

});

/*	*****************************************************************************************
	ms Selectbox
	*****************************************************************************************
*/
var msSelectbox = new Class({

	selectbox: null,
		selectbox_selector: null,
			selectbox_titlevalue: null,
		selectbox_container: null,
			selectbox_overflow: null,
				selectbox_scroller: null,
					selectbox_elements: Array,
			selectbox_bar: null,
				selectbox_handle: null,
	selectboxSlider: null,

	close_delay: 500,
	close_timeout_id: 0,

	b_is_open: false,
	Implements: Options,
	options: {
		width: 200,
		height: 300,
		barwidth: 16,
		slidersteps: 100,
		wheelsteps: 12,
		handle_element_clicks: false,
		update_element: false
/*		par1: {
			par2: 1,
			par3: 2
		}
*/	},
    
    /*	*************************************
		Konstruktor
	*/
    initialize: function(element_id, options){

		/*	Gesamte Selectbox	*/
		this.selectbox = $(element_id);
		this.setOptions(options);

		/*	Unter-Elemente ermitteln	*/
		var children = this.selectbox.getChildren('div');
		children.each (function (child) {
			if (child.hasClass('msSelectboxSelector'))		this.selectbox_selector = $(child);
			if (child.hasClass('msSelectboxContainer'))		this.selectbox_container = $(child);
		}.bind(this));

		/*	Unter-Elemente des Scroll-Containers ermitteln	*/
		var children = this.selectbox_container.getChildren('div');
		children.each (function (child) {
			if (child.hasClass('msSelectboxOverflow'))		this.selectbox_overflow = $(child);
			if (child.hasClass('msSelectboxBar'))			this.selectbox_bar = $(child);
		}.bind(this));

		this.selectbox_titlevalue = this.selectbox_selector.getElement('.msSelectboxTitleValue');

		/*	Unter-Elemente des Overflow-Containers ermitteln	*/
		var children = this.selectbox_overflow.getChildren('div');
		children.each (function (child) {
			if (child.hasClass('msSelectboxScroller'))		this.selectbox_scroller = $(child);
		}.bind(this));

		/*	Unter-Elemente des Scrollers ermitteln	*/
		this.selectbox_elements = $$(this.selectbox_scroller.getChildren('a'));

		/*	Unter-Elemente des Scrollbar-Elements ermitteln	*/
		var children = this.selectbox_bar.getChildren('div');
		children.each (function (child) {
			if (child.hasClass('msSelectboxHandle'))		this.selectbox_handle = $(child);
		}.bind(this));

		/*	Elemente einstellen	*/
		this.selectbox.setStyle('width', this.options.width);
		this.selectbox_container.setStyle('width', this.options.width);
		this.selectbox_container.setStyle('height', this.options.height);
		this.selectbox_overflow.setStyle('width', this.options.width-this.options.barwidth);
		this.selectbox_overflow.setStyle('height', this.options.height);
		this.selectbox_bar.setStyle('width', this.options.barwidth);
		this.selectbox_bar.setStyle('height', this.options.height);
		this.selectbox_handle.setStyle('width', this.options.barwidth);

		var content_height = this.selectbox_scroller.scrollHeight;
		if (content_height < this.options.height)
		{
			this.selectbox_container.setStyle ('height', content_height);
			this.selectbox_overflow.setStyle('height', content_height);
			this.selectbox_bar.setStyle('height', content_height);
		}

		/*	Die Höhe des Handles ist abhängig vom Verhältnis selectbox_overflow / selectbox_scroller	*/
		var handle_height = this.options.height * (this.options.height / this.selectbox_scroller.scrollHeight);
		if (handle_height > content_height)
			handle_height = content_height;
		this.selectbox_handle.setStyle('height', handle_height);

		/*	Slider	*/
		this.selectboxSlider = new Slider(this.selectbox_bar, this.selectbox_handle, {	
			steps: this.options.slidersteps,
			mode: 'vertical',
			wheel: true,	
			onChange:  this.barchange.bind(this)
		}).set(0);

		/*	Events	*/
		this.selectbox_selector.addEvent('click', this.toggle.bind(this,0));
		this.selectbox_container.addEvent('mousewheel', this.wheel.bind(this));
		this.selectbox_container.addEvent('mouseleave', this.mleave.bind(this));
		this.selectbox_selector.addEvent('mouseleave', this.mleave.bind(this));
		this.selectbox_container.addEvent('mouseenter', this.menter.bind(this));
		this.selectbox_selector.addEvent('mouseenter', this.menter.bind(this));

		/*	Jedem Link das Clickevent geben	*/
		if (this.options.handle_element_clicks)
			this.selectbox_elements.each(function(item,index){
				item.addEvent('click', this.clickelement.bind(this,new Array(item.getElement('.key').get('html'),item.get('html'))));
			},this);
	},

	/*	*************************************
	*/
	clickelement: function (key, val){

		this.selectbox_titlevalue.set('html', val);
		this.toggle (false);
		if (this.options.update_element)
			$(this.options.update_element).set('value', key);
	},

	/*	*************************************
		Klappt die Box auf oder zu
	*/
	toggle: function (set_state){
		this.b_is_open = ! this.b_is_open;
		if (! (set_state === 0))
			this.b_is_open = set_state;

		this.selectbox_container.setStyle('visibility', this.b_is_open ? 'visible' : 'hidden');
	},

	/*	*************************************
		Wenn die Maus aus der Scrollbox rausläuft
	*/
	mleave: function (event){
		this.close_timeout_id = this.toggle.delay(this.close_delay, this, false);
	},

	/*	*************************************
		Wenn die Maus in die Scrollbox reinläuft
	*/
	menter: function (event){
		$clear(this.close_timeout_id);
		this.close_timeout_id = 0;
	},

	/*	*************************************
		Reagiert auf das Scrollen der Scrollbar
	*/
	wheel: function (event){
		new Event(event).stop();	//	Verhindert, dass das Mousescroll-Event an den Browser weitergereicht wird
		this.selectboxSlider.set(this.selectboxSlider.step-(event.wheel*this.options.wheelsteps));
	},

	/*	*************************************
		Reagiert auf das Scrollen der Scrollbar
	*/
	barchange: function (step){
		if (! (step == undefined))
		{
			var h1 = this.selectbox_scroller.scrollHeight - this.options.height;
			var h2 = this.options.height - this.selectbox_handle.scrollHeight;
			var pos = step * (h1 / this.options.slidersteps);
			if (pos >= 0)
				this.selectbox_scroller.setStyle('marginTop', (-pos.toFixed()));
		}
	}
});

/*	*****************************************************************************************
	ms Scroller
	*****************************************************************************************
*/
var msScroller = new Class({

	scroller: null,
	scroller_content: null,
	mouse_inside: false,
	akt_pos: 0,
	new_pos: 0,
	sc_width: 0,
	new_pos_relative: 0,
	pic_preloads: false,

	Implements: Options,
	options: {
		img_path: '',
		height: 130,
		scrollmethod: 'absolute'
	},
    
    /*	*************************************
		Konstruktor
	*/
    initialize: function(element_id, options){

		/*	Gesamte Scrollbox	*/
		this.scroller = $(element_id);
		this.setOptions(options);

		/*	Unter-Elemente ermitteln	*/
		var children = this.scroller.getChildren('div');
		children.each (function (child) {
			if (child.hasClass('msScrollerContent'))		this.scroller_content = $(child);
		}.bind(this));

		/*	Styles setzen
			Falls Javascript ausgeschaltet ist, fehlen diese
			Styles und der Scroller wird einfach als Bilderliste
			angezeigt	*/
		this.scroller.setStyle('height', ''+this.options.height+'px');
		this.scroller.setStyle('overflow', 'hidden');
		this.scroller.setStyle('position', 'relative');

		/*	Scroller-Content-Attribute	*/
		this.scroller_content.setStyle('position', 'absolute');
		this.scroller_content.setStyle('white-space', 'nowrap');

		/*	Bilder ermitteln und Events reinhängen;
			außerdem Bilder preloaden	*/
		this.pic_preloads = new Array ();
		children = this.scroller_content.getChildren('a');
		children.each (function (child) {
			{
				var el_img = child.getElement('img');
				if (el_img.hasClass('hover'))
				{
					//	Mouseevents hinzufügen
					el_img.addEvent('mouseover', this.hover_img_over.bind (this, el_img));
					el_img.addEvent('mouseout', this.hover_img_out.bind (this, el_img));
					//	Over- und Out-Bilder aus dem Attribut 'onmouseover' ermitteln
//					el_img_bilder = el_img.get('name').split(':');
					var tmp = ""+el_img.get('onmouseover');
					el_img_bilder = tmp.substr(tmp.indexOf ('[[')+2, tmp.indexOf (']]')-tmp.indexOf ('[[')-2).split(':');
					//	Pfade auf die Over- und Out-Bilder im Bild-Objekt merken
					el_img.img_out = this.options.img_path + el_img_bilder[0];
					el_img.img_over = this.options.img_path + el_img_bilder[1];
					//	Over-Bild preloaden
					this.pic_preloads[this.pic_preloads.length] = new Image ();
					this.pic_preloads[this.pic_preloads.length - 1].src = el_img.img_over;
				}
			}
		}.bind(this));

		/*	Events	*/
		this.scroller.addEvent('mouseover', this.hover.bind(this,true));
		this.scroller.addEvent('mouseout', this.hover.bind(this,false));
		this.scroller.addEvent('mousemove', this.move.bind(this));
		this.tick.periodical(25, this);
//		this.resize_scroller.periodical(200, this);
	},

	/*	*************************************
		Maus über dem Container
	*/
	hover: function (inside){
		this.mouse_inside = inside;
	},

	/*	*************************************
		Maus über dem Bild
	*/
	hover_img_over: function (el) {
		el.src = el.img_over;
	},

	/*	*************************************
		Maus über dem Bild
	*/
	hover_img_out: function (el) {
		el.src = el.img_out;
	},

	/*	*************************************
		Mausbewegung
	*/
	move: function (event){
		var coord = this.scroller.getPosition();
		mouseX = event.page.x - coord.x;

		if (this.mouse_inside && (this.scroller_content.clientWidth > this.scroller.clientWidth))
		{
			//	Aktuelle Position
			var sc_coordinates = this.scroller_content.getPosition(this.scroller_content);

			//	Scrollbereich
			this.sc_width = this.scroller_content.clientWidth - this.scroller.clientWidth;
			//	Der Scroller soll das Ende schon erreichen, bevor die Maus am Rand
			//	angekommen ist.
			mouseOffsetX = mouseX*1.2-(this.scroller.clientWidth*0.1);
			
			sc_off = this.sc_width * mouseOffsetX / this.scroller.clientWidth;
			if (sc_off < 0)	sc_off = 0;
			if (sc_off > this.sc_width)	sc_off = this.sc_width;

			this.new_pos = -sc_off.toFixed();

			this.new_pos_relative = (mouseX - (this.scroller.clientWidth / 2)) / 20;	// 20
		}
	},

	/*	*************************************
		Mausbewegung
	*/
	tick: function (event){
		this.reposition_scroller();
	},
	
	reposition_scroller: function(){
		switch (this.options.scrollmethod)
		{
		case 'absolute':
			this.akt_pos = this.akt_pos + (this.new_pos - this.akt_pos) / 15;
			this.scroller_content.setStyle('left', this.akt_pos.toFixed()+"px");
			break;
		case 'relative':
			if (this.mouse_inside)
			{
				if (Math.abs (this.new_pos_relative) > 2)
				{
					this.akt_pos = this.akt_pos - this.new_pos_relative;
					if (this.akt_pos > 0)	this.akt_pos = 0;
					if (this.akt_pos < -this.sc_width)	this.akt_pos = -this.sc_width;
					this.scroller_content.setStyle('left', this.akt_pos.toFixed()+"px");
				}
			}
			break;
		}
	},

	resize_scroller: function(){
		/*
			TODO:
			Experimentell: Scrollerhöhe an den Inhalt anpassen
			
			nicht mehr nötig, da der Scoller jetzt immer 130 px hoch ist
			(ohne Ränder)
		*/
//		this.scroller.setStyle('height', this.scroller_content.clientHeight);
	}

});

function initGoogleMap(div_id)
{
	if (GBrowserIsCompatible())
	{
		map = new GMap2(document.getElementById(div_id));
		map.addControl(new GSmallMapControl());
	
		map.setCenter(new GLatLng (51.11042, 8.622894, 13));
		map.setZoom (10);

		//  Firefox Maus-Scroll-Rad
		GEvent.addDomListener(document.getElementById(div_id), "DOMMouseScroll", function(event) {
			if (event.detail < 0) {
				map.zoomIn();
			}
			else if (event.detail > 0) {
				map.zoomOut();
			}
			new Event(event).stop();	//	Verhindert, dass das Mousescroll-Event an den Browser weitergereicht wird
		});
	
		// IE Maus-Scroll-Rad
		GEvent.addDomListener(document.getElementById(div_id), "mousewheel", function(event) {
			if (event.wheelDelta > 0) {
				map.zoomIn();
			}
			else if (event.wheelDelta < 0) {
				map.zoomOut();
			}
			new Event(event).stop();	//	Verhindert, dass das Mousescroll-Event an den Browser weitergereicht wird
		});
	}
}