/************************************************************************************
 * Created by: Piotr Blaz
 * Created on: 26 Jan 2008
 * Description: Simple popup example. Feel free to copy and modify, do not remove
 *              information about its origin  
 ************************************************************************************/

var popupWindow = new popUp_Obj("");

function popUp_Obj()
{
  this.handle = appenddiv(document.body, "position: absolute; width: 100px; height: 100px; top: 0px; left: 0px; z-index: 999; visibility: hidden");
  this.innerdiv = new innerDiv_Obj(this.handle);
                            
  if (navigator.appName == 'Netscape')
  {
    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = netscapeMouseMove;
  }
  else
  {
    document.body.onmousemove = microsoftMouseMove;
  }

  this.show         = showpopup_method;
  this.hide         = hidepopup_method;
  this.settxt       = settxt_method;
  this.setimg       = setimg_method;
  this.loading      = loading_method;
  this.aligntomouse = aligntomouse_method;
  this.setsize      = setsize_method;
  this.isvisible    = isvisible_method;
  this.mouse_x      = 0;
  this.mouse_y      = 0;
  this.toid         = 0;
  this.img          = null;
  
  this.followmouse = true;
  this.delay = 300;
  this.margin_x = 10;
  this.margin_y = 10;
}

function innerDiv_Obj(parent)
{
  this.parent = parent;
  this.leftdiv;
  this.rightdiv;
  this.topdiv;
  this.bottomdiv;
  this.maindiv;
  this.createinnerDiv = createinnerDiv_method;

   //customize here
  this.pathtographics = "http://www.tuning-tec.pl/img/popup_gadget/";
 
  this.createinnerDiv();
}

function createinnerDiv_method()
{
  appenddiv(this.parent, "position: absolute; top: 0; left: 0; width: 10px; height: 10px; background-image: url("+this.pathtographics+"tl.gif)");
  appenddiv(this.parent, "position: absolute; top: 0; right: 0px; width: 20px; height: 10px; background-image: url("+this.pathtographics+"tr.gif)");
  appenddiv(this.parent, "position: absolute; bottom: 0px; left: 0px; width: 20px; height: 20px; background-image: url("+this.pathtographics+"bl.gif)");
  appenddiv(this.parent, "position: absolute; bottom: 0px; right: 0px; width: 20px; height: 20px; background-image: url("+this.pathtographics+"br.gif)");
  this.topdiv    = appenddiv(this.parent, "position: absolute; top: 0; left: 10px; width: 70px; height: 10px; background-image: url("+this.pathtographics+"t.gif); background-repeat: x-repeat");
  this.bottomdiv = appenddiv(this.parent, "position: absolute; bottom: 0px; left: 10px; width: 70px; height: 20px; background-image: url("+this.pathtographics+"b.gif); background-repeat: x-repeat");
  this.leftdiv   = appenddiv(this.parent, "position: absolute; top: 10px; left: 0; width: 10px; height: 70px; background-image: url("+this.pathtographics+"l.gif); background-repeat: y-repeat");
  this.rightdiv  = appenddiv(this.parent, "position: absolute; top: 10px; right: 0px; width: 20px; height: 70px; background-image: url("+this.pathtographics+"r.gif); background-repeat: y-repeat");
  this.maindiv   = appenddiv(this.parent, "position: absolute; top: 10px; left: 10px; width: 70px; height: 70px; background-color: #959595; overflow: hidden");
}

function appenddiv(hndl, css)
{
  //append div and set style
  var div = document.createElement('div');
  var res = hndl.appendChild(div);
  res.style.cssText = css;
  return res;
}

function showpopup(txt,w,h)
{
  w = w || 100;
  h = h || 100;
  popupWindow.setsize(w,h);
  popupWindow.settxt(txt);
  if (!popupWindow.toid) popupWindow.toid = setTimeout("popupWindow.show()", popupWindow.delay);
}

function showpopupimg(src)
{
  popupWindow.setimg(src);
  if (!popupWindow.toid) popupWindow.toid = setTimeout("popupWindow.loading()", popupWindow.delay);
}

function hidepopup()
{
  if (popupWindow.toid)
  {
    clearTimeout(popupWindow.toid);
    popupWindow.toid = 0;
  }
  else popupWindow.hide();
}

/******************************************************************************/
function aligntomouse_method()
{
  this.handle.style.left = this.mouse_x - popupWindow.margin_x;
  this.handle.style.top  = this.mouse_y - popupWindow.margin_y;
}

function settxt_method(txt)
{
  this.innerdiv.maindiv.innerHTML = txt;
}

function showpopup_method()
{
  this.toid = 0;
  this.aligntomouse();
  this.handle.style.visibility = "visible";
}

function loading_method()
{
  if (this.img != null)
  {
    if (this.img.complete)
    {
      this.setsize(this.img.width, this.img.height);
      this.settxt("<img src='"+this.img.src+"'>");
      this.show();
    }
    else
      this.toid = setTimeout("popupWindow.loading()", this.delay);
  }
  else
    this.toid = 0;
}

function hidepopup_method()
{
  this.handle.style.visibility = "hidden";
}

function setsize_method(w, h)
{
  var css_w = w+"px";
  var css_h = h+"px";
  
  var css_hh = (30+h)+"px";
  var css_ww = (30+w)+"px";

  this.handle.style.width  = css_ww;
  this.handle.style.height = css_hh;

  this.innerdiv.rightdiv.style.height = this.innerdiv.leftdiv.style.height   = this.innerdiv.maindiv.style.height = css_h;
  this.innerdiv.topdiv.style.width    = this.innerdiv.bottomdiv.style.width  = this.innerdiv.maindiv.style.width  = css_w;
}

function setimg_method(src)
{
  this.img = new Image;
  this.img.src = src;
}

function isvisible_method()
{
  if (this.handle.style.visibility == "visible") return true;
  return false;
}
/******************************************************************************/

function microsoftMouseMove()
{
  popupWindow.mouse_x = window.event.clientX + document.body.scrollLeft - parseInt(popupWindow.handle.style.width);
  popupWindow.mouse_y = window.event.clientY + document.body.scrollTop - parseInt(popupWindow.handle.style.height);
  if (popupWindow.isvisible() && popupWindow.followmouse) popupWindow.aligntomouse();
}

function netscapeMouseMove(event)
{
  popupWindow.mouse_x = event.clientX + window.pageXOffset - parseInt(popupWindow.handle.style.width);
  popupWindow.mouse_y = event.clientY + window.pageYOffset - parseInt(popupWindow.handle.style.height);
  if (popupWindow.isvisible() && popupWindow.followmouse) popupWindow.aligntomouse();
}