$(document).ready(function() {
	var hoverbox = {
		trigger:		$('.hoverbox'),
		triggerOffset:	'',
		triggerWidth:	0,
		triggerParent:	'',
		hbWidth:		252, // Width is set in stylesheet * width plus padding *
		arrowSide:		'',
		leftArrow:		'hoverboxWrapperLeft',
		rightArrow:		'hoverboxWrapperRight',
		hbContentWrap:	'<div id="hoverboxContent" />',
		hbContentObj:	$('#hoverboxContent'),
		hbContentElem:	'#hoverboxContent',
		hbContents:		'',
		hbHtml:			'.hoverboxContent',
		hbBottomCap:	'<span id="hoverboxCap"></span>',
		theHoverbox:	'',
		triggered:		false,
		shown:			false,
		hovered:		false
	};
	var settings = {
		verticalOffset:	-60,
		horizontalOffset: -20,
		timeDelay:	200
	};
	$(hoverbox.hbHtml).hide(); // Hides content that is used to populate the hoverbox
	
	$(hoverbox.trigger).hover(
		function() {
		// Mouseover
			if (hoverbox.shown == false) {
				hoverbox.triggerOffset = $(this).offset();
				hoverbox.triggerWidth = $(this).innerWidth();
				
				hoverbox.arrowSide = setHbArrowSide(hoverbox.triggerOffset, hoverbox.triggerWidth);
				hoverbox.theHoverbox = buildHoverbox($(this), hoverbox.arrowSide);
				positionHoverbox(hoverbox.triggerOffset, hoverbox.triggerWidth, hoverbox.theHoverbox);
				displayHoverbox(hoverbox.theHoverbox);
			}
			else {
				return;
			}
		},
		function() {
		// Mouseout
			$(hoverbox.hbContentElem).parent().bind('mouseover', function() {
				hoverbox.hovered = true;
			});
			setTimeout(function(){
				if (hoverbox.hovered == false) {
					$(hoverbox.hbContentElem).parent().remove();
					hoverbox.shown = false;
				}
			  }, settings.timeDelay);
		}
	);
	
	function bindEventToRemoveHoveredBox() {
		$(hoverbox.hbContentElem).parent().bind('mouseleave', function() {
			setTimeout(function(){
				$(hoverbox.hbContentElem).parent().remove();
				hoverbox.hovered = false;
				hoverbox.shown = false;
			}, settings.timeDelay);
		});
	}
	
	function setHbArrowSide(triggerOffset, triggerWidth) {
		
		if (((window.innerWidth || document.body.clientWidth ) - (triggerOffset.left + triggerWidth)) + settings.horizontalOffset < hoverbox.hbWidth) {
			return hoverbox.rightArrow;			
		} else {
			return hoverbox.leftArrow;
		}
	}
	function buildHoverbox(trigger, hoverboxWrapper) {
		$('body').prepend(hoverbox.hbContentWrap);
		$(hoverbox.hbContentElem).wrap('<div id="' + hoverboxWrapper + '">', '</div>');

		hoverbox.hbContents = $(trigger).siblings(hoverbox.hbHtml).html();
		$(hoverbox.hbContentElem)
			.append(hoverbox.hbContents)
			.after(hoverbox.hbBottomCap);
		var hbWrapperElem = '#' + hoverboxWrapper;
		$(hbWrapperElem).hide();
		return hbWrapperElem;
	}
	function positionHoverbox(triggerOffset, triggerWidth, hoverboxElem) {
		if (hoverboxElem.slice(1) == hoverbox.rightArrow) {
			$(hoverboxElem).css({'left': triggerOffset.left - hoverbox.hbWidth, 'top': triggerOffset.top + settings.verticalOffset});
		} else {
			$(hoverboxElem).css({'left': triggerOffset.left + triggerWidth, 'top': triggerOffset.top + settings.verticalOffset});
		}
	}
	function displayHoverbox(hoverboxElem) {
		$(hoverboxElem).show();
		bindEventToRemoveHoveredBox();
		hoverbox.shown = true;
	}
});