var submenu_widths = [];
var menu_widths = [];
var menu_heights = [];
var base_height = 35;
$(document).ready(function(){
	$('.subnav').css('display', 'block');
	li_height = $('.subnav li').height() + 4;
	$('.mainMenu').each(function(index, element){
		var item_id = 'menuItem' + (index + 1);
		$(this).attr('id', item_id);
		submenu_widths[item_id] = $(this).find('.subnav').width();
		var submenu_items = $(this).find('.subnav li').length;
		if (!submenu_items) submenu_items = 0;
		menu_heights[item_id] = base_height + submenu_items * li_height;
	});

	$('.subnav').css('display', 'none');
	$('.mainMenu').each(function(index, element){
		var item_id = $(this).attr('id');
		menu_widths[item_id] = $(this).width();
	});
	
	if( navigator.userAgent.match(/Android/i) ||
	 navigator.userAgent.match(/webOS/i) ||
	 navigator.userAgent.match(/iPhone/i) ||
	 navigator.userAgent.match(/iPod/i)
	 ){
	 //alert('mobile device');
	 $('.mainMenu').click(
		function(){
			item_id = $(this).attr('id');
			menu_width = menu_widths[item_id];
			menu_height = menu_heights[item_id];
			submenu_width = submenu_widths[item_id];
			//*if (submenu_width > menu_width) menu_width = submenu_width;
			
			$(this).stop().animate({
				width: menu_width + 'px',
				height: menu_height + 'px'
			}, 300, function(){
				$(this).find('.subnav').stop().fadeTo(300, 1.0);
			});
		})
	}else{
		$('.mainMenu').hover(
			function(){
				item_id = $(this).attr('id');
				menu_width = menu_widths[item_id];
				menu_height = menu_heights[item_id];
				submenu_width = submenu_widths[item_id];
				//*if (submenu_width > menu_width) menu_width = submenu_width;
				
				$(this).stop().animate({
					width: menu_width + 'px',
					height: menu_height + 'px'
				}, 300, function(){
					$(this).find('.subnav').stop().fadeTo(300, 1.0);
				});
			},
			function(){
				$('.mainMenu').each(function(index, element){
					item_id = $(this).attr('id');
					menu_width = menu_widths[item_id];
					$('.subnav').stop().fadeOut(300);
					$(this).stop().animate({
						width: menu_width + 'px',
						height: base_height + 'px'
					}, 300);
				});
			}
		);
		}

	
});