//client_scroll_x = document.documentElement.scrollLeft;
//client_scroll_y = document.documentElement.scrollTop;
var i = 0;
var sub_active_id = null;

Container = function() {
}

Menu = function(id, sub, x, y) {
	
	this.id = id;
	this.sub = sub;
	this.x = x;
	this.y = y;
}

offset = new Container;
offset.x = 190;
offset.y = 232;

var menu_conf = new Array(	new Menu('m1', true, 0, -4),
							new Menu('m2', false, 0, 30),
							new Menu('m3', false, 0, 76),
							new Menu('m4', false, 0, 114),
							new Menu('m5', true, 0, 102),
							new Menu('m6', true, 0, 131),
							new Menu('m7', false, 0, 179),
							new Menu('m8', false, 0, 218),
							new Menu('m9', false, 0, 292),
							new Menu('m10', false, 0, 330),
							new Menu('m11', false, 0, 368),
                            new Menu('ml1', true, 0, 336),
                            new Menu('ml2', true, 0, 362),
                            new Menu('ml3', false, 0, 390),
                            new Menu('ml4', true, 0, 418),
                            new Menu('ml5', true, 0, 442),
                            new Menu('ml6', true, 0, 470)
							);

function setup() {
    
	for (var i=0; i<menu_conf.length; i++) {
        
        if ( $(menu_conf[i].id) ) {
            $(menu_conf[i].id).observe('mouseover', toggle);
        }
	} // end for
	
	$('mid').observe('mouseover', toggle)
	disable_all_submenus();
	
	// correct x offset for submenu depending on window width
	if (document.body.clientWidth > 1280) {
		
		offset.x += (document.body.clientWidth-1268)/2;
	} // end if
	
	// this event corrects offset.x after the window has resized
	Event.observe(document.onresize ? document : window, 'resize',
			function() {
				if (document.body.clientWidth > 1280) {
					
					offset.x += (document.body.clientWidth-1268)/2;
				} else {
					
					offset.x = 180;
				} // end if
			}
	);
}


function toggle(evt) {
	
	if (evt.type == 'mouseover' && this.id == 'mid' && sub_active_id != null) {
		
		$(sub_active_id).style.display = 'none';
		return;
	} // end if
	
	if (evt.type == 'mouseover') {
		
		var m = look_up(menu_conf, this.id);
		var sub_id = 'submenu_'+m.id;
		if (m.sub && $(sub_id) != null && $(sub_id).style.display == 'none') {
			
			disable_all_submenus();
			
			$(sub_id).style.display = 'block';
			$(sub_id).style.left = (offset.x+m.x)+"px";
			$(sub_id).style.top = (offset.y+m.y)+"px";
			
			sub_active_id = sub_id;
		} else if (m.sub) {
			
			/* nothing */
		} else {
			
			if ($(sub_active_id) != null) {
				
				$(sub_active_id).style.display = 'none';
			} // end if
		} // end if
	} // end if
}

function look_up(a, id) {
	
	for (var i=0; i<a.length; i++) {
		
		if (a[i].id == id) {
			
			return a[i];
		} // end if
	} // end for
	
	return false;
}

function disable_all_submenus() {
	
	for (var i=0; i<menu_conf.length; i++) {
		
		if (menu_conf[i].sub) {
			
			$('submenu_'+menu_conf[i].id).style.display = 'none';
		} // end if
	} // end for
}