var objDrag = null;
var objAnz = null;
var objLeer = null;
var dragobjekt = null;
var mouseX = 0;
var mouseY = 0;
var offX = 0;
var offY = 0;
var akt_id = 0;
var dragx = 0;
var dragy = 0;
var leer_farbe = "";
IE = document.all&&!window.opera;
DOM = document.getElementById&&!IE;

var css_code = "<style type='text/css'>" +
               "<!--" +
               ".box {" +
               "margin:0;" +
               "border:0;" +
               "}" +
               ".content {" +
               "overflow:auto;" +
               "}" +
               ".leer {" +
               "border:solid 0px;" +
               "background-color:"+leer_farbe+";" +
               "}" +
               "-->" +
               "</style>";

document.write(css_code);

function write_box(id,typ,style,left,top,width,height,padding,bgcol,inhalt) {
  var cont_style = " style='width:100%;padding:"+padding+";background-color:"+bgcol+";";
  var box_style = " style='width:100%;height:20px;background-color:#DEE8F3;";
  var leer_style = "";
  var box_kopf = "";
  var box_fuss = "";

  if(id == "")
    id=0;
  if(typ == "")
    typ = "div";
  if(style == "")
    style = "r";

  if(style.search("r")>=0) {
    box_fuss = "<tr><td class='leer' id='leerfeld_"+id+"'"+leer_style+" width='97%'>&nbsp;</td><td style='font-size:1px; background-image: url(\"images/ecke.png\"); width:20px; height:20px; cursor:se-resize; border:solid 0px;' onmousedown='startSize("+id+");'>&nbsp;</td></tr>";
  }
  
  var jetzt = inhalt.replace(/##!!##/gi, '\n');


  var box_kopf = "<table id='BoxID_"+id+"' class='textarea' cellspacing='0' cellpadding='0'"+box_style+"'>" + box_kopf;

  if(style.search("r")<0)
    cont_style = cont_style + "height:20px;'";
  else
    cont_style = cont_style + "height:"+(300)+"px;'";

  var box_content = "<tr>" +
                    "<td colspan='2' valign='top'>"+
                    "<"+typ+" id='DivID_"+id+"' name='message' class='textarea'"+cont_style+">" +
                    jetzt +
                    "</"+typ+">" +
                    "</td>" +
                    "</tr>";

  box_fuss = box_fuss + "</table>";

  var box = box_kopf + box_content + box_fuss;
  document.write(box);
}



function init(){
  document.onmousemove = doSize;
  document.onmouseup = stopSize;
}


function startSize(id) {
  akt_id = id;

  var boxid = "BoxID_" + id;
  var divid = "DivID_" + id;
  var leerid = "leerfeld_" + id;

  objDrag = document.getElementById(boxid);
  objAnz = document.getElementById(divid);
  objLeer = document.getElementById(leerid);

  offX = mouseX - objDrag.offsetWidth;
  offY = mouseY - objDrag.offsetHeight;
}

function doSize(ereignis) {
  mouseY = (IE) ? window.event.clientY : ereignis.pageY;

  if (objDrag != null) {
    objDrag.style.height = (mouseY - offY) + "px";

    objAnz.style.height = ((mouseY - offY)-20)  + "px";
  }
  if(dragobjekt != null) {
    dragobjekt.style.top = (mouseY - dragy) + "px";
  }
}

function stopSize(ereignis) {
  objDrag = null;
  objAnz = null;
  objLeer = null;
  dragobjekt = null;
}

function closebox(id) {
  var elem = "BoxID_"+id;
  document.getElementById("body").removeChild(document.getElementById(elem));
}

function dragstart(id) {
  var boxid = "BoxID_" + id;
  dragobjekt = document.getElementById(boxid);
  dragx = mouseX - dragobjekt.offsetLeft;
  dragy = mouseY - dragobjekt.offsetTop;
}