// JavaScript Document
function init_element(id) {

  // zum verschieben
  document.getElementById(id+"_dragger").onmousedown = mdown;

  // fuer das menue
  document.getElementById(id+"_msb").onclick = set_werte;
  document.getElementById(id+"_mcab").onclick = toggle_menue;
  document.getElementById(id+"_mreb").onclick = remove_element;
  document.getElementById(id+"_ncontbgc").onclick = showcp;
  document.getElementById(id+"_ntitlebgc").onclick = showcp;
  document.getElementById(id+"_nbcolor").onclick = showcp;
  document.getElementById(id+"_ntitlefc").onclick = showcp;

  // wenn es eine Textbox ist
  if(document.getElementById(id+"_text")){
    document.getElementById(id+"_mbtn").onclick = toggle_menue;
    document.getElementById(id+"_text").ondblclick = toggle_text_edit;
    document.getElementById(id+"_tsb").onclick = set_text;
    document.getElementById(id+"_tcb").onclick = toggle_text_edit;
    document.getElementById(id+"_ntextfc").onclick = showcp;

  }else{

  // wenn es eine Bildbox ist
  if(document.getElementById(id+"_bild")){
    document.getElementById(id+"_mbtn").onclick = toggle_menue;
    document.getElementById(id+"_wbild").onclick = toggle_bild_edit;
    document.getElementById(id+"_babbr").onclick = toggle_bild_edit;
  }

  // wenn es eine Linkbox ist  
  else{
    document.getElementById(id+"_mbtn").onclick = toggle_menue;
    if(document.getElementById(id+"_addl")){
      document.getElementById(id+"_addl").onclick = add_link;
      for(var i = 0; i < document.getElementById(id+"_content").childNodes.length-1; i++){
        bid = document.getElementById(id+"_content").childNodes[i].id;
        document.getElementById(bid+"_bmdragger").onmousedown = mdown_bm;
        document.getElementById(bid+"_mbtn").onclick = toggle_book_menue;
        document.getElementById(bid+"_msb").onclick = set_book_werte;
        document.getElementById(bid+"_mcab").onclick = toggle_book_menue;
        document.getElementById(bid+"_mrem").onclick = remove_book;
        document.getElementById(bid+"_nbmlc").onclick = showcp;
        document.getElementById(bid+"_nbmfc").onclick = showcp;
      }
    }
  }}
}

function fill_height_array(){

  glob_height["c_td1"] = new Array();
  glob_height["c_td2"] = new Array();
  glob_height["c_td3"] = new Array();
  
  glob_lbh["c_td1"] = new Array();
  glob_lbh["c_td2"] = new Array();
  glob_lbh["c_td3"] = new Array();

  

  for (var i = 0; i < document.getElementById("c_td1").childNodes.length; i++){

    if(i==0){
      glob_height["c_td1"].push(215+Math.floor(document.getElementById("c_td1").childNodes[i].offsetHeight/2)+5);
    }else{
      glob_height["c_td1"].push(glob_height["c_td1"][i-1] + Math.floor(document.getElementById("c_td1").childNodes[i-1].offsetHeight/2) + Math.ceil(document.getElementById("c_td1").childNodes[i].offsetHeight/2)+5);
    }
   
    if(
      (document.getElementById("c_td1").childNodes[i].hasChildNodes()) &&
      (document.getElementById("c_td1").childNodes[i].lastChild.hasChildNodes()) &&
      (document.getElementById("c_td1").childNodes[i].lastChild.lastChild.innerHTML == "neues Lesezeichen erstellen")
    ){
    
      lbarray = new Array();
      lbarray.push(document.getElementById("c_td1").childNodes[i].id);
      
      if(i==0){
        lbarray.push(215+5);
      }else{
        lbarray.push(glob_height["c_td1"][i-1] + Math.floor(document.getElementById("c_td1").childNodes[i-1].offsetHeight/2) + 5);
      }
      
      lbarray.push(document.getElementById("c_td1").childNodes[i].offsetHeight);

      for (var j = 0; j < document.getElementById("c_td1").childNodes[i].childNodes[1].childNodes.length; j++){
        lbarray.push(document.getElementById("c_td1").childNodes[i].childNodes[1].childNodes[j].offsetHeight);
      }
      glob_lbh["c_td1"].push(lbarray);      

    }
  }
  
  for (var i = 0; i < document.getElementById("c_td2").childNodes.length; i++){
    if(i==0){
      glob_height["c_td2"].push(215+Math.floor(document.getElementById("c_td2").childNodes[i].offsetHeight/2)+5);
    }else{
      glob_height["c_td2"].push(glob_height["c_td2"][i-1] + Math.floor(document.getElementById("c_td2").childNodes[i-1].offsetHeight/2) + Math.ceil(document.getElementById("c_td2").childNodes[i].offsetHeight/2)+5);
    }

    if(
      (document.getElementById("c_td2").childNodes[i].hasChildNodes()) &&
      (document.getElementById("c_td2").childNodes[i].lastChild.hasChildNodes()) &&
      (document.getElementById("c_td2").childNodes[i].lastChild.lastChild.innerHTML == "neues Lesezeichen erstellen")
    ){
      
      lbarray = new Array();
      lbarray.push(document.getElementById("c_td2").childNodes[i].id);
      
      if(i==0){
        lbarray.push(215+5);
      }else{
        lbarray.push(glob_height["c_td2"][i-1] + Math.floor(document.getElementById("c_td2").childNodes[i-1].offsetHeight/2) + 5);
      }
      
      lbarray.push(document.getElementById("c_td2").childNodes[i].offsetHeight);

      for (var j = 0; j < document.getElementById("c_td2").childNodes[i].childNodes[1].childNodes.length; j++){
        lbarray.push(document.getElementById("c_td2").childNodes[i].childNodes[1].childNodes[j].offsetHeight);
      }
      glob_lbh["c_td2"].push(lbarray);      
    }    
  }
  
  for (var i = 0; i < document.getElementById("c_td3").childNodes.length; i++){
    if(i==0){
      glob_height["c_td3"].push(215+Math.floor(document.getElementById("c_td3").childNodes[i].offsetHeight/2)+5);
    }else{
      glob_height["c_td3"].push(glob_height["c_td3"][i-1] + Math.floor(document.getElementById("c_td3").childNodes[i-1].offsetHeight/2) + Math.ceil(document.getElementById("c_td3").childNodes[i].offsetHeight/2)+5);
    }
    
    if(
      (document.getElementById("c_td3").childNodes[i].hasChildNodes()) &&
      (document.getElementById("c_td3").childNodes[i].lastChild.hasChildNodes()) &&
      (document.getElementById("c_td3").childNodes[i].lastChild.lastChild.innerHTML == "neues Lesezeichen erstellen")
    ){      
    
      lbarray = new Array();
      lbarray.push(document.getElementById("c_td3").childNodes[i].id);
      
      if(i==0){
        lbarray.push(215+5);
      }else{
        lbarray.push(glob_height["c_td3"][i-1] + Math.floor(document.getElementById("c_td3").childNodes[i-1].offsetHeight/2) + 5);
      }
      
      lbarray.push(document.getElementById("c_td3").childNodes[i].offsetHeight);

      for (var j = 0; j < document.getElementById("c_td3").childNodes[i].childNodes[1].childNodes.length; j++){
        lbarray.push(document.getElementById("c_td3").childNodes[i].childNodes[1].childNodes[j].offsetHeight);
      }
      glob_lbh["c_td3"].push(lbarray);      
    }    
  }
}


function init() {
  
  window.onresize = set_window_size;
  document.onmouseup = mup;
  document.onmousemove = mmove;
  glob_width = document.getElementById("c_td1").offsetWidth;
  set_window_size();
  fill_height_array();
  create_color_picker();
  document.getElementById("sitebg").onclick = showcp;
}

function set_window_size(){

  bwidth = document.getElementById("idexbody").offsetWidth;
  bheight = document.getElementById("site_header").offsetHeight + document.getElementById("conttbl").offsetHeight;

  if(bwidth>=1280){
    cwidth=1280;
  }else{
    if(bwidth<800){
      cwidth=800;
    }else{
      cwidth = bwidth;
    }
  }
  document.getElementById("site_header").style.width = cwidth-20+'px';
  document.getElementById("site_content").style.width = cwidth-20+'px'; 
  document.getElementById("conttbl").style.width = cwidth-20+'px';

  document.getElementById("filler").style.width =  cwidth-40+'px';
  document.getElementById("conttbl2").style.width =  cwidth-40+'px';
  document.getElementById("site_footer").style.width = cwidth-80+'px';
  glob_width = document.getElementById("c_td1").offsetWidth;
  
  // Bilder resizen
  //var test = eval(document.getElementById("c_td1").childNodes.length);

  for (var i = 0; i < document.getElementById("c_td1").childNodes.length; i++){
    set_bild_size(document.getElementById("c_td1").childNodes[i].id);
  } 
  for (var i = 0; i < document.getElementById("c_td2").childNodes.length; i++){
    set_bild_size(document.getElementById("c_td2").childNodes[i].id);
  } 
  for (var i = 0; i < document.getElementById("c_td3").childNodes.length; i++){
    set_bild_size(document.getElementById("c_td3").childNodes[i].id);
  } 

  resize_load(bwidth,bheight);
}

function mdown(e){

  // Der MouseDown-Handler setzt die Variable drag auf
  // "aktiv" und bestimmt die aktuelle Mausposition.

  aktivX = (e) ? e.pageX :
          event.clientX + document.body.scrollLeft;
  aktivY = (e) ? e.pageY :
          event.clientY + document.body.scrollTop;
  
  // Spalte und Zeile bestimmen
  col_old = get_col();
  row_old = get_row_click(col_old);
  
  // Object ID Bestimmen
  var e2 = (window.event)? window.event: e;
  objSrc = (e2.target)? e2.target : e2.srcElement;
  clicked = objSrc.id; //tdx_dragger
  aktiv_div = clicked.substr(0,clicked.length-8);
  dragged_div = aktiv_div;
  
//    alert (aktiv_div);
  
  if (document.getElementById(aktiv_div)){
    
    //hoehe er mitteln
    h = document.getElementById(aktiv_div).offsetHeight;
    
    //div aushaengen
    release_item(col_old,aktiv_div,h);
    
    //aktives div auf die kopie setzen
    aktiv_div="move_div";
    
    //platzhalter einhaengen
    insert_platzhalter(col_old,row_old,h);
    
    // Werte fuer das move_div setzen
    div_hdl = document.getElementById("movediv");
    div_hdl.style.left = aktivX-Math.floor(glob_width/2)+'px';
    div_hdl.style.top = aktivY-20+'px';
    div_hdl.style.width = glob_width+'px';
    drag = "aktiv";
  } 
}

function mmove(e){

  // Im MouseMove-Handler passiert nur etwas, wenn drag auf
  // "aktiv" steht:

  if (drag == "inaktiv") return;
  
  // Jetzt wird die neue Mausposition gemessen:
  var neuX = (e) ? e.pageX :
            event.clientX + document.body.scrollLeft;
  var neuY = (e) ? e.pageY :
            event.clientY + document.body.scrollTop;
  
  // ...der Abstand zur vorherigen Position berechnet:
  var distX = (neuX-aktivX);
  var distY = (neuY-aktivY);
  
  // ...die neue Position in den globalen Variablen
  // gespeichert:
  aktivX = neuX;
  aktivY = neuY;

  // DIV Verschieben
  if (document.layers) { // Netscape 4
    document.getElementById("movediv").left += distX;
    document.getElementById("movediv").top += distY;
  }
  else {
    document.getElementById("movediv").style.left = parseInt(document.getElementById("movediv").style.left) + distX+'px';
    document.getElementById("movediv").style.top = parseInt(document.getElementById("movediv").style.top) + distY+'px';
  }

  col_new = get_col();

  // nur beim Schieben von boxen
  if (drag=="aktiv"){
    //Spaltenwechsel abfangen
    if(col_old!=col_new){
      //platzhalter loeschen
      remove_platzhalter(col_old);
      
      col_old = col_new;
      row_old = get_row_click(col_old);
      
      //platzhalter einhaengen
      insert_platzhalter(col_old,row_old,h);
      
      fill_height_array();
      
    }else{
      //Zeilenwechsel abfangen
      if(row_old!=get_row(col_old,row_old)){
  
        //platzhalter loeschen
        remove_platzhalter(col_old);
  
        row_old=get_row(col_old,row_old);     
  
        //platzhalter einhaengen
        insert_platzhalter(col_old,row_old,h);
  
        fill_height_array();
      }
    }
  } else if (drag=="aktiv_bm"){
  
    new_bmpid = get_bmpid(col_new);
    if(new_bmpid!=0){
      bmpid = new_bmpid;
    }
  }
}

function mup(e){

  // was wurde bewegt
  if (drag=="aktiv"){
    bmf = 1;
  }else{
    if (drag=="aktiv_bm"){
      bmf = 2;
    }else{
      bmf = 0;
    }
  }
  // onmouseup drag auf "inaktiv"
  drag = "inaktiv";

  if (aktiv_div == "keins"){
    return;
  } 
  
  if (bmf==1){
    show_load();  

    //platzhalter loeschen
    remove_platzhalter(col_old);
    
      //move_div wieder einhaengen
      insert_item(col_old,row_old,dragged_div);
      
      fill_height_array();
  
      //Werte fuer das neue eingehaengte div setzen
      div_hdl = document.getElementById(dragged_div);
      div_hdl.style.position = 'relative';
      div_hdl.style.top = '0px';
      div_hdl.style.left = '0px';
    
      //eventhandler fuer das neu eingehaengte div setzen
      init_element(dragged_div);
  
      // Elementeposition in DB aktualisieren ,onSuccess: function(reponse) {alert(reponse.responseText);}
      new Ajax.Request(relpath+"inc/php/ajax.php",{method: 'post', parameters:{sid:sid,aktion:'set_pos',eid:dragged_div,zeile:row_old,spalte:col_old},onSuccess: function(reponse) {eval(reponse.responseText);}});
  }
  
  if (bmf==2){
    show_load();  
    insert_bm(bmpid,dragged_div);
    fill_height_array();
    var bmpid2 = bmpid.substr(0,bmpid.lastIndexOf('_'));
    
    // Elementeposition in DB aktualisieren ,onSuccess: function(reponse) {alert(reponse.responseText);}
    new Ajax.Request(relpath+"inc/php/ajax.php",{method: 'post', parameters:{sid:sid,aktion:'set_bookpos',eid:dragged_div,pid:bmpid2,pos:gbp},onSuccess: function(reponse) {eval(reponse.responseText);}});
  }
  
  aktiv_div = "keins";
  document.getElementById("movediv").style.top = '0px';
  document.getElementById("movediv").style.left = '0px';
  
}

function mdown_bm(e){

  // Der MouseDown-Handler setzt die Variable drag auf
  // "aktiv" und bestimmt die aktuelle Mausposition.

  aktivX = (e) ? e.pageX :
          event.clientX + document.body.scrollLeft;
  aktivY = (e) ? e.pageY :
          event.clientY + document.body.scrollTop;
  
  // Spalte und Zeile bestimmen
//  col_old = get_col();
//  row_old = get_row_click(col_old);

  // Object ID Bestimmen
  var e2 = (window.event)? window.event: e;
  objSrc = (e2.target)? e2.target : e2.srcElement;
  clicked = objSrc.id; 
  aktiv_div = clicked.substr(0,clicked.lastIndexOf('_'));
  dragged_div = aktiv_div;

  // ID des elternknoten ermitteln
  bmpid = document.getElementById(aktiv_div).parentNode.id;

//    alert (aktiv_div);
  
  if (document.getElementById(aktiv_div)){

    //hoehe er mitteln
    h = document.getElementById(aktiv_div).offsetHeight;
    
    //div aushaengen
    release_bm(bmpid,aktiv_div,h);
    
    //aktives div auf die kopie setzen
    aktiv_div2="move_div";
    
    //platzhalter einhaengen
//    insert_platzhalter(col_old,row_old,h);
    
    // Werte fuer das move_div setzen
    div_hdl = document.getElementById("movediv");
    div_hdl.style.left = aktivX-10 +'px';
    div_hdl.style.top = aktivY-11 +'px';
    div_hdl.style.width = glob_width-20 + 'px';
    drag = "aktiv_bm";
  } 
}

function release_item(spalte_id,item_id,h){

  //clonen des gewaehlten
  div_copy = document.getElementById(item_id).cloneNode(true);

  //umbenennen des gewaehlten
  div_copy.setAttribute("id", "move_div");

  
  //gewaehltes in den container kopieren 
  document.getElementById("movediv").appendChild(div_copy);

  //gewaehltes aus dem alten baum entfernen   
  document.getElementById(spalte_id).removeChild(document.getElementById(item_id));

}

function release_bm(box,item_id,h){

  //clonen des gewaehlten
  div_copy = document.getElementById(item_id).cloneNode(true);

  //umbenennen des gewaehlten
  div_copy.setAttribute("id", "move_div");
  
  //gewaehltes in den container kopieren 
  document.getElementById("movediv").appendChild(div_copy);

  document.getElementById("move_div").style.backgroundColor = '#ffffff';
  document.getElementById("move_div").style.borderStyle = 'dotted';
  document.getElementById("move_div").style.borderColor = '#cccccc';
  document.getElementById("move_div").style.borderWidth = '1px';

  //gewaehltes aus dem alten baum entfernen   
  document.getElementById(box).removeChild(document.getElementById(item_id));
  fill_height_array();
}

function insert_item(spalte_id,zeile,item_id){

  if (document.getElementById("move_div")){
    //clonen des aktuell bewegenden divs
    div_copy = document.getElementById("move_div").cloneNode(true);
  
    //umbenennen der Kopie des bewegenden divs
    div_copy.setAttribute("id",item_id);
  
    //platzhalter einfuegen  
    if(zeile == 0){
      document.getElementById(spalte_id).appendChild(div_copy);
    }else{
      if (document.getElementById(spalte_id).hasChildNodes()){
        document.getElementById(spalte_id).insertBefore(div_copy,document.getElementById(spalte_id).childNodes[zeile-1]);
      }else{
        document.getElementById(spalte_id).appendChild(div_copy);
      }
    }

    //bewegendes Element aus dem Container entfernen   
    document.getElementById("movediv").removeChild(document.getElementById("move_div"));
  }
}

function insert_platzhalter(spalte_id,zeile,h) {

  //platzhalter kopieren
  div_pzh = document.getElementById("leer_knoten").cloneNode(true);

  //umbenennen des platzhalters
  div_pzh.setAttribute("id", "platzhalter");
 
  //platzhalter einfuegen  
  if(zeile == 0){
    document.getElementById(spalte_id).appendChild(div_pzh);
  }else{
    if (document.getElementById(spalte_id).hasChildNodes()){
      document.getElementById(spalte_id).insertBefore(div_pzh,document.getElementById(spalte_id).childNodes[zeile-1]);
    }else{
      document.getElementById(spalte_id).appendChild(div_pzh);
    }
  }

  //platzhalter formatieren
  document.getElementById("platzhalter").style.height = h-2+'px';
}

function insert_bm(bmpid,eid){
  if (document.getElementById("move_div")){
  
    document.getElementById("move_div").style.backgroundColor = '';
    document.getElementById("move_div").style.borderStyle = '';
    document.getElementById("move_div").style.borderColor = '';
    document.getElementById("move_div").style.borderWidth = '';
  
    //clonen des aktuell bewegenden divs
    div_copy = document.getElementById("move_div").cloneNode(true);
  
    //umbenennen der Kopie des bewegenden divs
    div_copy.setAttribute("id",eid);
      
    //div einhaengen
    document.getElementById(bmpid).insertBefore(div_copy,document.getElementById(bmpid).childNodes[gbp]);

    //bewegendes Element aus dem Container entfernen   
    document.getElementById("movediv").removeChild(document.getElementById("move_div"));

    // eventhdl anmelden
    document.getElementById(eid+"_bmdragger").onmousedown = mdown_bm;
    document.getElementById(eid+"_mbtn").onclick = toggle_book_menue;
    document.getElementById(eid+"_msb").onclick = set_book_werte;
    document.getElementById(eid+"_mcab").onclick = toggle_book_menue;
    document.getElementById(eid+"_mrem").onclick = remove_book;
  }
}

function remove_platzhalter(spalte_id){

  //platzhalter loeschen
  if(document.getElementById("platzhalter")){
    document.getElementById(spalte_id).removeChild(document.getElementById("platzhalter"));
  }

}

function get_col(){
  border = Math.floor((bwidth-(3*glob_width)+4)/2);

  if (aktivX < border + glob_width) return "c_td1";
  if (aktivX >= (border + glob_width) && aktivX < (border+4+(2*glob_width))) return "c_td2";
  if (aktivX >= (border+4+(2*glob_width))) return "c_td3";
}

function get_row(col,old_row){

  if(old_row==0){
    for (var i = 0; i < glob_height[col].length-1; i++){
      if (aktivY < glob_height[col][i]) return i+1;
    }
    return 0;
  }else{
    for (var i = 0; i < glob_height[col].length; i++){
    
      if(i==(old_row-2)){
        if (aktivY < glob_height[col][i]) return i+1;
      }
    
      if(i>=old_row){
        if (aktivY < glob_height[col][i]) return i;
      }    
    }
    return 0;
  }
}

function get_row_click(col){

  for (var i = 0; i < glob_height[col].length-1; i++){
    if (aktivY < glob_height[col][i]) return i+1;
  }
  return 0;
}

//ermitteln der linkbox und position innerhalb der linkbox
function get_bmpid(col){
  for (var i = 0; i < glob_lbh[col].length; i++){
    if (
      (aktivY > glob_lbh[col][i][1])&&
      (aktivY < glob_lbh[col][i][1]+glob_lbh[col][i][2])
    
    ){
      gbp = 0;
      gbh = glob_lbh[col][i][1] + 16;
      for (var j = 3; j < glob_lbh[col][i].length-1; j++){
        gbh = gbh + glob_lbh[col][i][j] + 2;
        if (aktivY > gbh) gbp = j-2;
      }
      return glob_lbh[col][i][0]+"_content";
    }
  }
  return 0;
}

// Entfernen eines Elements wenn X geklickt wird
function remove_element(e){
  // Object ID Bestimmen
  var e2 = (window.event)? window.event: e;
  objSrc = (e2.target)? e2.target : e2.srcElement;
  clicked = objSrc.id;
  ob_id = clicked.substr(0,clicked.length-5);
  document.getElementById(document.getElementById(ob_id).parentNode.getAttribute("id")).removeChild(document.getElementById(ob_id));
  fill_height_array();
  
  // Element aus DB entfernen , onSuccess: function(reponse) {alert(reponse.responseText);}
  new Ajax.Request(relpath+"inc/php/ajax.php",{method: 'post',parameters:{aktion:'rem_elem',uid:nutzer,eid:ob_id,sid:sid}});
}

// Entfernen eines Elements wenn X geklickt wird
function remove_element_old(item_id){
  document.getElementById(document.getElementById(item_id).parentNode.getAttribute("id")).removeChild(document.getElementById(item_id));
  fill_height_array();
}

function set_focus(eid){
  zi = zi + 1 ;
  document.getElementById(eid).style.position = "relative";
  document.getElementById(eid).style.zIndex = zi;
//  document.getElementById(eid+"_header").style.zIndex = zi;
//  document.getElementById(eid+"_menue").style.zIndex = zi;
}

function resize_load(b,h){
  document.getElementById("loaddiv").style.width =  b+'px';
  document.getElementById("loaddiv").style.height =  h+'px';
}

function show_load(){
/*
  var ax = (e) ? e.pageX :
          event.clientX + document.body.scrollLeft;
  var ay = (e) ? e.pageY :
          event.clientY + document.body.scrollTop;
*/
  document.getElementById("loaddiv").style.visibility =  'visible';

//  document.getElementById("loadpic").style.top =  '50px';
//  document.getElementById("loadpic").style.left =  '50px';
//  document.getElementById("loadpic").style.visibility =  'visible';
}

function hide_load(){
  document.getElementById("loaddiv").style.visibility =  'hidden';
  //document.getElementById("loadpic").style.visibility =  'hidden';
}

function set_bild_size(eid){

/*
  if(document.getElementById(eid+"_img")){
  alert (document.getElementById(eid+"_bild").offsetWidth+' '+document.getElementById(eid+"_img").width);    
    if(document.getElementById(eid+"_img").width > document.getElementById(eid+"_bild").offsetWidth){
      vh = document.getElementById(eid+"_img").width/document.getElementById(eid+"_img").height;
      document.getElementById(eid+"_img").width = document.getElementById(eid+"_bild").offsetWidth-20;
      document.getElementById(eid+"_img").height = Math.round((document.getElementById(eid+"_bild").offsetWidth-20)/vh);
    }
    document.getElementById(eid+"_img").style.display = 'block';
  }
*/
}