File: pwedwtree.js
Size: 11892
Date: Sat, 08 Dec 2007 15:37:04 +0100
Type: js
// 
// TreeViewItem Class
//
function TreeViewItem(Label, Picturename , target , hreference) //constructor 
{ 
  this.Label = Label
  if (Picturename.length > 0 )
    this.PictureName = Picturename
  else
    this.PictureName = RESOURCEBASE + "ftv2folderclosed.gif";
 
  this.target = target
  this.hreference = hreference
 
  this.id = -1;
  this.navObj = 0;
  this.iconImg = 0; 
  this.NodePicture = 0;
 
  this.ParentItem = null;
  this.ChildItem = new Array;
  this.ChildCount = 0;
  this.Level = 0;
 
  this.TVLinesCoded = "";
  this.isLastNode=false;
 
 
  //dynamic data 
  this.isExpanded = false
  this.isRendered = 0
 
  //Mehtods and Functions
  this.initialize = TVI_initialize 
  this.insertItemLast = TVI_insertItemLast
  this.setChildArray = TVI_setChildArray
  this.expandItem = TVI_expandItem
  this.collapseItem = TVI_collapseItem
  this.selectItem = TVI_selectItem
 
  this.hideBlock = hideBlock
  this.hideItem = TVI_hideItem 
  this.drawItem = TVI_drawItem 
  this.getHTMLLink = getHTMLLink
  this.getNodePicture = TVI_getNodePicture
  this.getID = getID
  this.expandParent = TVI_expandParent
} 
 
function TVI_initialize(Level, lastNode, TVLines) 
{ 
  var i=0       
 
  // Add this to array of entries
  this.id = nEntries 
  indexOfEntries[nEntries++] = this 
 
  this.Level = Level
  this.TVLinesCoded = TVLines
 
  if (Level>0)
    if (lastNode) //the last child in the children array 
        TVLines += "0"
    else
        TVLines += "1"
 
  this.isLastNode = lastNode
 
  if (this.ChildCount > 0) 
  { 
    Level ++
 
    for (i=0 ; i < this.ChildCount; i++)  
    {
      if (i == this.ChildCount-1) 
        this.ChildItem[i].initialize(Level, 1, TVLines)
      else 
        this.ChildItem[i].initialize(Level, 0, TVLines)
    } 
  } 
} 
 
function TVI_drawItem(oParent) 
{ 
  var sHTML = ""
  var i=0
 
  // If item has been previously rendered, just show it 
  // and it's previously expanded Children
  if (this.isRendered) {
     this.navObj.style.display = "block" 
     // If Item was expanded
     if (this.isExpanded ) {
        for (i=this.ChildCount-1; i>=0; i--) {
         if (this.ChildItem[i].isRendered )
             this.ChildItem[i].drawItem() 
        }  
     }
     return
  }
 
  var sTVLines = TVLinesHTML(this.TVLinesCoded)
 
  if (this.Level>0) {
    if (this.isLastNode) //the last child in the children array 
      sTVLines += "<td valign=top>"                                             
    else 
      sTVLines += "<td valign=top background=" + RESOURCEBASE + "ftv2vertline.gif>" 
 
    sTVLines +="<a href='javascript:clickOnNode(\""+this.getID()+"\")'><img name='nodeIcon" + this.id + "' id='nodeIcon" + this.id + "' src='" + this.getNodePicture() + "' width=19 height=16 border=0></a></td>"
  }
  this.isRendered = 1
 
  sHTML = "<div id='TVItem" + this.id + "' style='display:block;'>"
  sHTML += "<table border=0 cellspacing=0 cellpadding=0 width=100% >"
  sHTML += "<tr>" + sTVLines + "<td valign=top>";
  sHTML += this.getHTMLLink("") + "<img id='folderIcon" + this.id + "' name='folderIcon" + this.id + "' src='" + this.PictureName + "' border=0></a></td>"
  sHTML += "<td valign=middle nowrap width=100%>" + this.getHTMLLink("id='itemTextLink"+this.id+"' ") + this.Label + "</a>"
  sHTML += "</td></table></div>"
 
  if (oParent == null)
  {
          document.write("<div id=domRoot></div>") //transition between regular flow HTML, and node-insert DOM DHTML
          oParent = getElById("domRoot")
          oParent.insertAdjacentHTML("beforeEnd", sHTML)
  }
  else
  {
      oParent.insertAdjacentHTML("afterEnd", sHTML)
  }
 
  // get and store references after insert into HTML Document
  this.navObj = getElById("TVItem"+this.id)
  this.iconImg = getElById("folderIcon"+this.id) 
  this.NodePicture = getElById("nodeIcon"+this.id)
} 
 
function TVI_expandItem () {
  if (this.isExpanded ) 
     return
 
  this.isExpanded = true
  propagateChangesInState(this)     
}
function TVI_collapseItem () {
   if (!this.isExpanded)
     return  
 
  this.isExpanded = false
  propagateChangesInState(this)     
}
 
function propagateChangesInState(oTVItem) 
{   
  var i=0 
  //Change Node Picture after Expanded has been changed
  if (oTVItem.Level>0)  
     oTVItem.NodePicture.src = oTVItem.getNodePicture()
 
  //Button up because of insert directly after the parent
  for (i=oTVItem.ChildCount-1; i>=0; i--) {
    if (oTVItem.isExpanded) 
      oTVItem.ChildItem[i].drawItem(oTVItem.navObj)
    else 
      oTVItem.ChildItem[i].hideItem() 
  }
} 
 
function hideBlock() 
{ 
  if (this.navObj.style.display == "none") 
    return 
  this.navObj.style.display = "none" 
} 
 
// CollapseItem
function TVI_hideItem() 
{ 
  // Hide all Children if necessary
  var i=0;
  for (i=this.ChildCount-1; i>=0; i--) {
      if (this.ChildItem[i].isRendered )
         this.ChildItem[i].hideItem() 
  }  
 
 this.hideBlock()
 
} 
 
function getHTMLLink(idString) 
{ 
  var sHTML = "";
  if (this.hreference) 
  { 
    if (this.target.length > 0)
      sHTML += "<a href='" + this.hreference + "' TARGET=\"" + this.target + "\" "
    else
      sHTML += "<a href='" + this.hreference + "' "
 
    sHTML += idString
 
     // This heightlights the current TreeViewItem
    sHTML += " onClick='javascript:clickOnItem(\""+this.getID()+"\")'>"
  } 
  else 
    sHTML += "<a>" 
 
  return sHTML;
} 
 
function TVI_insertItemLast(childNode) 
{ 
  this.ChildItem[this.ChildCount] = childNode 
  childNode.ParentItem = this
  this.ChildCount++ 
  return childNode 
} 
 
//The list can contain either a Folder object or a sub list with the arguments for Item 
function TVI_setChildArray(ChildArray) 
{ 
  this.ChildItem = ChildArray 
  this.ChildCount = ChildArray.length
  for (i=0; i<this.ChildCount; i++)
    this.ChildItem[i].ParentItem = this
} 
// Könnte besser über eine Array Funktion ermittelt werden.
function TVI_getNodePicture() {
 
  if (this.isLastNode) { 
    if (this.ChildCount == 0)
      return RESOURCEBASE + "ftv2lastnode.gif"
    else
      if (this.isExpanded)
       return RESOURCEBASE + "ftv2mlastnode.gif"  
      else
       return RESOURCEBASE + "ftv2plastnode.gif"  
  } else { 
    if (this.ChildCount == 0)
      return RESOURCEBASE + "ftv2node.gif"
    else
      if (this.isExpanded)
        return RESOURCEBASE + "ftv2mnode.gif"
      else
        return RESOURCEBASE + "ftv2pnode.gif"
  }   
}
 
function TVI_expandParent() {
  if (this.ParentItem == null || this.ParentItem.isExpanded)
    return
  else {
    this.ParentItem.expandParent()
    clickOnNodeObj(this.ParentItem)
  }
}
 
function TVLinesHTML(TVLinesCoded) {
    var i;
    var sHTML = "";
 
    for (i=0; i<TVLinesCoded.length; i++)
    {
      switch (TVLinesCoded.charAt(i) ) {
      case "1": 
        sHTML += "<td valign=top background=" + RESOURCEBASE + "ftv2vertline.gif><img src='" + RESOURCEBASE + "ftv2vertline.gif' width=19 height=16></td>"
        break;
      case "0": 
        sHTML += "<td valign=top><img src='" + RESOURCEBASE + "ftv2blank.gif' width=19 height=16></td>";
        break;
      }
    }
    return sHTML
}
 
function getID()
{
  if (typeof this.xID != "undefined") 
    return this.xID
  else
    return this.id
}
// Highlight
function TVI_selectItem() {
 
  var clickedDOMObj = getElById('itemTextLink'+this.id)
 
  if (clickedDOMObj != null) {
      if (lastClicked != null) {
          var prevClickedDOMObj = getElById('itemTextLink'+lastClicked.id);
          prevClickedDOMObj.style.color=lastClickedColor;
          prevClickedDOMObj.style.backgroundColor=lastClickedBgColor;
      }
 
      lastClickedColor    = clickedDOMObj.style.color;
      lastClickedBgColor  = clickedDOMObj.style.backgroundColor;
      clickedDOMObj.style.color=SELECTED_COLOR;
      clickedDOMObj.style.backgroundColor=SELECTED_BACKGROUNDCOLOR;
  }
  lastClicked = this
}
 
 
// Events 
// ********************************************************* 
 
function clickOnItem(TVItemId) 
{ 
 
  var oTVIClicked = findObj(TVItemId)
  if (typeof oTVIClicked=='undefined' || oTVIClicked==null)
  {
    alert("Treeview was not able to find the treeviewitem corresponding to ID=" + TVItemId + ".")
    return;
  }
 
  // To Expand or not to Expand when Clicked on an Item
  if (oTVIClicked.isExpanded) {
     if (COLLAPSEONITEMCLICKED ) 
        oTVIClicked.collapseItem () 
  } else {
     if (EXPANDONITEMCLICKED) 
       oTVIClicked.expandItem () 
  }
 
  if (isLinked(oTVIClicked.hreference)) {
      oTVIClicked.selectItem ();
  }
 
} 
 
function clickOnNode(TVItemId) 
{ 
  tvi = findObj(TVItemId);
  if (typeof tvi=='undefined' || tvi==null)
  {
    alert("Treeview was not able to find the treeviewitem corresponding to ID=" + TVItemId + ".")
    return;
  }
  clickOnNodeObj(tvi);
}
 
function clickOnNodeObj(tvi) 
{ 
  if (tvi.isExpanded) 
    tvi.collapseItem () 
  else
    tvi.expandItem ()
}
// Misc Funcs
 
function findObj(id)
{
  return indexOfEntries[id];
}
// Check if this is a legal Text
function isLinked(hrefText) {
    var result = true;
    result = (result && hrefText !=null);
    result = (result && hrefText != '');
    result = (result && hrefText.indexOf('undefined') < 0);
    result = (result && hrefText.indexOf('parent.op') < 0);
    return result;
}
 
function insertItem(oParent, oChild) 
{ 
  return oParent.insertItemLast(oParent) 
} 
 
function preLoadIcons() {
       arImageSrc = new Array (
           "ftv2vertline.gif",
           "ftv2mlastnode.gif",
           "ftv2mnode.gif",
           "ftv2plastnode.gif",
           "ftv2pnode.gif",
           "ftv2blank.gif",
           "ftv2lastnode.gif",
           "ftv2node.gif",
           "ftv2folderclosed.gif",
           "ftv2folderopen.gif",
           "ftv2doc.gif"
           )
       arImageList = new Array ();
       for (counter in arImageSrc) {
           arImageList[counter] = new Image();
           arImageList[counter].src = RESOURCEBASE + arImageSrc[counter];
       }
}
 
// insertAdjacentHTML on NS6
// Code by thor@jscript.dk
// ******************************************
 
if(typeof HTMLElement!="undefined" && !HTMLElement.prototype.insertAdjacentElement){
    HTMLElement.prototype.insertAdjacentElement = function (sWhere,oElement)
    {
        switch (sWhere){
        case 'beforeBegin':
            this.parentNode.insertBefore(oElement,this)
            break;
        case 'afterBegin':
            this.insertBefore(oElement,this.firstChild);
            break;
        case 'beforeEnd':
            this.appendChild(oElement);
            break;
        case 'afterEnd':
            if (this.nextSibling) 
                this.parentNode.insertBefore(oElement,this.nextSibling);
            else this.parentNode.appendChild(oElement);
            break;
        }
    }
 
    HTMLElement.prototype.insertAdjacentHTML = function(sWhere,sText)
    {
        var oRange = this.ownerDocument.createRange();
        oRange.setStartBefore(this);
        var sHTML = oRange.createContextualFragment(sText);
        this.insertAdjacentElement(sWhere,sHTML)
    }
}
 
function getElById(idVal) {
  if (document.getElementById != null)
    return document.getElementById(idVal)
 
  alert("Get Element by ID - Problem")
  return null
}
 
var RESOURCEBASE = '';
var SELECTED_COLOR = 'HighlightText';
var SELECTED_BACKGROUNDCOLOR = 'Highlight';
var EXPANDONITEMCLICKED=true
var COLLAPSEONITEMCLICKED=false
 
//Other global variables for internal use
var lastClicked = null;
var lastClickedColor;
var lastClickedBgColor;
 
var indexOfEntries = new Array 
var nEntries = 0 
 
// Main function
// ************* 
 
function buildTreeView() 
{ 
  preLoadIcons();
 
  TVROOT.initialize( 0, true, "") 
  TVROOT.drawItem(null) 
  TVROOT.expandItem();
}