PHP Classes

File: navtree2.php

Recommend this page to a friend!
  Classes of Mark Quah   NavTree   navtree2.php   Download  
File: navtree2.php
Role: Auxiliary script
Content type: text/plain
Description: PHP script for navtree2
Class: NavTree
Explorer-like tree
Author: By
Last change: PHP script for navtree2. By itself it can generate static tree. Need navtree2.js for dynamic tree view. See navtree2_sample.php for implementation.
Date: 20 years ago
Size: 12,199 bytes
 

Contents

Class file image Download
<?php //###################################################################### //##### TITLE :: NAVTREE 2 //##### FILE :: class_navtree2.php //##### PROJECT :: WebVision //##### RELATED DOCUMENT :: //##### DESCRIPTION :: //##### Display an explorer-like tree view in a DIVISION field //##### Simpler implementation of Navigation Tree. //##### AUTHOR :: Mark Quah //##### REVISION :: //##### 2003 Nov 12: draft //###################################################################### class NAVTREE2 { //========================================================================== //===== VARIABLE DECLARATION //========================================================================== //--- HTML Info var $divID; // Division ID to write tree to var $divTag; // intermediate division Tag //--- Tree Info var $no_node=0; // no. of node var $node_content=Array(); // node content var $node_class=Array(); // node class id var $node_peer=Array(); // node peer id (0: null) var $node_parent=Array(); // node parent id (0: root node) var $node_child=Array(); // node first child (0: null) var $node_collapse=Array(); // collapse (1: collapse 0: expand) //--- Indentation Column Info var $leadin_line=Array(); // leader line 0: no line 1: vertical var $leadin_box=Array(); // box: plus, minus or empty box //--- Images for leading lines, junction and box var $box_image=Array(); // box: plus, minus or empty box var $junction_image=Array(); // junction: T or L-junction var $line_image=Array(); // vertical line or space //============================================================================== //===== NAVTREE(div_id, root_content, root_class) //===== Initialization Function //===== Paramter: //===== div_id: specified Division ID to write to //===== root_content: root node content to be displayed //===== root_class: root class id to be used //===== root_collapse: show/hide root menu item: 0: show, 1: hide //============================================================================== function NAVTREE2($div_id, $root_content, $root_class, $root_collapse) { //----- Intialize root node $this->divID=$div_id; $this->node_parent[0] = 0; $this->node_child[0] = 0; $this->node_content[0] = $root_content; $this->node_class[0] = $root_class; $this->node_peer[0] = 0; $this->node_collapse[0] = $root_collapse; // box_image $this->box_image[0] = "<IMG class='navimg' src='IMAGE/box-none.gif'></IMG>"; $this->box_image[1] = "<IMG class='navimg' src='IMAGE/box-plus.gif'></IMG>"; $this->box_image[2] = "<IMG class='navimg' src='IMAGE/box-minus.gif'></IMG>"; $this->box_image[5] = "<IMG class='navimg' src='IMAGE/box-root-none.gif'></IMG>"; $this->box_image[6] = "<IMG class='navimg' src='IMAGE/box-root-plus.gif'></IMG>"; $this->box_image[7] = "<IMG class='navimg' src='IMAGE/box-root-minus.gif'></IMG>"; // lead in Junction $this->junction_image[0] = "<IMG id='navimg' src='IMAGE/line-L.gif'></IMG>"; $this->junction_image[1] = "<IMG id='navimg' src='IMAGE/line-T.gif'></IMG>"; // line image $this->line_image[0] = "<TD class='leadin0'></TD>"; $this->line_image[1] = "<TD class='leadin1'></TD>"; $this->line_image[2] = "<DIV class='leadin0'>&nbsp;</DIV>"; $this->line_image[3] = "<DIV class='leadin1'>&nbsp;</DIV>"; // built-in Style; $this->PrintStyle(); } //============================================================================== //===== AddNode(p_content, p_class, parent_id, collapse) //===== Add a node to the tree. Return the node_id. //===== the content is wrapped in a DIV field: //===== <TD><DIV class=p_class>p_content</DIV></TD> //===== Paramter: //===== p_content: node content to be displayed, usually a <A HREF=.. </A> //===== p_class: Class to be used. //===== parent_id: parent node id. id is returned when the node is created. //===== collapse: 0: display all children 1: don't display child nodes //===== Return: //===== Node ID of the node created. //============================================================================== function AddNode($p_content, $p_class, $parent_id, $collapse) { //----- Add a node $this->no_node ++; $node_id = $this->no_node; //----- Add node info $this->node_content[$node_id] = $p_content; $this->node_class[$node_id] = $p_class; $this->node_collapse[$node_id] = $collapse; //----- Add Linkage info $this->node_parent[$node_id] = $parent_id; $this->node_child[$node_id] = 0; $this->node_peer[$node_id] = 0; //----- Adjust external linkage if ( $this->node_child[$parent_id] == 0) { // parent has no child $this->node_child[$parent_id] = $node_id; } else { // parent has child, so follow till end of list $node_ptr=$this->node_child[$parent_id]; while ($this->node_peer[$node_ptr] != 0) $node_ptr=$this->node_peer[$node_ptr]; $this->node_peer[$node_ptr] = $node_id; } return $node_id; } // end AddNode //============================================================================== //===== function PrintTree(node_id, level) //===== Generate HTML code of the tree and return the string //===== typically use //===== document.all.div."DivName".innerHTML = PrintTree(0, 0); //===== Parameter //===== node_id: the root node, usually 0 //===== level: indentation level, usually 0 //===== Return //===== html code in string //============================================================================== function PrintTree($node_id, $level) { //----- Print out this node if ($level == 0) $this->outmsg = ""; $this->outmsg .= $this->PrintNode($node_id, $level); //----- Print out the child first if ( $this->node_collapse[$node_id] == 0 && $this->node_child[$node_id] != 0) $this->PrintTree($this->node_child[$node_id], $level+1); //----- Print out the peer if ( $this->node_peer[$node_id] != 0) $this->PrintTree($this->node_peer[$node_id], $level); //---- Return the format return $this->outmsg; } // End PrintTree //============================================================================== //===== function PrintNode(node_id, level) //===== Generate a node HTML code with indentation //===== Using TABLE for formatting. A simple node entry: //===== <TABLE><TR> //===== <TD>indent1<TD>indent2..<TD>junction<TD>box<td>content //===== </TABLE> //===== indent is the leader line either a vertical line or space //===== junction is either a T or L-junction //===== box is either a box with plus, minus or empty within //===== when clicked, it toggle the collapse state //===== content is the node content wrapped in DIV field //===== Parameter //===== node_id: the root node, usually 0 //===== level: indentation level, usually 0 //===== Return //===== html code in string //============================================================================== function PrintNode($node_id, $level) { //===== Determine Leading Line for This Column $this->leadin_box[$level]=$this->node_child[$node_id] != 0 ? 1: 0; if ( $this->leadin_box[$level] == 1 && $this->node_collapse[$node_id] == 0) $this->leadin_box[$level] = 2; $this->leadin_line[$level]= $this->node_peer[$node_id] != 0 ? 1: 0; //===== Print Out Indentation Line $out="<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0><TR>"; for ($i = 1; $i < $level; $i ++) $out .= $this->line_image[ $this->leadin_line[$i] ]; $out .= "\n"; //===== Print Out T- or L-junction before Box if ( $level > 0) { $out .= "<TD VALIGN=TOP>"; // Print out top Image First $out .= $this->junction_image[ $this->leadin_line[$level] ]; $out .= $this->line_image[ $this->leadin_line[$level] + 2]; $out .= "</TD>\n"; } //===== Print Out Box with Toggling State $out .= "<TD VALIGN=TOP HEIGHT=1%>"; //--- Print out Box Image if ($level == 0) $this->leadin_box[$level] += 5; $out .= $this->box_image[ $this->leadin_box[$level] ]; //---- trailing line if ( $this->leadin_box[$level] == 2 || $this->leadin_box[$level] == 7 ) $out .= $this->line_image[3]; else $out .= $this->line_image[2]; $out .= "</TD>"; //===== Print Out Node Content $ctype=( $this->node_class[$node_id] != "" ? "class='".$this->node_class[$node_id]."'" : ""); $out .= "<TD VALIGN=TOP><DIV ".$ctype.">"; $out .= $this->node_content[$node_id]; $out .= "</DIV>"; $out .= $this->line_image[2]; $out .= "</TD>\n"; //===== Finished $out .= "</TR></TABLE>\n"; return $out; } // End PrintNode() //============================================================================== //===== function PrintStyle() //===== Print Internal Style //============================================================================== function PrintStyle() { echo '<style>'; echo '.navimg { margin: 0; padding: 0;'; echo ' width: 20; height: 15; font-size: 1pt;'; echo ' border: none;'; echo '}'; echo '.leadin0 {width: 20; height: 100%; font: 5pt;'; echo 'background: repeat-y url("IMAGE/spacer.gif");'; echo 'margin:0; padding:0;'; echo '}'; echo '.leadin1 {width: 20; height: 100%; font: 5pt;'; echo 'background: repeat-y url("IMAGE/line-I.gif");'; echo 'margin:0; padding:0;'; echo '}'; echo '</style>'; } // PrintStyle() //============================================================================== //===== function GenJSTree() //===== Generate a HTML code containing JS script for JS Tree view //============================================================================== function GenJSTree() { echo '<script language="JavaScript" src="navtree2.js"></script>'; echo "<script>\n"; //-- set root node echo 'NAVTREE(' . '"'. $this->divID. '", ' . '"' . $this->node_content[0]. '", ' . '"' . $this->node_class[0]. '", ' . $this->node_collapse[0] . ");\n"; echo "node0 = 0;\n"; //--- print out the rest of node for ( $i = 1; $i <= $this->no_node; $i ++) { $content = $this->node_content[$i]; $class = $this->node_class[$i]; $collapse = $this->node_collapse[$i]; $parent = $this->node_parent[$i]; echo "node$i=AddNode(\"$content\", \"$class\", node$parent, $collapse);\n"; } echo "GetCookie();"; echo "divTag = document.getElementById(divID);\n"; echo "divTag.innerHTML = PrintTree(0,0);\n"; echo "</script>\n"; } } // End Class