function resizeHandler()
{
	if (!is.handheld)
	{
		var page = getById('page');
		if (page)
		{
			// check if this is first call
			if (!resizeHandler.initialized)
			{
				resizeHandler.initialized = true;
				addEvent(window, 'resize', resizeHandler);
			}

			var pageDim = getPageDimensions();

				page.style.width = pageDim.availWidth < 1208 ? 'auto' : '1208px';

				var className = '';
				if (pageDim.availWidth < 1064)
					className = 'res1024';
				else if (pageDim.availWidth < 1114)
					className = 'res1100';
				else if (pageDim.availWidth < 1138)
					className = 'res1152';

				if (page.className != className)
					page.className = className;

		}
	}
}


function SiteMenu(activeMenu)
{
	this.element = getById('siteMenu');
	this.menuItems = [];
	this.activeMenu = activeMenu;
	this.menuActive = false;
	this.menuItemTimeout = null;
	this.menuTimeout = null;
	this.init();

	SiteMenu.instance = this;
}

Object.extend(SiteMenu.prototype,
{
	init: function()
	{
		if (this.element)
		{
			var menuItems = this.element.getElementsByTagName('li'), menuItem, i = 0;
			// We skip the first item sice it's the bypass link
			while ((menuItem = menuItems[++i]))
			{
				addEvent(menuItem, 'click', this.onClick.bind(this, i));
				addEvent(menuItem, 'mouseover', this.onMouseover.bind(this, i));
				menuItem.subMenu = new SubMenu(i, menuItem.offsetLeft);
				this.menuItems[i] = menuItem;
			}

			var header = getById('header');
			if (header)
			{
				// complete reset only when leaving header area
				addEvent(header, 'mouseover', this.cancelMouseout.bind(this));
				addEvent(header, 'mouseout', this.onMouseout.bind(this, this.activeMenu));
			}

			addEvent(window, 'unload', this.cleanUp.bind(this));
		}
	},
	positionSubMenus: function()
	{
		var i = 0, menuItem;
		while ((menuItem = this.menuItems[++i]))
		{
			if (menuItem.subMenu.element)
				menuItem.subMenu.position();
		}
	},
	cleanUp: function()
	{
		this.menuActive = false;
		this.menuItems = null;
		this.element = null;
	},
	onClick: function(i)
	{
		clearTimeout(this.menuItemTimeout);
		this.menuActive = true;
		this.handleMouseover(i);
	},
	onMouseover: function(i, e)
	{
		clearTimeout(this.menuItemTimeout);
		if (i != this.activeMenu)
		{
			var timeOut = 250;

			if (this.menuActive)
			{
				var target = e.target || e.srcElement;

				if (target.nodeType == 3)
					target = target.parentNode;

				timeOut = target.nodeName == 'A' ? 50 : 100;
			}

			this.menuItemTimeout = setTimeout(this.onClick.bind(this, i), timeOut);
		}
	},
	onMouseout: function(i)
	{
		clearTimeout(this.menuTimeout);
		clearTimeout(this.menuItemTimeout);
		this.menuTimeout = setTimeout(this.handleMouseout.bind(this, i), 5000);
	},
	cancelMouseout: function()
	{
		clearTimeout(this.menuTimeout);
	},
	handleMouseover: function(i)
	{
		var menu;

		if (this.menuActive && this.menuItems && i != this.activeMenu)
		{
			if ((menu = this.menuItems[this.activeMenu]))
			{
				removeClass(menu, 'active');
				if (menu.subMenu.element)
				{
					menu.subMenu.handleMouseout();
					removeClass(menu.subMenu.element, 'active');
				}

			}

			this.activeMenu = i;

			if ((menu = this.menuItems[this.activeMenu]))
			{
				addClass(menu, 'active');

				if (menu.subMenu.element)
					addClass(menu.subMenu.element, 'active');
			}
		}
	},
	handleMouseout: function(i)
	{
		this.handleMouseover(i);
		this.menuActive = false;
	}
});

function SubMenu(id, offset)
{
	this.element = getById('groupNav' + id);
	this.menu = null;
	this.offset = offset;
	this.width = 0;
	this.menuItems = [];
	this.activeMenu = -1;
	this.menuActive = false;
	this.menuTimeout = null;
	this.menuItemTimeout = null;
	this.init();
}

Object.extend(SubMenu.prototype,
{
	init: function()
	{
		if (this.element)
		{
			var lastitem, menuitem, menusubitem, i = 0;

			if ((this.menu = first_child(this.element, 'ul')))
			{
				menuitem = first_child(this.menu, 'li');
				
				if (menuitem)
				{
					do
					{
						lastitem = menuitem;

						if ((menusubitem = first_child(menuitem, 'div')))
						{
							menuitem.className += 'subitems';
							addEvent(menuitem, 'click', this.onClick.bind(this, i));
							addEvent(menuitem, 'mouseover', this.onMouseover.bind(this, i));

							this.menuItems[i++] = menusubitem;
						}
						else
						{
							addEvent(menuitem, 'mouseover', this.handleMouseover.bind(this, -1));
						}
					}
					while ((menuitem = node_after(menuitem, 'li')));

					this.width = lastitem.offsetLeft;
					this.position();
				}
			}

			addEvent(this.element, 'mouseover', this.cancelMouseout.bind(this));
			addEvent(this.element, 'mouseout', this.onMouseout.bind(this));

			menuitem = null, menusubitem = null;
			addEvent(window, 'unload', this.cleanUp.bind(this));
		}
	},
	cleanUp: function()
	{
		this.menuActive = false;
		this.menuItems = null;
		this.menu = null;
		this.element = null;
	},
	position: function()
	{
		if (this.width)
		{
			var maxLeft = this.element.parentNode.offsetWidth - 10;
			var searchbox = getById('searchbox');
			if (searchbox)
				maxLeft = searchbox.offsetLeft - 10;

			// here we try to 'center' the submenu belof the maintab
			var offset = this.offset - Math.floor(this.width / 2);
			offset += 95; // half of the maintab width plus 9 (fast shortcut)

			// limiter
			if (offset + this.width > maxLeft) offset = maxLeft - this.width;
			if (offset < 0) offset = 0;

			this.element.style.left = offset + 'px';
		}
	},
	onClick: function(i)
	{
		clearTimeout(this.menuItemTimeout);
		this.menuActive = true;
		this.handleMouseover(i);
	},
	onMouseover: function(i)
	{
		clearTimeout(this.menuItemTimeout);
		if (this.menuActive)
			this.handleMouseover(i);
		else if (i != this.activeMenu)
			this.menuItemTimeout = setTimeout(this.onClick.bind(this, i), 50);
	},
	onMouseout: function(i)
	{
		clearTimeout(this.menuTimeout);
		clearTimeout(this.menuItemTimeout);
		this.menuTimeout = setTimeout(this.handleMouseout.bind(this), 1000);
	},
	cancelMouseout: function()
	{
		clearTimeout(this.menuTimeout);
	},
	handleMouseover: function(i)
	{
		if (this.menuItems && i != this.activeMenu)
		{
			var menu = this.menuItems[this.activeMenu]
			if (menu)
				menu.style.display = 'none';

			this.activeMenu = i;
			if ((menu = this.menuItems[this.activeMenu]))
			{
				menu.style.left = menu.parentNode.offsetLeft + 'px';
				menu.style.display = 'block';
			}
		}
	},
	handleMouseout: function()
	{
		this.handleMouseover(-1);
		this.menuActive = false;
	}
});