var currentPopup = document.getElementById('WM');
var currentPopupRight = document.getElementById('WMRight');
var mouseIsInside, mouseIsInsideRight;
var relX, relY, parentOffset;



$(document).ready(function() { 	
	
	
	// Create hit elements for detection
	
	
	
	// Big home equation
	$('#homeBillboard').append('<div id="WMHit" class="hitArea"></div>');
	$('#homeBillboard').append('<div id="ICHit" class="hitArea"></div>');
	$('#homeBillboard').append('<div id="APHit" class="hitArea"></div>');
	$('#homeBillboard').append('<div id="RMHit" class="hitArea"></div>');
	
	
	// Small right equation
	$('#rightEquation').append('<div id="WMHitRight" class="hitArea"></div>');
	$('#rightEquation').append('<div id="ICHitRight" class="hitArea"></div>');
	$('#rightEquation').append('<div id="APHitRight" class="hitArea"></div>');
	$('#rightEquation').append('<div id="RMHitRight" class="hitArea"></div>');
	
	
	
	
	// Fix the iPad PNG bug
	if (navigator.userAgent.match(/iPad/i) != null) {
		$('.fade').css('backgroundImage', 'none');
		$('.fade').css('backgroundColor', 'rgba(255, 255, 255, 0.7)');
	}
	
	
	
	
	
	$('.hitArea').mouseover(function(event){
		//console.log(this.id);
		if (navigator.userAgent.match(/MSIE\s(?!9.0)/)) {
   		 // ie less than version 9
   		 	$('.fade').show();
		} else {
			$('.fade').fadeIn();
		}
		
		switch(this.id) {
		
			case 'WMHit':
				$(currentPopup).fadeOut();
				currentPopup = document.getElementById('WM');
				$(currentPopup).fadeIn();
				break;
				
			case 'ICHit':
				$(currentPopup).fadeOut();
				currentPopup = document.getElementById('IC');
				$(currentPopup).fadeIn();
				break;
			
			case 'APHit':
				$(currentPopup).fadeOut();
				currentPopup = document.getElementById('AP');
				$(currentPopup).fadeIn();
				break;
				
			case 'RMHit':
				$(currentPopup).fadeOut();
				currentPopup = document.getElementById('RM');
				$(currentPopup).fadeIn();
				break;
				
				
				
				
			case 'WMHitRight':
				$(currentPopupRight).fadeOut();
				currentPopupRight = document.getElementById('WMRight');
				$(currentPopupRight).fadeIn();
				break;
				
			case 'ICHitRight':
				$(currentPopupRight).fadeOut();
				currentPopupRight = document.getElementById('ICRight');
				$(currentPopupRight).fadeIn();
				break;
			
			case 'APHitRight':
				$(currentPopupRight).fadeOut();
				currentPopupRight = document.getElementById('APRight');
				$(currentPopupRight).fadeIn();
				break;
				
			case 'RMHitRight':
				$(currentPopupRight).fadeOut();
				currentPopupRight = document.getElementById('RMRight');
				$(currentPopupRight).fadeIn();
				break;
		
		}
		
	});
	
	
	
	
	
	
	
	
	
	
	// Hide popups on click outisde
	$('.equationPopup').hover(function(){ 
		mouseIsInside=true; 
	}, function(){ 
		mouseIsInside=false; 
	});
		
	$('body').mouseup(function(){ 
		if(! mouseIsInside) $(currentPopup).fadeOut();
		if (navigator.userAgent.match(/MSIE\s(?!9.0)/)) {
   		 // ie less than version 9
   		 	$('.fade').hide();
		} else {
			$('.fade').fadeOut();
		}
	});
	
	
	
	
	$('.equationPopupRight').hover(function(){ 
		mouseIsInsideRight=true; 
	}, function(){ 
		mouseIsInsideRight=false; 
	});

	$('body').mouseup(function(){ 
		if(! mouseIsInsideRight) $(currentPopupRight).fadeOut();
		if (navigator.userAgent.match(/MSIE\s(?!9.0)/)) {
   		 // ie less than version 9
   		 	$('.fade').hide();
		} else {
			$('.fade').fadeOut();
		}
	});
	
	
	
	
	
	
	
	
	$('.close').click(function(event) {
		$(this).parent().parent().fadeOut();
		
		if (navigator.userAgent.match(/MSIE\s(?!9.0)/)) {
   		 // ie less than version 9
   		 	$('.fade').hide();
		} else {
			$('.fade').fadeOut();
		}
	});
	
	
	
	
	
});