Array.prototype.popToTop = function (fromi) {
  //slice
  //pop
  //concat
  //push
}

document.zStack = new Array(); //tähän popuppien z-pino

function sortZStack (popup) {
  if (popup) document.zStack.popToTop(popup.getZ());
  for (var z = 0; z < document.zStack.length; z++) { document.zStack[z].setZ(z); }
}

function Popup( p ) {
  var title = "Popup";
  if (p && p.title) title = p.title;

  var w = 320;
  if (p && p.w) w = p.w;

  var h = 200;
  if (p && p.h) h = p.h;

  this.aDiv = newElement( 'div',{ className:'popup', style:{width:w+'px',height:h+'px'}});
  this.bDiv = newElement( 'div',{ className:'container' });
  this.cDiv = newElement( 'div',{ className:'content', style:{width:(w-2)+'px',height:(h-48)+'px'}});
  this.dDiv = newElement( 'div',{ style:{ position:'absolute', bottom:'0px', left:'0px' }});

  //content node
  if (p && p.cNode) this.cDiv.appendChild(p.cNode);
 
  //dragbar
  this.dBtn = newElement( 'button', 
    { className:'titlebar', innerHTML:title, parent:this, onmousedown:function(e){ this.parent.xevt('drag',e) },
      style:{ position:'absolute', left:'0px', top:'0px', width:'100%' } });
  this.bDiv.appendChild(this.dBtn);
  
  //closebutton
  this.cBtn = newElement( 'button', 
    { className:'close', innerHTML:'<img src="/pics/contentmanager/editor/close.gif"/>', parent:this, onclick:function(){ this.parent.close() },
      style:{ position:'absolute', right:'0px', top:'0px' } });
  this.bDiv.appendChild(this.cBtn);
  
  //resizebutton
  if (p && p.resize) {
    this.sBtn = newElement( 'button', 
      { className:'resize', innerHTML:'<img src="/pics/contentmanager/editor/resize.gif"/>', parent:this, onmousedown:function(e){ this.parent.xevt('size',e) },
        style:{ position:'absolute', right:'0px', bottom:'0px' }});
    this.bDiv.appendChild(this.sBtn);
  }
  
  this.bDiv.appendChild(this.cDiv);
  this.bDiv.appendChild(this.dDiv);
  this.aDiv.appendChild(this.bDiv);
  this.buttons = []; //custom buttons
  
  //plex-taso
  this.plex = newElement( 'div', { className:'plex' } );
}

Popup.prototype.addButton = function ( text, method ) {
  var newButton = newElement( 'button',{ innerHTML:text, onclick:function(){ eval(method)} } );
  this.dDiv.appendChild(newButton);
  this.buttons.push(newButton);
}

Popup.prototype.open = function ( p ) {
  if (p && p.w && p.h) this.setSize(p);
  if (p && p.x && p.y) this.setXY(p);
  this.aDiv.style.zIndex = 100;
  this.plex.style.zIndex = 99;
  document.body.appendChild(this.aDiv);
  this.center();
}

Popup.prototype.close = function () {
  document.body.removeChild(this.aDiv);
}

Popup.prototype.destroy = function () {
  //tuhoa elementit ja vapauta objekti
}

Popup.prototype.getZ = function () {
  return parseInt(this.aDiv.style.zIndex);
}

Popup.prototype.setZ = function (z) {
  this.aDiv.style.zIndex = z;
}

Popup.prototype.xevt = function (xmode,e) {
  this.plex.style.width = document.documentElement.clientWidth+"px";
  this.plex.style.height = document.documentElement.clientHeight+"px";
  document.body.appendChild(this.plex);

  document.xtgt = this;
  if (xmode == 'size')
    document.xmode = function(){document.xtgt.doResize()};
  else
    document.xmode = function(){document.xtgt.doDrag()};

  if (e) document.mouse = { x:e.pageX, y:e.pageY, ax:0, ay:0 }
  else document.mouse = { x:window.event.clientX, y:window.event.clientY, ax:0, ay:0 }
  
  document.onmousemove = function (e) {
    document.mouse.lx = document.mouse.x;
    document.mouse.ly = document.mouse.y;
    if (e) {
      document.mouse.x = e.pageX; 
      document.mouse.y = e.pageY;
    } else {
      document.mouse.x = window.event.clientX; 
      document.mouse.y = window.event.clientY;
    }
    document.mouse.ax = document.mouse.x - document.mouse.lx;
    document.mouse.ay = document.mouse.y - document.mouse.ly;
    
    document.xmode();
  };
  
  document.onmouseup = function() {
    document.body.removeChild(document.xtgt.plex);
    document.mouse = null;
    document.onmousemove = null;
    document.onmouseup = null
    document.xtgt = null;
  };
}

Popup.prototype.doResize = function () {
  var p = this.getSize();
  p.w += document.mouse.ax;
  p.h += document.mouse.ay;
  this.setSize(p);
}

Popup.prototype.doDrag = function () {
  var p = this.getXY();
  p.x += document.mouse.ax;
  p.y += document.mouse.ay;
  this.setXY(p);
}

Popup.prototype.setXY = function ( p ) {
  this.aDiv.style.top = p.y+"px";
  this.aDiv.style.left = p.x+"px";
}

Popup.prototype.getXY = function () {
  return {x:parseInt(this.aDiv.offsetLeft), y:parseInt(this.aDiv.offsetTop)};
}

Popup.prototype.setSize = function ( p ) {
  if (p.w < 320) p.w = 320;
  if (p.h < 200) p.h = 200;
  this.aDiv.style.width = p.w+"px";
  this.aDiv.style.height = p.h+"px";
  this.cDiv.style.width = (p.w-2)+"px";
  this.cDiv.style.height = (p.h-48)+"px";
}

Popup.prototype.getSize = function () {
  return {w:parseInt(this.aDiv.style.width), h:parseInt(this.aDiv.style.height)};
}

Popup.prototype.setDepth = function ( d ) {
  this.aDiv.style.zIndex = d;
}

Popup.prototype.getDepth = function () {
  return(this.aDiv.style.zIndex);
}

Popup.prototype.center = function () {
  this.setXY( {x:parseInt((document.documentElement.clientWidth - this.aDiv.offsetWidth)/2),
               y:parseInt(((document.documentElement.clientHeight - this.aDiv.offsetHeight)/2)+document.documentElement.scrollTop)});
}

function newElement( type, propertyObject )
{
  var e,p,s;
  e = document.createElement(type);
  for(p in propertyObject) {
    if (p == 'style')
      for(s in propertyObject[p])
        e[p][s] = propertyObject[p][s];
    else
      e[p] = propertyObject[p];
  }
  return e;
}