Tree Browser Plugin

Renders a bulleted or numbered list as a collapsable/expandable tree of nodes.

Acknowledgement

This plugin leverages the dTree JavaScript tree menu by Geir Landrö as well as code borrowed from TWiki:Plugins.RenderListPlugin.

Syntax Rules

Place the tag %TREEBROWSER{ parameters }% immediately before a bulleted or numbered list. The lists can be handcrafted, generated by another Plugin, a %TOC%, or the result of a Formatted Search. The list will be rendered in a tree-like fashion (similar to the explorer folder list). Whenever a new indentation level is started, the subsequent nodes at this or a lower indentation level are shown as descendents of the preceding node. The following parameters can be used to configure the appearance of the tree:
Parameter Description Default
"name" or
theme="name" 		Select a rendering theme none
title Required. This text serves as the root of the tree (rendered in bold face none
openAll If on, the tree is shown fully expanded. off
openTo Must be an integer. If present, the tree is expanded to the given node, as numbered from the root. 0
shared Must be a string. If present, the state of the tree is shared across all trees using this string. For example, if the tree is used in the Web Left Bar, the state will hold at all topics with this Web Left Bar. none

Rendering themes can be defined by <name>_THEME Plugin settings
  • Each theme is defined by a comma separated list containing the render type and parameters required by that render type
  • There are different render types; currently this Plugin supports tree and icon render types
  • Format of the tree render type:
    • Set < name >_THEME = tree
  • Format of the icon render type:
    • Set < name >_THEME = icon, [< root icon image >], [< icon image >], [< folder icon image >], [< open folder icon image >]
    • The root icon image is shown at the root of the tree, the icon image is shown at every leaf node, the folder icon image is shown at every collapsed internal node, and the open folder icon image is shown at every expanded internal node. The icon images point to files attached to TWiki topics and are referenced in the standard manner. If no path is given, the images are taken from TWiki Doc Graphics.
    • If an icon image is omitted, the following defaults are chosen: empty.gif, page.gif, folder.gif, folderOpen.gif

If JavaScript is not enabled, the list is rendered as usual, and the =%TREEBROWSER% tag is omitted.

Bullets

  • Use regular * bullets
  • Start with level one
    • Increase indentation only one level at a time
      • Like this
  • Decreasing indentation many levels at a time is fine
  • Keep labels short as text does not wrap.
  • You can specify an icon for a bullet of render type tree or icon:
    • Attach the icon to a topic, e.g. myicon.gif, or
    • Use one of the existing icons: globe.gif %ATTACHURL%/globe.gif, home.gif %ATTACHURL%/home.gif, virtualhome.gif %ATTACHURL%/virtualhome.gif, group.gif %ATTACHURL%/group.gif, persons.gif %ATTACHURL%/persons.gif, virtualpersons.gif virtualpersons.gif, person.gif %ATTACHURL%/person.gif, virtualperson.gif %ATTACHURL%/virtualperson.gif, email.gif %ATTACHURL%/email.gif, trend.gif %ATTACHURL%/trend.gif, folder.gif %ATTACHURL%/folder.gif, file.gif %ATTACHURL%/file.gif, doc.gif %ATTACHURL%/doc.gif, image.gif %ATTACHURL%/image.gif, pdf.gif %ATTACHURL%/pdf.gif, ppt.gif %ATTACHURL%/ppt.gif, sound.gif %ATTACHURL%/sound.gif, xls.gif %ATTACHURL%/xls.gif, zip.gif %ATTACHURL%/zip.gif, see.gif %ATTACHURL%/see.gif
    • Refer to an attached icon at the beginning of the bullet with:
      • icon:myicon.gif Followed by normal bullet text

Example 

%TREEBROWSER{"file" title="[[%HOMETOPIC%][%INCLUDINGWEB% Web Home]]" shared="left"}%
   * [[WebChanges][Changes]] 
   * [[WebIndex][Index]]
   * [[WebSearch][Search]]
   * this is a very very very long text
   * *Webs*
%WEBLIST{"      * [[$name.%HOMETOPIC%][$name]]"}%
generates
If installedSimulated
%TREEBROWSER{"file" title="TWiki Web Home" shared="left"}%

This tree could be used in the Web Left Bar, for example. Clicking on the plus icon next to Webs will expand the subtree below that node.

Plugin Settings

Plugin settings are stored as preferences variables. To reference a plugin setting write %<plugin>_<setting>%, i.e. %TREEBROWSERPLUGIN_SHORTDESCRIPTION%

  • One line description, is shown in the Text Formatting Rules topic:
    • Set SHORTDESCRIPTION = Renders a list as a collapsable/expandable tree.

  • Debug plugin: (See output in data/debug.txt)
    • Set DEBUG = 0

  • Themes are named <SOMETHING>_THEME and contain a comma delimited list of render type with parameters:
    • Set THREAD_THEME = tree
    • Set HOME_THEME = icon, home.gif
    • Set ORG_THEME = icon, base.gif, home.gif, person.gif, persons.gif
    • Set GROUP_THEME = icon, tip.gif, page.gif, person.gif, group.gif
    • Set EMAIL_THEME = icon, email.gif
    • Set TREND_THEME = icon, trend.gif
    • Set FILE_THEME = icon, empty.gif

Plugin Installation Instructions

  1. Download the zip file.
  2. Unzip TreeBrowserPlugin.zip in your twiki installation directory. Content:
    File: Description:
    data/TWiki/TreeBrowserPlugin.txt Plugin topic
    lib/TWiki/Plugins/TreeBrowserPlugin.pm Plugin Perl module
    View.pm.patch Patch to lib/TWiki/UI/View.pm
    pub/TWiki/TreeBrowserPlugin/dtree.css part of dtree
    pub/TWiki/TreeBrowserPlugin/dtree.js part of dtree
    pub/TWiki/TreeBrowserPlugin/base.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/cd.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/empty.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/folder.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/folderopen.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/globe.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/imgfolder.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/join.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/joinbottom.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/line.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/minus.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/minusbottom.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/musicfolder.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/nolines_minus.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/nolines_plus.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/page.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/plus.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/plusbottom.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/question.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/trash.gif part of dtree
    pub/TWiki/TreeBrowserPlugin/doc.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/email.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/file.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/group.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/home.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/image.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/pdf.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/person.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/persons.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/ppt.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/see.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/sound.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/trend.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/virtualhome.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/virtualperson.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/virtualpersons.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/xls.gif icons from RenderListPlugin
    pub/TWiki/TreeBrowserPlugin/zip.gif icons from RenderListPlugin

  1. Patch lib/TWiki/UI/View.pm using View.pm.patch. This patch inserts code into lib/TWiki/UI/View.pm which lifts some JavaScript up into the head section of the document.
  2. See if the above example renders correctly.

Planned Enhancements

  • Support configurable icons for each node (similar to TWiki:Plugins.RenderListPlugin).
  • Support configurable default icons.
  • Support wrapping of long node text.
  • Allow for tree status to be shared across topics (e.g., leave the status of nodes unchanged for a tree used in the Web Left Bar).
  • Support tree browser in other than view mode also.

Plugin Info

Plugin Author: TWiki:Main.ThomasWeigert
Plugin Version: 16 Sep 2005
Change History:  
12 Apr 2006: Minor update for TWiki:Codev.TWikiRelease04x00
16 Sep 2005: Fix bug in openAll and openTo functions
06 Sep 2005: Adopt the rendering themes from TWiki:Plugins.RenderListPlugin
05 Sep 2005: Support sharing of tree state across topics. If JavaScript is not enabled, render the list in standard fashion. Correct user input error containig a line that is too deeply indented.
04 Sep 2005: Initial version
TWiki Dependency: $TWiki::Plugins::VERSION 1.024
CPAN Dependencies: none
Other Dependencies: none
Perl Version: 5.005
License: GPL (GNU General Public License)
TWiki:Plugins/Benchmark: Good Style n%, Formatted Search n%, Tree Browser Plugin n%
Plugin Home: http://TWiki.org/cgi-bin/view/Plugins/TreeBrowserPlugin
Feedback: http://TWiki.org/cgi-bin/view/Plugins/TreeBrowserPluginDev
Appraisal: http://TWiki.org/cgi-bin/view/Plugins/TreeBrowserPluginAppraisal

Related Topics: TWiki:Plugins.RenderListPlugin

-- TWiki:Main.ThomasWeigert - 16 Sep 2005
WYSIWYG | Attach | Print version | History: r1 | Backlinks | View wiki text | Edit | More topic actions
Topic revision: r1 - 12 Apr 2006 - 21:33:28 - TWiki Contributor
 
2picthead.jpg}
Back to Redbourn
Copyright © We make no guarantee of the correctness of the content of this site. All material on this collaboration platform is the property of Martin Cleaver and the contributing authors.