$(document).ready(
	function ()
	{
		var divelement       = document.getElementById("showHint");
		var divshadowelement = document.getElementById("showHintShadow");
		var cachedGlossaryItems = new Array();
		
		$(document).mousemove(function(ev)
		{
			if (!$(ev.target).hasClass('glossaryHint'))
			{
				divelement.style.display = "none";
				divshadowelement.style.display = "none";
			}
		});

		/* initialize on mouseover */
		$(".glossaryHint").mouseover(function()
			{
				var info;
				var className   = $(this).attr("class").replace("glossaryHint glossaryTerm","");

				info = className.split("-");
				
				var containerId = info[0];
				var languageId  = info[1];
				var url         = "/glossary/ajaxentry/?containerId=" + containerId + "&languageId=" + languageId;

				if (!cachedGlossaryItems[containerId + "-" + languageId])
				{
					$.ajax(
					{
						url: url,
						dataType: "json",
						success: function(result)
						{
							cachedGlossaryItems[containerId + "-" + languageId] = result;
							showGlossaryItem(cachedGlossaryItems[containerId + "-" + languageId]);
						}
					});
				}
				else
				{
					showGlossaryItem(cachedGlossaryItems[containerId + "-" + languageId]);
				}
			}
			/* update position on mousemove */
			).mousemove( function(ev) {
				xMouse = ev.pageX - (divelement.offsetWidth / 2);
				yMouse = ev.pageY + 20;
				divelement.style.left = xMouse + "px";
				divelement.style.top = yMouse + "px";
				divshadowelement.style.left = xMouse + 3 + "px";
				divshadowelement.style.top = yMouse + 3 + "px";
				var newHeight = divelement.offsetHeight;
				var newWidth = divelement.offsetWidth;
				divshadowelement.style.height = newHeight + "px";
				divshadowelement.style.width = newWidth + "px";
			}
		);
		
		function showGlossaryItem(item)
		{
			$("#showHintContent").html("<b>" + item['subject'] + "</b><hr />" + item['intro']);
			var newHeight = divelement.offsetHeight;
			var newWidth = divelement.offsetWidth;
			divshadowelement.style.height = newHeight + "px";
			divshadowelement.style.width = newWidth + "px";
			divelement.style.display = "block";
			divshadowelement.style.display = "block";
		}
});