$(document).ready(function(){
	
	
	$('.bubble-trigger').each(function () {
										
		var distance = 10;
		var intime = 250;
		var outtime = 150;
		var hideDelay = 100;
	
		var hideDelayTimer = null;
	
		var beingShown = false;
		var shown = false;
		
		//define trigger and popup elements
		var trigger = $(this);
		var popup = $("#"+$(this).attr('rel'));
		
		
		//hide all grill details
		$('.grill-popup-detail', popup).hide();
		//reveal the default grill 
		$('.intro-grill', popup).show();
		
	
		$([this, popup.get(0)]).mouseenter(function () {
			
			if (hideDelayTimer) clearTimeout(hideDelayTimer);
			if (beingShown || shown) {
				// don't trigger the animation again
				return;
			} else {
				
				var trigger_pos = trigger.offset();  
				var trigger_width = trigger.outerWidth();
				var popup_width = popup.outerWidth();
				var popup_height = popup.outerHeight();
				
				var trigger_center = trigger_pos.left + (trigger_width / 2);
				var popup_left_pos = trigger_center - (popup_width / 2);
				var popup_top_pos = trigger_pos.top - popup_height + 20;
				
				var window_width = $(window).width() +10;
				var current_pos = popup_left_pos + (popup_width);
				var filter_wrapper = $('.popup-filter-wrapper', popup);
				var tail = $('.pop-up-tail', popup); 
				
				
				if(current_pos > window_width)
				{
					//popup is too far right!
					popup_left_pos = window_width - popup_width - 20;
					var tail_offset = trigger_center - popup_left_pos - 20;
					
					tail.css({"padding-left":tail_offset +'px', "padding-right":0 +'px', "margin-left": 0});
				}
				else if(popup_left_pos < 20)
				{
					//popup is too far left!
					popup_left_pos = 20;
					var tail_offset = trigger_center - popup_left_pos - 20;
					tail.css({"padding-left":tail_offset +'px', "padding-right":0 +'px', "margin-left": 0});
				}
				else
				{
					tail.css({"padding-left":0 +'px', "padding-right":0 +'px', "margin-left": 'auto'});
				}
			
				
				//set the initial position of the popup
				popup.css({"opacity": 0, "left": popup_left_pos + "px", "top":popup_top_pos + "px"});
				// reset position of info box
				beingShown = true;
				
				//hide all grill details
				$('.grill-popup-detail', popup).hide();
				//reveal the default grill 
				$('.intro-grill', popup).show();
				popup.css({'z-index':5000});
				popup.css({
					'top': popup_top_pos,
					'left': popup_left_pos,
					'display': 'block'
				}).animate({
					top: '-=' + distance + 'px',
					opacity: 1
				}, intime, 'swing', function() {
					beingShown = false;
					shown = true;
				});
			}
	
			return false;
		}).mouseleave(function () {
			popup.css({'z-index':500});
			if (hideDelayTimer) clearTimeout(hideDelayTimer);
			hideDelayTimer = setTimeout(function () {
				hideDelayTimer = null;
				popup.animate({
					top: '-=' + distance + 'px',
					opacity: 0
				}, outtime, 'swing', function () {
					shown = false;
					popup.css({'display':'none'});
				});
	
			}, hideDelay);
	
			return false;
		});
	});

	$('.grill-over').mouseover(toggle_grills);
});


function toggle_grills(event){
	
	//get grill to be shown
	var grill = $("#"+$(this).attr('rel'));
	//hide all currently showing grills
	$('.grill-popup-detail').hide();
	
	//show current grill
	grill.show();
	
}