var SubMenu = new Class({
	Implements: Options,
	menuBarId: 'menu',
	options: {
		addShadow: true,
		glow: false
	},
	initialize: function (menuBarId, options) {
		this.setOptions(options);
		this.menuBarId = menuBarId || this.menuBarId;
		var submenus = $$('#' + this.menuBarId +  ' .submenu ul');

		this.submenus = submenus;

		this.isIE6 = /MSIE\s6/.test(navigator.userAgent);
		this.isIE = /MSIE/.test(navigator.userAgent);

		// set the menu to be in position but hidden so that the sizes will be calculated correctly
		this.submenus.each(function (submenu) {
			submenu.setStyles({
				visibility: 'hidden',
				display: 'block'
			})
		});

		if (this.isIE) {
			this.prepForIE();
		}
		if (this.isIE6) {
			this.prepForIE6();
		}

		var navlist = $$('#' + this.menuBarId + ' ul');
		if (navlist.length > 0) {
			navlist[0].getChildren().each(function(e) {
				e.addEvent('mouseenter', function() {
					this.addClass('hover');
				});
				e.addEvent('mouseleave', function() {
					this.removeClass('hover');
				});
			});
		}

		// hide the menu again
		this.submenus.each(function (submenu) {
			submenu.setStyles({
				display: '',
				visibility: ''
			})
		});
	},
	prepForIE: function () {
		this.submenus.each(function (submenu) {
			var paddings = submenu.getElement('a').getStyles('paddingLeft', 'paddingRight');
			var width = 0;
			var links = submenu.getElements('a');
			links.each(function (e) {
				width = e.offsetWidth > width ? e.offsetWidth : width;
			});
			width = width - parseInt(paddings.paddingLeft) - parseInt(paddings.paddingRight);
			if (width > 0) {
				links.each(function (e) {
					e.setStyle('width', width);
				});
			}
		});
	},
	prepForIE6: function () {
		$$('#' + this.menuBarId +  ' li').each(function (e) {
			e.addEvent('mouseenter', function () {e.addClass('hover')});
			e.addEvent('mouseleave', function () {e.removeClass('hover')});
		});

		var regex = /url\(['"](.*)['"]\)/;
		this.submenus.each(function (submenu) {
			var p = submenu.getParent();

			var size = submenu.getSize();
//			p.addEvent('mouseenter', function () {submenu.setStyles({display: 'block'})});
//			p.addEvent('mouseleave', function () {submenu.setStyles({display: ''})});
		}, this);
	}
});