var balloon = null;
var balloonText = null;
var balloonWidth = 250;

function getBody() {
  return document.getElementsByTagName('body')[0]
}

function addClickEvent(obj, lambda) {
  if (obj.addEventListener)
    obj.addEventListener('click', lambda, true);
  else
    obj.onclick = lambda;
}

function newCloseButton() {
  closeButton = document.createElement('div');
  closeButton.appendChild(document.createTextNode("Close"));
  closeButton.style.fontSize = '8pt';
  closeButton.style.fontStyle = 'italic';
  closeButton.style.paddingTop = '5px';
  closeButton.style.color = '#00a';
  closeButton.style.cursor = 'pointer';
  closeButton.style.textAlign = 'right';
  addClickEvent(closeButton, function (ev) {hideBalloon(ev);});
  return closeButton;
}

function newBalloon() {
  balloon = document.createElement('div');
  balloon.className = 'balloon balloon_ptr';
  balloon.style.position = 'absolute';
  balloon.style.width = balloonWidth + 'px';
  balloon.style.display = 'none';
  balloonText = document.createElement('div');
  balloonText.className = 'balloon_ptr'
  balloonText.appendChild(document.createTextNode("I'm a balloon"))
  balloon.appendChild(balloonText);
  balloon.appendChild(newCloseButton());
  body = getBody();
  body.insertBefore(balloon, body.firstChild);
  addClickEvent(window.document, function (ev) {toggleBalloon(ev);});
}

function toggleBalloon(event) {
  ev = (event) ? event : window.event;
  t = (ev.srcElement) ? ev.srcElement : ev.target;
  if (t.getAttribute('balloon') != null) {
    maxX = (event) ? document.width : window.screen.width;
    curX = ((event) ? ev.pageX : ev.x)
    diffX = (maxX - curX);
    if (diffX < balloonWidth) {
      curX = curX - (balloonWidth - diffX);
    }
    balloon.style.display = '';
    balloon.style.top =  ((event) ? ev.pageY : ev.y) - 15;
    newX = ((curX - 50) < 0) ? curX : curX - 50;
    balloon.style.left = newX;
    balloon.style.zIndex = 100000;
    message = t.getAttribute('balloon');
    if (message.indexOf(' ') == -1)
      message = document.getElementById(message).innerHTML;
    balloonText.innerHTML = message;
  } else {
    hideBalloon(ev);
  }
}

function hideBalloon(ev) {
  balloon.style.display = 'none';
}