var timerId = null;

function prepareShowAlt(event) {
  if (!event.element()._title) {
    return false;
  }

  var altDiv = $('altDiv');
  var altDivContent = $('altDivContent');
  altDiv.style.left = Math.min(event.pointerX() + 10, $(document.body).getWidth() - 202) + 'px';
  altDiv.style.top = event.pointerY() + 'px';
  altDiv.contentWindow.document.body.innerHTML = event.element()._title;
  altDivContent.innerHTML = event.element()._title;
  if (this._title.length > 30) {
    altDiv.style.width = 200 + 8 + 'px';
    altDivContent.style.width = 200 + 'px';
  } else {
    altDiv.style.width = '';
    altDivContent.style.width = '';
  }
  var windowHeight = $(window).innerHeight;
  if ('undefined' == typeof windowHeight) {
        windowHeight = $(document.body).offsetHeight;
  }
  var altDivHeight = altDivContent.getHeight() + 10;
  altDiv.style.height = altDivHeight + 'px';
  if (event.clientY + altDivHeight > windowHeight
            && event.clientY- altDivHeight >=0) {
      altDiv.style.top = event.pointerY() - altDivHeight + 'px';
  } else {
      altDiv.style.top = event.pointerY() + 'px';
  }
  
  timerId = setTimeout(altDiv.show.bind(altDiv), 500);
}

function hideAlt(event) {
  clearTimeout(timerId);
  var altDiv = $('altDiv');
  //altDiv.hide();
  altDiv.style.display = 'none';
  //altDiv.innerHTML = '';
  altDiv.style.left = -100 + 'px';
  altDiv.style.top = -100 + 'px';
}

function initAlts() {
  $A(document.getElementsByClassName('altTitle')).each(function(item) {
    if (item.title.length > 0) {
      if (item.title.slice(0,1) == '#') {
        item._title = $(item.title.slice(1)).innerHTML;
      } else {
        item._title = '<p>' + item.title + '</p>';
      }

      item.title = '';
      $(item).observe('mouseover', prepareShowAlt);
      $(item).observe('mouseout', hideAlt);
    }
  });
}