// JavaScript Document

/*	*****************************************************************************************
	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()));
		}
	}
});