function sb_window_kit(title, depth) {
 this.underlay = false;
 this.position = null;
 this.depth = depth;
 this.className = '';

 this.append = sb_window_kit_append;

 this.parentWindow = null;
 this.relativeNode = null;
 this.top = this.left = 0;


 var cont = this.cont = document.createElement('div');
 cont.className = 'sb_window';
 cont.style.zIndex = 101 + depth;


 var head = this.head = sb_node(cont, "div");
 head.className = 'head';
 var div = sb_node(head, 'div', title);
 div.className = 'title';


 div = sb_node(head, "div");
 div.className = 'minus';
 var img = sb_node(div, 'img');
 img.src = '/smallbox4/images5/icons/close_small.png';
 img.onclick = function() {escapeClear(this.depth)};

 var errors = this.errors = sb_node(cont, 'div');
 errors.style.display = 'none';
 errors.className = 'error_spot';

 var success = this.success = sb_node(cont, 'div');
 success.style.display = 'none';
 success.className = 'success_spot';
 
 var body = this.body = sb_node(cont, "div");
 body.className = 'body';

}

function sb_window_kit_append() {
 escapeClear(this.depth);

 top   = 10;
 left  =  10;
 width = 500;
 sb_css('/smallbox4/css/window.css');

 if (this.className) {
  this.cont.className += ' ' + this.className;
 }

 if(top && window.scrollY > top) {
  window.scroll(0, top);
 }

 document.body.appendChild(this.cont);

 this.cont.style.display = 'block';
 this.cont.style.visibility = 'visible';

 if (this.parentWindow != null) {
  var top = this.parentWindow.offsetTop + 30;
  var left = this.parentWindow.offsetLeft + 10;
  this.cont.style.top = top  + 'px';
  this.cont.style.left = left + 'px';
 }
 else if (this.relativeNode != null) {
/*
  this.cont.style.top   = pos.top + 'px';
  this.cont.style.left  = pos.left + 'px';
*/
  var pos = getPos(this.relativeNode);
  var left = (pos.left - this.cont.offsetWidth - 20);
  if (left <= 0) {
   this.cont.style.left = (pos.left + 20 + this.relativeNode.offsetWidth) + "px";
  }
  else if(pos.left > 20) {
   this.cont.style.left = left+"px";
  }
  else {
   this.cont.style.left = "0px";
  }
  var top = (pos.top - this.cont.offsetHeight / 2);
  if (top < 25) {
   top = 25;
  }
  this.cont.style.top = (top > 0 ? top : 0) + "px";
 }
 else if (this.position == 'center') {
  var width   = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth;
  var scrollY = document.documentElement.scrollTop;

  this.cont.style.top = this.top + 'px';
  this.cont.style.left = (width - this.cont.offsetWidth) / 2 + 'px';
 }
 else if (this.position == 'middle') {
  var width   = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth;
  var height  = window.innerHeight ? window.innerHeight: document.documentElement.clientHeight;
  var scrollY = document.documentElement.scrollTop;

  this.cont.style.top = (height - this.cont.offsetHeight) / 2 + scrollY + 'px';
  this.cont.style.left = (width - this.cont.offsetWidth) / 2 + 'px';
 }
 else {
  this.cont.style.top   = this.top + 'px';
  this.cont.style.left  = this.left + 'px';
 }

  if (this.underlay == true) {
   var underlay = document.createElement('div');
   underlay.className = 'sb_window_underlay';
   underlay.style.position = 'absolute';
   underlay.style.zIndex = 100;
   underlay.style.backgroundColor = 'black';
   underlay.style.top = 0;
   underlay.style.left = 0;
//   underlay.style.right = 0;
   underlay.style.width = document.body.offsetWidth + 'px';
   underlay.style.height = document.body.offsetHeight + 'px';
   setOpacity(underlay, 75);
   document.body.appendChild(underlay);

   var ref2 = function() {
    document.body.removeChild(underlay);
   }

  escapeNode(this.cont, true, this.depth, ref2);
 }
 else {
  escapeNode(this.cont, true, this.depth);
 }
}

/*************************************/

function sb_window(thisId, id, align, ref, effect) {
 escapeClear(1);
 var win = document.getElementById(id);
 win.style.visibility = 'hidden';
 win.style.display = 'block';

 if (ref) {
  ref = new ref();
 }

 if (ref && ref.open) {
  ref.open();
 }

 if (align == 'center' || align == 'fillY') {
  var width  = document.body.offsetWidth;
//  var height = document.body.offsetHeight;
  var height  = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight;
  var scrollY = document.body.scrollTop ? document.body.scrollTop : document.documentElement.scrollTop;

  var top = (height - win.offsetHeight) / 2 + scrollY;
  win.style.top = (top > 30 ? top : 30) + 'px'; 
  win.style.left = (width - win.offsetWidth) / 2 + 'px'; 
  if (align == 'fillY') {
   var bodyId, headId;
   var fillHeight = (window.innerHeight ? window.innerHeight: document.documentElement.clientHeight) - 60;

   win.style.maxHeight = fillHeight + 'px';
   if (bodyId = document.getElementById(id+'_body')) {
    headId =  document.getElementById(id+'_head');
    bodyId.style.maxHeight = (fillHeight - headId.offsetHeight - 15) + 'px';
    bodyId.style.overflow = 'auto';
   }
  }
 }
 else {
  pos = getPos(thisId);
  var left = (pos.left - win.offsetWidth - 20);
  if (left <= 0) {
   win.style.left = (pos.left + 20 + thisId.offsetWidth) + "px";
  }
  else if(pos.left > 20)
   win.style.left = left+"px";
  else
   win.style.left = "0px";
  var top = (pos.top - win.offsetHeight / 2);
  win.style.top = (top > 0 ? top : 0) + "px";
  escapeNode(win);
 }

 var display_underlay = function() {
  var underlay = document.createElement('div');
  underlay.className = 'sb_window_underlay';
  underlay.style.position = 'absolute'; 
  underlay.style.zIndex = 100;
  underlay.style.backgroundColor = 'black';
  underlay.style.top = 0;
  underlay.style.left = 0;
  underlay.style.right = 0;
  underlay.style.height = document.body.offsetHeight + 'px';
  setOpacity(underlay, 60);
  document.body.appendChild(underlay);
 
  var ref2 = function() {
   if (ref && ref.close) {
    ref.close();
   }
   document.body.removeChild(underlay);
  }
  escapeNode(win, null, null, ref2);
 }

 var count = 0;
 var cont;
 var top  = parseInt(win.style.top)  + win.offsetHeight / 2;
 var left = parseInt(win.style.left) + win.offsetWidth /  2;
 var open_effect = function() {
  if (count == 0) {
   cont = document.createElement('div');
   cont.className = 'sb_window_effect';
   cont.style.top  = top  + 'px';
   cont.style.left = left + 'px';
   document.body.appendChild(cont);
  }

  if (count < 5) {
   count++
   var width  = Math.floor(win.offsetWidth * ( count / 20)) 
   var height = Math.floor(win.offsetHeight * ( count / 20));

   cont.style.width  =  width  + 'px';
   cont.style.height =  height + 'px'
   cont.style.top  = top  -  height / 2 + 'px';
   cont.style.left = left -  width / 2 + 'px';
   setTimeout(open_effect, 50);
  }
  else {
   document.body.removeChild(cont);
   count = 0;
   if (align == 'center' || align == 'fillY') {
    display_underlay();
   }
   win.style.visibility = 'visible';
  }
 }
 
 if (effect) {
  open_effect();
 }
 else {
  if (align == 'center' || align == 'fillY') {
   display_underlay();
  }
  win.style.visibility = 'visible';
 }
}



