function BubbleMessage(title, message) {
	this.title = title;
	this.message = message;
};

BubbleMessage.prototype.bind = function(target) {

	var pos = BubbleMessage.getElementPosition(target);
	var container = document.createElement("div");

	var header = document.createElement("div");
	header.style.verticalAlign = "middle";
	header.innerHTML = this.title;
	var main = document.createElement("div");
	main.innerHTML = this.message;
	var button = document.createElement("img");
	button.src = "/res/delete-gray.gif";
	button.style.position = "absolute";
	button.style.right = "8px";
	button.style.top = "8px";
//	button.style.verticalAlign = "middle";
//	button.style.paddingLeft = "8px";
	header.appendChild(button);

	var icon = document.createElement("img");
	icon.src = "/res/lightbulb.gif";
	icon.style.verticalAlign = "middle";
	icon.style.paddingRight = "8px";

	header.insertBefore(icon, header.firstChild);


	container.appendChild(header);
	container.appendChild(main);

	header.style.backgroundColor = "white";
	header.style.paddingTop = "8px";
	header.style.paddingLeft = "8px";
	header.style.paddingRight = "8px";
	header.style.borderTop = "1px solid gray";
	header.style.borderLeft = "1px solid gray";
	header.style.borderRight = "1px solid gray";
	header.style.textAlign = "left";

	main.style.backgroundColor = "white";
	main.style.paddingLeft = "8px";
	main.style.paddingRight = "8px";
	main.style.paddingBottom = "8px";
	main.style.borderLeft = "1px solid gray";
	main.style.borderRight = "1px solid gray";
	main.style.textAlign = "left";

	container.style.position = "absolute";
	container.style.left = (pos.x + 20) + "px";

	document.body.appendChild(container);
	container.style.top = (pos.y - container.offsetHeight) + "px";

	var footer = document.createElement("div");
	footer.style.backgroundImage = "url(/res/bubble-bottom.gif)";
	footer.style.height = "24px";
	footer.style.width = container.offsetWidth + "px";
	footer.appendChild(document.createTextNode(" "));
	container.appendChild(footer);

//	footer.style.width = main.offsetWidth;

	container.onmouseover = function() {
		button.src = "/res/delete.gif";
	};
	container.onmouseout = function() {
		button.src = "/res/delete-gray.gif";
	};
	container.onclick = function() {
		container.parentNode.removeChild(container);
	};
};
BubbleMessage.getElementPosition = function(elm) {
	var el = elm;
	var ol = el.offsetLeft;
	while ((el=el.offsetParent) != null) { ol += el.offsetLeft; }

	var el = elm;
	var ot = el.offsetTop;
	while((el=el.offsetParent) != null) { ot += el.offsetTop; }

	return {
		x : ol,
		y : ot
		}
};