/*
 * Copyright 2008 Liquid Amber Inc.
 *
 * JavaScript functions for Hover Previews
 *
 */

/*
 * Constructor
 */
function UnsnHoverPreviews() {

	// Current mouse coordinates
	this.mouseX = 0;
	this.mouseY = 0;

	// Create a mousemove event so we can track mouse position.
	// This will be used for the hover previews.  Note that we can't directly refer to the current
	// object as "this" inside the anonymous callback.
	var thisObject = this;
	$().mousemove(function(event){
		thisObject.mouseX = event.pageX;
		thisObject.mouseY = event.pageY;
	});
}

/* 
 * Private showPreview -- real work happens here
 */
UnsnHoverPreviews.prototype._showPreview = function(index, preview, footerHtml) {

	// Don't fire twice for the same index, which can happen if the mouse pointer is moved too swiftly
	// and multiple instances of _showPreview() are queued up. When this happens the preview flickers
	// unpleasantly while all these instances fire.  Only show if the passed index equals the most recently
	// processed by showPreview();
	if (index != pendingIndex) return;

	// Don't fire if the mouse has already moved outside of the thumbnail container.
	// This cannot be adequately handled with the onmouseout event because of the delay between
	// the onmouseover event and when this function is invoked.
	var containerX = $("#container" + index).offset().left;
	var containerY = $("#container" + index).offset().top;
	if (this.mouseX < containerX || this.mouseX > containerX + 80 || 
	    this.mouseY < containerY || this.mouseY > containerY + 96) 
	    return;

	// Inner HTML
	var href = preview.detailUrl;
	// Note that we ignore image url sent by the server and used the cached url that is already
	// in the browser cache.
	var html = 
		'<div style="height:176px;">' +
		'<a href="' + href + '"><img src="' + preview.image.url + '" height="' + preview.image.h + '" width="' + preview.image.w + '"/></a>' +
		'</div>';

	html += '<div class="preview-footer">' + footerHtml + '</div>';
	$("div#hover-preview").html(html);

	// Calculate the coordinates for the hover preview
	// We have to account for the variable coordinates of the outer-most div#doc2
	// which depends on the width of the browser window.
	var left = containerX - 50 - $('#doc2').offset().left;
	var top = containerY - 62 - $('#doc2').offset().top;
	$("div#hover-preview").css({"top":top,"left":left});
	
	// Reset the pending index.  Otherwise the same preview won't fire two times in a row, which is a problem
	// if the thumbnail is on the perimeter and can be reentered without any other previews being triggered.
	pendingIndex = pendingOejct = null;
	
	// Show the hover-preview div
	$("div#hover-preview").fadeIn(500);
}
	
/*
 * Public showPreview 
 */
UnsnHoverPreviews.prototype.showPreview = function(index, preview, footerHtml) {
	// Save index in global variable.
	pendingIndex = index;
	
	// We use jQuery's hover function, which ignores mouseout events fired by descendants.
	$("div#hover-preview").hover(
		function(event) { /* do nothing on mousein */} ,
		function(event) { $(this).hide(); }
	);

	// set _showPreview() to fire with some delay.  Because it's called inside by an anonymous
	// callback, we can't refer to the UnsnHoverPreviews object as "this" inside the anonymous
	// callback, so we have to save it in the local variable and make it available via closure. 
	var thisObject = this;
	setTimeout(function() {thisObject._showPreview(index, preview, footerHtml);}, 500);
}