/****  MENU ******/
var under_menu_box = new Class({
	Implements: [Chain, Options],
	/* standart egenskap */
	options: {
		box_ids							: null,
		frame_id						: 'under_meny_frame',
		frame_contetnt_id			    : 'under_meny_frame_content',
		limit_DOM_id					: 'td_table',
		top_offset						: 0,
		box_visible						: false,
		box_hide_delay					: -1
	},
	frame_DOM						: null,
	frame_top_arrow_DOM				: null,
	frame_content_DOM				: null,
	current_meny_ind 				: null,
	left_menu_DOM					: null,
	left_menu_pos					: null,
	left_menu_size					: null,
	h_limits_pos					:{'x'	: 0},
	h_limits_size					:{'x'	: '960'},
	/* -- constructor -- */
	initialize: function($options){
		this.setOptions($options);
		for (var i = 0; i < this.options.box_ids.length; i ++){
			// 'elem_id'=> 'search_field', 'under_box_id'=>'search_under_box', 'event'=>'blur'
			this.options.box_ids[i].elem_DOM = $(this.options.box_ids[i].elem_id);
			this.options.box_ids[i].under_box_DOM = $(this.options.box_ids[i].under_box_id);
			this.options.box_ids[i].under_box_DOM.setStyles({'display': 'block', 'visibility':'hidden'});
			this.options.box_ids[i].under_box_size = this.options.box_ids[i].under_box_DOM.getSize();
			this.options.box_ids[i].under_box_DOM.setStyles({'width':this.options.box_ids[i].under_box_size.x, 'height':this.options.box_ids[i].under_box_size.y});
			this.options.box_ids[i].under_box_DOM.setStyles({'display': 'none', 'visibility':'visible'});
			this.options.box_ids[i].position_limits = true;
			if (this.options.box_ids[i].Show) {
				this.options.box_ids[i].elem_DOM.addEvent(this.options.box_ids[i].Show, this.show_box_for.bind(this, [i]));
				this.options.box_ids[i].position_limits = false;
				this.options.box_ids[i].elem_DOM.addEvent('mouseover', this.reset_delay_2.bind(this, [i]));
			}
			else{
				this.options.box_ids[i].elem_DOM.addEvent('mouseover', this.show_box_for.bind(this, [i]));
			}
			if (this.options.box_ids[i].Hide) {
				this.options.box_ids[i].elem_DOM.addEvent(this.options.box_ids[i].Hide, this.set_delay_hide_box_for.bind(this, [i]));
			} else this.options.box_ids[i].elem_DOM.addEvent('mouseout', this.set_delay_hide_box_for.bind(this, [i]));
		}
		this.frame_DOM = $(this.options.frame_id);
		//$(document.body).grab(this.frame_DOM);
		this.frame_content_DOM = $(this.options.frame_contetnt_id);
		this.frame_top_arrow_DOM = this.frame_DOM.getElement('#under_meny_frame_arrow');
		this.options.top_offset = $('top_meny_linje').getPosition().y + $('top_meny_linje').getSize().y - 7;
		this.frame_DOM.addEvent('mouseover', this.reset_delay.bind(this));
		this.frame_DOM.addEvent('mousemove', this.reset_delay.bind(this));
		this.frame_DOM.addEvent('click', this.reset_delay.bind(this));
		this.frame_DOM.addEvent('mouseout', this.set_delay_hide_box_for.bind(this));
		try{
			this.left_menu_DOM = $(this.options.limit_DOM_id);
			this.h_limits_pos = this.left_menu_DOM.getPosition();
			this.h_limits_size = this.left_menu_DOM.getSize();
		}
		catch(e){
		}
	},

	show_box_for: function(ind){
		this.reset_delay(ind);
		this.current_meny_ind = ind;
		var target_elem = this.options.box_ids[ind].elem_DOM;
		var target_pos = target_elem.getPosition();
		var target_size = target_elem.getSize();
		var content_elem = this.options.box_ids[ind].under_box_DOM;
		var content_size = this.options.box_ids[ind].under_box_size;

		var box_pos = {
			x:target_pos.x - (content_size.x / 2) + (target_size.x / 2) - 21,
			y:this.options.top_offset
		};
		var arrow_pos = {
			x:((content_size.x / 2) + 17) + 'px',
			y:'top'
		};
		var box_size = {
			x: content_size.x,
			y: content_size.y
		};
		var org_box_pos = {
			x: box_pos.x,
			y: box_pos.y
		};

		if (this.h_limits_pos.x > box_pos.x && this.h_limits_size.x  > box_size.x){
			box_pos.x = parseInt(this.h_limits_pos.x) + 5;
			//console.log((parseInt(org_box_pos.x) - parseInt(box_pos.x)));
		}
		// too mutch to the right
		if (this.h_limits_pos.x + this.h_limits_size.x < box_pos.x + box_size.x && this.h_limits_size.x  > box_size.x){
			box_pos.x = parseInt(this.h_limits_pos.x) + parseInt(this.h_limits_size.x) - parseInt(box_size.x);
		}
		// too wide anyway
		if (box_size.x > this.h_limits_size.x){
			var sizeDx = (box_size.x - this.h_limits_size.x) / 2;
			box_pos.x = parseInt(this.h_limits_pos.x) - sizeDx;
		}

		var child = this.frame_content_DOM.getFirst();
		if (child) {
			$(document.body).grab(child);
			child.setStyle('display', 'none');
		}
		//console.log(arrow_pos.x);
		if (parseInt(org_box_pos.x) - parseInt(box_pos.x) != 0) arrow_pos.x = parseInt(arrow_pos.x) + (parseInt(org_box_pos.x) - parseInt(box_pos.x)) + 'px';
		this.frame_top_arrow_DOM.setStyle('background-position', arrow_pos.x+' '+arrow_pos.y);
		if (this.options.box_visible){
			this.frame_DOM.set('tween', {'duration':'short'});
			this.frame_DOM.tween('left',box_pos.x);
			this.frame_content_DOM.set('morph', {
				transition: 'quint:out',
				onComplete : function($content){
					$content.setStyles({'display':'block'});
					this.frame_content_DOM.set('html', '');
					this.frame_content_DOM.grab($content);
				}.bind(this, [content_elem])
			});
			this.frame_content_DOM.morph({
				'width':box_size.x+'px',
				'height':box_size.y+'px'
			});
			//this.frame_DOM.setPosition({'x':target_pos.x - (content_size.x / 2) + (target_size.x / 2), 'y':this.options.top_offset});
		} else {
			content_elem.setStyle('display', 'block');
			this.frame_content_DOM.adopt(content_elem);
			///this.frame_content_DOM.setStyles({'width':content_size.x, 'height':content_size.y});
			this.frame_content_DOM.setStyles({'width':box_size.x, 'height':box_size.y});
			//this.frame_DOM.setPosition({'x':target_pos.x - (content_size.x / 2) + (target_size.x / 2) - 21, 'y':this.options.top_offset});
			this.frame_DOM.setPosition({'x':box_pos.x, 'y':box_pos.y});
			this.frame_DOM.setStyle('display','inline');
			this.options.box_visible = true;
		}
	},
	set_delay_hide_box_for: function(ind){
		//return;
		this.options.box_hide_delay = this.hide_box_for.delay(450, this);
	},
	hide_box_for: function(){
		//return;
		this.frame_DOM.setStyle('display', 'none');
		var child = this.frame_content_DOM.getFirst();
		if (child) {
			child.setStyle('display', 'none');
			$(document.body).grab(child);
		}
		this.options.box_hide_delay = -1;
		this.options.box_visible = false;
		this.current_meny_ind = -1;
	},
	reset_delay: function(ind){
		$clear(this.options.box_hide_delay);
		//$clear(this.options.box_content_delay);
		this.options.box_hide_delay = -1;
	},
	reset_delay_2 : function(ind){
		if (this.current_meny_ind != ind) return;
		$clear(this.options.box_hide_delay);
		this.options.box_hide_delay = -1;
	}
});