Revision [21314]

This is an old revision of CategoryTree made by BrianKoontz on 2011-01-17 15:48:08.

 

CategoryTree

At the time only a dirty hack to show categories as a tree, initiated by LeOn, converted into a plugin by FaKn

The plain structure on Wikis allows to generate a lot of connected pages fast and simple. The navigation in the Wiki is as simple as using internet - with links. But after 5-6 steps I cannot remember, why I'm at the actually opened page. For me it is helpful to have an hierarchical tree with the structure of the Wiki. The idea was also to use the Category-system of Wikka (CategoryCategory and so on) to automatically generated tree.

The results are presented here.

To do:
1) Function to follow the navigation with the tree
If i open a page, that has an place in the tree, i would like to find it and show the tree open at the right place...
2) More precise documentation.

Implementation for Wikka 1.2


Save the following as plugins/actions/categorytree.php
  1. <?php
  2. /**
  3.  * Displays a tree of all categories.
  4.  * For more info, see http://wikkawiki.org/CategoryTree
  5. **/
  6.  
  7. if (!function_exists('f_action_categorytree_get_tree')) {
  8.     function f_action_categorytree_get_tree ($wakka) {
  9.         $imgpath = $wakka->GetThemePath()."/images/";
  10.         $txt = "<table cellspacing='0' cellpadding='0' border='0' width='100%'>";
  11.         $txt .= "<tr valign=top><td colspan='3' style='font-size: 12px' nowrap>";
  12.         $txt .= "<img src='".$imgpath."ksiazka_otw.gif' hspace=0 vspace=0 border=0 align=left>";
  13.         $txt .= "&nbsp;<b>Prosz&#281; wybra&#263; kategori&#281;:</b></td></tr>";
  14.         $txt .= "<tr valign=top><td height='4'></td></tr>";
  15.         if (!(isset($_SESSION["tree"]))) {
  16.             $_SESSION["active"] = array();
  17.             f_action_categorytree_get_level($wakka, 1, "CategoryCategory");
  18.         } else {
  19.             if (isset($_GET["active1"])) {
  20.                 // call this recursive function for grab the tree
  21.                 $_SESSION["tree"] = "";
  22.                 $_SESSION["active"] = array();
  23.                 f_action_categorytree_get_level($wakka, 1, "KategorieKategorie");
  24.             } else {
  25.                 // get the tree from session variable
  26.                 // nothing necessary - the Text is saved in the session variable
  27.             }
  28.         }
  29.         $txt .= $_SESSION["tree"]."</table>";
  30.         return $txt;
  31.     }
  32.  
  33.     function f_action_categorytree_is_parent ($name) {
  34.         if (preg_match("/^Category(.*)/i", $name)) return true;
  35.         else return false;
  36.     }
  37.  
  38.     function f_action_categorytree_get_level($wakka, $level, $parent = "CategoryCategory") {
  39.         // little function for checking, if a category member is a category
  40.         // or not (then it is an simple page)
  41.  
  42.         $txt = $_SESSION["tree"];  // the text is saved in the session variable "tree"
  43.         $active = $_SESSION["active"];
  44.         $last = $_SESSION["last"];
  45.         $imgpath = $wakka->GetThemePath()."/images/";
  46.         $page = $parent;
  47.         if ($wakka->CheckMySQLVersion(4,0,1)) $results = $wakka->FullCategoryTextSearch($page);
  48.         else $results = $wakka->FullTextSearch($page);
  49.         if ($results) {
  50.             //$txt .= "<table cellspacing='0' cellpadding='0' border='0' width='100%'>";
  51.             $count = 0;
  52.             $pagecount = 0;
  53.             $list = array();
  54.             $active[$level] = $_GET["active".$level];
  55.  
  56.             foreach ($results as $i => $cpage) {
  57.                 if($cpage['tag'] != $page) {
  58.                     array_push($list,$cpage['tag']);
  59.                 }
  60.             }
  61.             sort($list);
  62.             while (list($key, $val) = each($list)) {
  63.                 //echo $key."; ".$val;
  64.                 $count++;
  65.                 $addin = "";
  66.                 // control about the "addin" = pictures before the element
  67.                 // in the tree - on levels under the first one
  68.                 for ($x = 1; $x < $level; $x = $x+1) {
  69.                     if ($last[$x] == 1) {//count($list)) {
  70.                         $addin .= "<img src='".$imgpath."pusty_for_last.gif' hspace='0' vspace='0' border='0' align='left'>";
  71.                     } else {
  72.                         $addin .= "<img src='".$imgpath."menu_bar.gif' hspace='0' vspace='0' border='0' align='left'>";
  73.                     }
  74.                 }
  75.                 $title = $val;
  76.                 $nazwa = $val;
  77.                 // preparing links for the tree elements
  78.                 $myhref = "wakka=".$val;
  79.                 for ($y = 1; $y <= $level; $y = $y+1) {
  80.                     //echo $active[$y].";";
  81.                     if ($y == $level) {
  82.                         $myhref .= "&active".$y."=".$val;
  83.                     } else {
  84.                         $myhref .= "&active".$y."=".$active[$y];
  85.                     }
  86.                 }
  87.              
  88.                 if (f_action_categorytree_is_parent($val)) { // if element has children
  89.                     if ($count == count($list)) { // if last element on this level
  90.                         if ($active[$level] == $val) {
  91.                             $pic1 = "menu_corner_minus";
  92.                             $pic2 = "ksiazka_otw";
  93.                         } else {
  94.                             $pic1 = "menu_corner_plus";
  95.                             $pic2 = "ksiazka_zamk";
  96.                         }
  97.                         $last[$level] = 1;
  98.                     } else {
  99.                         if ($active[$level] == $val) {
  100.                             $pic1 = "menu_tee_minus";
  101.                             $pic2 = "ksiazka_otw";
  102.                         } else {
  103.                             $pic1 = "menu_tee_plus";
  104.                             $pic2 = "ksiazka_zamk";
  105.                         }
  106.                         $last[$level] = 0;
  107.                     }
  108.                 } else {
  109.                     // this elements doesn't have children (= categories without subcategories)
  110.                     if (count($list) == $key+1) {
  111.                         // last empty element
  112.                         $pic1 = "menu_corner";
  113.                         $pic2 = "stronica";
  114.                     } else {
  115.                         // not last, regular tree element
  116.                         $pic1 = "menu_tee";
  117.                         $pic2 = "stronica";
  118.                     }
  119.                 }
  120.                 $myA = "<a style='font-size: 12px; font-family: Arial;' href='wikka.php?".$myhref."' title='".$title."'>";
  121.                 $txt .= "<tr valign='top'><td class='tree' nowrap>".$addin;
  122.                 $txt .= $myA."<img src='".$imgpath.$pic1.".gif' hspace='0' vspace='0' border='0' align='left'></a>";
  123.                 $txt .= $myA."<img src='".$imgpath.$pic2.".gif' hspace='0' vspace='0' border='0' align='left'></a> ";
  124.                 if ($val == $_GET["wakka"]) {
  125.                     $txt .= "&nbsp;<b>".$myA.$nazwa."</a></b>";
  126.                 } else {
  127.                     $txt .= "&nbsp;".$myA.$nazwa."</a>";
  128.                 }
  129.                 $txt .= "</td></tr>";
  130.                 // read next level, if necessary - but before that put some
  131.                 // variables into session variables
  132.                 $_SESSION["tree"] = $txt;
  133.                 $_SESSION["last"] = $last;
  134.                 $_SESSION["active"] = $active;
  135.                 if (($val == $active[$level]) and (f_action_categorytree_is_parent($val))) {
  136.                     f_action_categorytree_get_level($wakka, $level+1, $active[$level]);
  137.                 }
  138.                 $active = $_SESSION["active"];
  139.                 $txt = $_SESSION["tree"];
  140.                 $last = $_SESSION["last"];
  141.                 $pagecount++;
  142.             }
  143.         } else $txt .= 'Sorry, no items found for ' . $page .'.';
  144.         $_SESSION["last"] = $last;
  145.         $_SESSION["active"] = $active;
  146.         $_SESSION["tree"] = $txt;
  147.     }
  148. }
  149.     print f_action_categorytree_get_tree($this);
  150.  
  151. ?>


Create a new custom theme (if you have not done this yet) by copying e.g. the 'light' theme from the 'templates' folder into 'plugins/templates'.
Append the following at the end of header.php
<div id="tree"><?php echo $this->Action('categoriestree') ?></div>


Now you only need some images (for example you can download all needed files here: http://www.polskieustawy.com/pics/tree/) and manipulations on wikka.css to see the right tree generated from your categories.

A simple addition to your copy of light.css is:
#tree {
    border-right: 1px solid #DDD;
    width: 200px;
    padding: 10px 10px 10px 10px;
    float: left;
}


Finally, switch to the new theme (either via your User settings or in the config, see http://docs.wikkawiki.org/WikkaThemes for more info).

Implementation for Wikka 1.1.6.3

This is the old code that works without plugins and templates:

replace the line 1336 in Wakka.Class.php
print($this->Header().$this->Method($this->method).$this->Footer());

with this code:
    $lBody = "
    <table border='0' width='100%'>
        <tr valign='top'>
            <td width='200px'>"
.$this->getTree()."</td>
            <td width='*'>"
.$this->Method($this->method).$this->Footer()."</td>
        </tr>
    </table>"
;
    print($this->Header().$lBody);


Then add following functions to the Wakka-class (in the same file Wakka.Class.php):
  1.     function getTree () {
  2.         $imgpath = "images/";
  3.         $txt = "<table cellspacing='0' cellpadding='0' border='0' width='100%'>";
  4.         $txt .= "<tr valign=top><td colspan='3' style='font-size: 12px' nowrap>";
  5.         $txt .= "<img src='".$imgpath."ksiazka_otw.gif' hspace=0 vspace=0 border=0 align=left>";
  6.         $txt .= "&nbsp;<b>Prosz&#281; wybra&#263; kategori&#281;:</b></td></tr>";
  7.         $txt .= "<tr valign=top><td height='4'></td></tr>";
  8.         if (!(isset($_SESSION["tree"]))) {
  9.             $_SESSION["active"] = array();
  10.             $this->getLevel(1, "CategoryCategory");
  11.         } else {
  12.             if (isset($_GET["active1"])) {
  13.                 // call this recursive function for grab the tree
  14.                 $_SESSION["tree"] = "";
  15.                 $_SESSION["active"] = array();
  16.                 $this->getLevel(1, "CategoryCategory");
  17.             } else {
  18.                 // get the tree from session variable
  19.                 // nothing necessary - the Text is saved in the session variable
  20.             }
  21.         }
  22.         $txt .= $_SESSION["tree"]."</table>";
  23.         return $txt;
  24.     }
  25.  
  26.     function isParent ($name) {
  27.         if (preg_match("/^Category(.*)/i", $name)) return true;
  28.         else return false;
  29.     }
  30.     function getLevel($level, $parent = "CategoryCategory") {
  31.         // little function for checking, if a category member is a category
  32.         // or not (then it is an simple page)
  33.  
  34.         $txt = $_SESSION["tree"];  // the text is saved in the session variable "tree"
  35.         $active = $_SESSION["active"];
  36.         $last = $_SESSION["last"];
  37.         $imgpath = "images/";
  38.         $page = $parent;
  39.         if ($this->CheckMySQLVersion(4,0,1)) $results = $this->FullCategoryTextSearch($page);
  40.         else $results = $this->FullTextSearch($page);
  41.         if ($results) {
  42.             //$txt .= "<table cellspacing='0' cellpadding='0' border='0' width='100%'>";
  43.             $count = 0;
  44.             $pagecount = 0;
  45.             $list = array();
  46.             $active[$level] = $_GET["active".$level];
  47.  
  48.             foreach ($results as $i => $cpage) {
  49.                 if($cpage['tag'] != $page) {
  50.                     array_push($list,$cpage['tag']);
  51.                 }
  52.             }
  53.             sort($list);
  54.             while (list($key, $val) = each($list)) {
  55.                 //echo $key."; ".$val;
  56.                 $count++;
  57.                 $addin = "";
  58.                 // control about the "addin" = pictures before the element
  59.                 // in the tree - on levels under the first one
  60.                 for ($x = 1; $x < $level; $x = $x+1) {
  61.                     if ($last[$x] == 1) {//count($list)) {
  62.                         $addin .= "<img src='".$imgpath."pusty_for_last.gif' hspace='0' vspace='0' border='0' align='left'>";
  63.                     } else {
  64.                         $addin .= "<img src='".$imgpath."menu_bar.gif' hspace='0' vspace='0' border='0' align='left'>";
  65.                     }
  66.                 }
  67.                 $title = $val;
  68.                 $nazwa = $val;
  69.                 // preparing links for the tree elements
  70.                 $myhref = "wakka=".$val;
  71.                 for ($y = 1; $y <= $level; $y = $y+1) {
  72.                     //echo $active[$y].";";
  73.                     if ($y == $level) {
  74.                         $myhref .= "&active".$y."=".$val;
  75.                     } else {
  76.                         $myhref .= "&active".$y."=".$active[$y];
  77.                     }
  78.                 }
  79.                
  80.                 if ($this->isParent($val)) { // if element has children
  81.                     if ($count == count($list)) { // if last element on this level
  82.                         if ($active[$level] == $val) {
  83.                             $pic1 = "menu_corner_minus";
  84.                             $pic2 = "ksiazka_otw";
  85.                         } else {
  86.                             $pic1 = "menu_corner_plus";
  87.                             $pic2 = "ksiazka_zamk";
  88.                         }
  89.                         $last[$level] = 1;
  90.                     } else {
  91.                         if ($active[$level] == $val) {
  92.                             $pic1 = "menu_tee_minus";
  93.                             $pic2 = "ksiazka_otw";
  94.                         } else {
  95.                             $pic1 = "menu_tee_plus";
  96.                             $pic2 = "ksiazka_zamk";
  97.                         }
  98.                         $last[$level] = 0;
  99.                     }
  100.                 } else {
  101.                     // this elements doesn't have children (= categories without subcategories)
  102.                     if (count($list) == $key+1) {
  103.                         // ostatni pusty
  104.                         $pic1 = "menu_corner";
  105.                         $pic2 = "stronica";
  106.                     } else {
  107.                         // not last, regular tree element
  108.                         $pic1 = "menu_tee";
  109.                         $pic2 = "stronica";
  110.                     }
  111.                 }
  112.                 $myA = "<a style='font-size: 12px; font-family: Arial;' href='wikka.php?".$myhref."' title='".$title."'>";
  113.                 $txt .= "<tr valign='top'><td class='tree' nowrap>".$addin;
  114.                 $txt .= $myA."<img src='".$imgpath.$pic1.".gif' hspace='0' vspace='0' border='0' align='left'></a>";
  115.                 $txt .= $myA."<img src='".$imgpath.$pic2.".gif' hspace='0' vspace='0' border='0' align='left'></a> ";
  116.                 if ($val == $_GET["wakka"]) {
  117.                     $txt .= "&nbsp;<b>".$myA.$nazwa."</a></b>";
  118.                 } else {
  119.                     $txt .= "&nbsp;".$myA.$nazwa."</a>";
  120.                 }
  121.                 $txt .= "</td></tr>";
  122.                 // read next level, if necessary - but before that put some
  123.                 // variables into session variables
  124.                 $_SESSION["tree"] = $txt;
  125.                 $_SESSION["last"] = $last;
  126.                 $_SESSION["active"] = $active;
  127.                 if (($val == $active[$level]) and ($this->isParent($val))) {
  128.                     $this->getLevel($level+1, $active[$level]);
  129.                 }
  130.                 $active = $_SESSION["active"];
  131.                 $txt = $_SESSION["tree"];
  132.                 $last = $_SESSION["last"];
  133.                 $pagecount++;
  134.             }
  135.         } else $txt .= 'Sorry, no items found for ' . $page .'.';
  136.         $_SESSION["last"] = $last;
  137.         $_SESSION["active"] = $active;
  138.         $_SESSION["tree"] = $txt;
  139.     }


Now you need only some images (for example you can download all needed files here: http://www.polskieustawy.com/pics/tree/) and manipulations on wikka.css to see the right tree generated from your categories.

To be continued!
There are no comments on this page.
Valid XHTML :: Valid CSS: :: Powered by WikkaWiki