function DocumentPanel() {
	var previousPanel;

	function getWindowWidth() {
		if (window.innerWidth) {
			return window.innerWidth;
		}
		return document.body.clientWidth;
	}
	function getWindowHeight() {
		if (window.innerHeight) {
			return window.innerHeight;
		}
		return document.body.clientHeight;
	}

	function mouseX(e) {
		if (e.pageX) {
			return e.pageX;
		}
		return e.clientX + (document.documentElement.scrollLeft ?
			document.documentElement.scrollLeft : document.body.scrollLeft);
	}
	function mouseY(e) {
		if (e.pageY) {
			return e.pageY;
		}
		return e.clientY + (document.documentElement.scrollTop ?
			document.documentElement.scrollTop : document.body.scrollTop);
	}

	DocumentPanel.prototype.display = function (e, o) {
		var windowWidth = getWindowWidth();
		var windowHeight = getWindowHeight();

		o = document.getElementById(o);

		if (previousPanel && previousPanel != o)
			previousPanel.style.visibility = 'hidden';

		if (o.style.visibility == 'visible')
			o.style.visibility = 'hidden';
		else {
			var ew, eh;

			if (o.offsetWidth) {
				ew = o.offsetWidth;
			}
			else if (o.clip.Width) {
				ew = o.clip.width;
			}

			if (o.offsetHeight) {
				eh = o.offsetHeight;
			}
			else if (o.clip.Height) {
				eh = o.clip.height;
			}

			var x = mouseX(e) - (ew / 4);
			var y = mouseY(e) + 16;			

			if (x < 2) {
				x = 2;
			}
			else if (x + ew > windowWidth) {
				x = windowWidth - ew - 4;
			}

			if (y + eh > windowHeight) {
				y = windowHeight - eh - 4;
			}

			o.style.left = x + 'px';
			o.style.top = y + 'px';
			o.style.visibility = 'visible';

			previousPanel = o;
		}
	}

	DocumentPanel.prototype.close = function () {
		if (previousPanel)
			previousPanel.style.visibility = 'hidden';
	}
}

function updateFootnote(id) {
	var element = document.getElementById(id);
	var footnote = document.getElementById('footnote');

	footnote.innerHTML = element.innerHTML;
}

var documentPanel = new DocumentPanel();
var commentPanel = new DocumentPanel();