﻿var toggleDefinitions = {
    containerIDs : ["expanding","sub1","sub2","sub3","sub4"],
    arr_dt : new Array(0,0),
    arr_dd : new Array(0,0),
    arrLength : new Array(),
    openAll : false,

    
    init : function(containerID){
      with(toggleDefinitions){
        getDefinitions();
        hideDDs();
        addEvents();
      }
    },
    
    getDefinitions : function(){
      with(this){
        for(i=0;i<containerIDs.length;i++){
          var containerID = containerIDs[i];
          var container = document.getElementById(containerID);
          arr_dt[containerID] = container.getElementsByTagName("dt");
          arr_dd[containerID] = container.getElementsByTagName("dd");
          arrLength[containerID] = arr_dt[containerID].length;
          if(arr_dd[containerID].length != arrLength[containerID]){
            alert('There should be a dd element for each dt element');
          }
        }
      }
    },
    
    hideDDs : function(){
      with(this){
        for(i=0;i<containerIDs.length;i++){
            var containerID = containerIDs[i];
            for(j=0;j<arrLength[containerID];j++){
              var dd = arr_dd[containerID][j];
              dd.style.display = "none";
            }
        }
      }
    },
    
    addEvents : function(){
      with(this){
        for(i=0;i<containerIDs.length;i++){
          var containerID = containerIDs[i];
          for(j=0;j<arrLength[containerID];j++){
            var dt = arr_dt[containerID][j];
            dt.onclick = function(){toggleDefinitions.toggle(this);}
          }
        }
      }
    },
    
   toggle : function(dt){
      this.toggleAll(false, dt.parentNode.id);
      var ns = dt.nextSibling;
      while(ns.nodeType !=1){
        ns = ns.nextSibling;
      }
      ns.style.display =(ns.style.display == "block")? "none" : "block" ;
                  var containerHeight = ns.offsetHeight + 220 + "px";
                  document.getElementById("expanding").style.height = containerHeight;
    },

    
    toggleAll : function(display, parentID){
      with(this){
        for(i=0;i<containerIDs.length;i++){
          var containerID = containerIDs[i];
          if(containerID == parentID){
            for(j=0;j<arrLength[containerID];j++){
            var dd = arr_dd[containerID][j];
            dd.style.display = (!display)? "none" : "block" ;
            }
          }
        }
      }
    },
    
    writeCSSrule : function(){
    if(!document.styleSheets) {return};
      var mysheet = document.styleSheets[0];
      var cssRules = (mysheet.cssRules)? mysheet.cssRules[0]: mysheet.rules[0];
      if(mysheet.insertRule){
        mysheet.insertRule('#expanding dd { display: none; }',mysheet.cssRules.length);
      }else{
        mysheet.addRule('#expanding dd ','display: none;');
      }
  }

}

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}
toggleDefinitions.writeCSSrule();
addLoadEvent(toggleDefinitions.init);


