JSMenu = new Class({

	// ----------------------------------------------------------------------------------------------------
	initialize: function() {
	},

	// ----------------------------------------------------------------------------------------------------
	installHandlers: function(raiz, id) {

		var divMenuItemName = 'div_menu_item_' + id;
		var divHeaderName = 'div_header_' + id;
		var divSubmenuName = 'div_submenu_' + id;
		var aHeaderName = 'a_header_' + id;

		$(divSubmenuName).setStyle('opacity', 0);

		// divMenuItemName
		$(divMenuItemName).overFx = new Fx.Style(divSubmenuName, 'opacity', {duration: 250});
		$(divMenuItemName).outFx = new Fx.Style(divSubmenuName, 'opacity', {duration: 350});
		// Header
		$(divHeaderName).raiz = raiz;
		$(divHeaderName).itemId = id;
		$(divHeaderName).menu = this;
		$(divHeaderName).addEvents({
			mouseenter: function() {
				this.menu.mouseenter(this.raiz, this.itemId);
			},
			mouseleave: function() {
				this.menu.mouseleave(this.raiz, this.itemId);
			}
		});

		// Submenu
		$(divSubmenuName).raiz = raiz;
		$(divSubmenuName).itemId = id;
		$(divSubmenuName).menu = this;
		$(divSubmenuName).addEvents({
			mouseenter: function() {
				this.menu.mouseenter(this.raiz, this.itemId);
			},
			mouseleave: function() {
				this.menu.mouseleave(this.raiz, this.itemId);
			}
		});

	},

	// ----------------------------------------------------------------------------------------------------
	mouseenter: function(raiz, id) {

		$('div_header_' + id).setStyle('backgroundImage', 'url(' + raiz + 'menu/fundo_header_sub_over.png)');

		var divMenuItem = $('div_menu_item_' + id);
		divMenuItem.overFx.stop();
		divMenuItem.outFx.stop();
		divMenuItem.overFx.start(0.9);

	},

	// ----------------------------------------------------------------------------------------------------
	mouseleave: function(raiz, id) {

		$('div_header_' + id).setStyle('backgroundImage', 'url(' + raiz + 'menu/fundo_header_sub_up.png)');

		var divMenuItem = $('div_menu_item_' + id);
		divMenuItem.overFx.stop();
		divMenuItem.outFx.stop();
		divMenuItem.outFx.start(0);

	},

	// ----------------------------------------------------------------------------------------------------
	preloadImages: function(raiz) {

		new Asset.images(
			[
				raiz + 'menu/fundo_header_up.png',
				raiz + 'menu/fundo_header_over.png',
				raiz + 'menu/fundo_header_sub_up.png',
				raiz + 'menu/fundo_header_sub_over.png'
			],
			{
				onComplete: function() {
					$('menu').setStyle('display', 'block');
				}
			}
		);

	}

});