var displayState;
var popupIntID;

var defaultDuration = 3;
var displayFor = defaultDuration;

var popup;
popup = document.createElement("div");
popup.className = "popup";
document.body.appendChild(popup);

function display(str)
{
   switch(displayState)
   {
   case "init":
      popup.style.display = "block";
      popup.innerHTML = str;
      popup.style.opacity = 0.0;
      displayState = "display";
      break;
   case "display":         
      //var tmp = popup.style.opacity + 0.1;
      popup.style.opacity = popup.style.opacity/1 + 0.1;
      if(popup.style.opacity >= 1 + displayFor/2)
      {
         displayState = "hide";
      }
      break;
   case "hide":
      popup.style.opacity = popup.style.opacity/1 - 0.1;
      if(popup.style.opacity <= 0.1)
      {
         popup.style.display = "none";
         popup.style.opacity = 0;
         clearInterval(popupIntID);
      }
      break;
   }
}
function createPopup(str, duration)
{
   clearInterval(popupIntID);
   displayState = "init";
   displayFor = (duration) ? duration : defaultDuration;
   //if this is an empty string, then hide the current popup
   if(str == "")
      popup.style.display = "none";
   //otherwise, starting displaying the given string
   else
      popupIntID = setInterval(function(){display(str)}, 50);
}