var repoTimer = null;

//Image hover variables
var hoverTimer = null;
var hoverDelay = 500;
var closeTimer = null;
var theContainer = null;
var mousePositions = null;

$(document).ready(function() {
	$(document).bind('afterReveal.facebox', function() {
		//After the HTML is loaded we want to reposition the box to the center.
		//When loading images this doesn't work correctly because the image isn't completely loaded yet :(
		repoTimer = setInterval(repositionFacebox, 250);
	});
	
	$('a.new-window').click(function() {
		return !window.open($(this).attr('href'));
	});
	
	$('body').append("<div id='hover-container'><div id='hover-display'></div></div>");
	
	//When we enter a hover container, we want to begin the hover display function loop
	$('.hover-trigger').livequery(function() {
		$(this).mouseenter(function(event) {
			if(closeTimer != null) {
				clearTimeout(closeTimer);
				closeTimer = null;
			}
				
			theContainer = $('div#hover-container');
			mousePositions = {pageX: event.pageX, pageY: event.pageY};
			hoverTimer = setTimeout(function(event) {
					
				if(!isAnimating) {
					if($(theContainer).css('display') == 'none')
						$(theContainer).fadeIn('slow');
					
					keepHoverInBounds();
					
					clearTimeout(hoverTimer);
					hoverTimer = null;
				}
			}, hoverDelay);
		}).mouseleave(function(event) {
			if(closeTimer == null)
				closeTimer = setTimeout(function() {$(theContainer).fadeOut(hoverDelay)}, 250);
			
			if(hoverTimer != null) {
				clearTimeout(hoverTimer);
				hoverTimer = null;
			}
		}).mousemove(function(event) {
			mousePositions = {pageX: event.pageX, pageY: event.pageY};
			moveHover(event);
		}).click(function() {
			if($(this).attr('href').length == 0)
				return false;
		});
	});
});
	
function moveHover(event) {
	$(theContainer).css('left', (event.pageX) + 15).css('top', event.pageY);	
	keepHoverInBounds();
}

function keepHoverInBounds() {
	//Now that the height is set we want to see if the image is being pushed below the viewable screen space
	if(mousePositions.pageY + parseInt($(theContainer).height()) > parseInt($(window).height())) {
		//Difference = window height - (Offset of the top of the hover to its container + hover height)
		difference = parseInt($(window).height()) - (parseInt($(theContainer).height()));
		$(theContainer).css('top', difference);
	}
}

function repositionFacebox() {
	if($('div#facebox div.content img').size() > 0) {
		myImage = new Image();
		myImage.src = $('div#facebox div.content img').attr('src');
		
		if($('#facebox').height() < myImage.height)
			faceboxHeight = $('#facebox').height() + myImage.height;
		else
			faceboxHeight = $('#facebox').height();	
			
		adjustWidth = true;	
			
		if($('#facebox').width() < myImage.width)
			faceboxWidth = $('#facebox').width() + myImage.width;
		else if(myImage.width == 0)
			faceboxWidth = $('#facebox').width() / 2;
		else
			adjustWidth = false;
			//faceboxWidth = $('#facebox').width();
		
		//Width adjustment ONLY needs to happen when there is an image
		if(navigator.appVersion.indexOf("MSIE 7.0") == -1 && adjustWidth)
			$('#facebox').css('left', parseInt($('#facebox').css('left')) - (faceboxWidth / 2));
	} else {faceboxHeight = $('#facebox').height();}
	
	$('#facebox').css('top', parseInt($('#facebox').css('top')) - (faceboxHeight / 2));
	clearInterval(repoTimer);
}