RenderListPlugin < TWiki/

---+ Render List Plugin 

Render bullet lists in a variety of formats

---++ Syntax Rules

---+++ RENDERLIST Variable

   * Place a =%<nop>RENDERLIST{ &lt;parameters&gt; }%= before any bullet list
      * The lists can be handcrafted, generated by another Plugin, a =%<nop>TOC%=, or the result of a %TWIKIWEB%.FormattedSearch
   * Supported parameters:
      | ="name"= or%BR% =theme="name"= | Select a rendering theme |
      | =focus="any&nbsp;text"= | Focus list on a bullet with specified text |
      | =depth="2"= | Remove bullets with an indent greater then the depth. The depth is relative to the highlighted bullet in case =focus= is specified |
   * Rendering themes can be defined by =&lt;name&gt;_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; this initial Plugin version has *tree* and *icon* render types
   * Format of the *tree* render type:
      * =Set &lt;name&gt;_THEME = tree, &lt;0/1 flag to suppress/show lines of first level&gt;=
   * Format of the *icon* render type:
      * =Set &lt;name&gt;_THEME = icon, &lt;0/1 flag to suppress/show lines of first level&gt;, &lt;icon width&gt;, &lt;icon height&gt;, &lt;spacer graph&gt;, &lt;T-line graph&gt;, &lt;I-line graph&gt;, &lt;L-line graph&gt;, &lt;icon image&gt;=
      * To define new Icon themes, attach images to this Plugin topic and set the parameters accordingly
   * Focus bullet list:
      * Search bullet list for text. If a bullet is found:
         1. Highlight text and remove =[<nop>[][]]= links on bullet where text is found
         2. Reduce bullet list to show only its parents and children
      * This is useful to maintain one large bullet list with links to team pages, representing the organization of a company. Each team page can INCLUDE the bullet list with focus set to itself.

---+++ 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 OK
   * Wrap long text with continuation lines, the Plugin does not do that for you%BR%
     =Align continuation lines with leading spaces like this=
   * You can specify an icon for a bullet of render type *tree* or *icon*:
      * Attach the icon to this Plugin topic, e.g. =myicon.gif=, or
      * Use one of the existing icons: %ATTACHURL%/globe.gif =globe.gif=, %ATTACHURL%/home.gif =home.gif=, %ATTACHURL%/virtualhome.gif =virtualhome.gif=, %ATTACHURL%/group.gif =group.gif=, %ATTACHURL%/persons.gif =persons.gif=, %ATTACHURL%/virtualpersons.gif =virtualpersons.gif=, %ATTACHURL%/person.gif =person.gif=, %ATTACHURL%/virtualperson.gif =virtualperson.gif=, %ATTACHURL%/email.gif =email.gif=, %ATTACHURL%/trend.gif =trend.gif=, %ATTACHURL%/folder.gif =folder.gif=, %ATTACHURL%/file.gif =file.gif=, %ATTACHURL%/doc.gif =doc.gif=, %ATTACHURL%/image.gif =image.gif=, %ATTACHURL%/pdf.gif =pdf.gif=, %ATTACHURL%/ppt.gif =ppt.gif=, %ATTACHURL%/sound.gif =sound.gif=, %ATTACHURL%/xls.gif =xls.gif=, %ATTACHURL%/zip.gif =zip.gif=, %ATTACHURL%/see.gif =see.gif=
      * Refer to an attached icon at the beginning of the bullet with:
         * =icon:myicon Followed by normal bullet text=

---++ Examples

<table border="0" cellspacing="5" cellpadding="3"><tr><th valign="top" bgcolor="#CCCCC">
__You type:__
</th><th valign="top" bgcolor="#CCCCC">
__You get: (simulated)__
</th><th valign="top" bgcolor="#CCCCC">
__You get: (if installed)__
</th></tr>
<tr><td valign="top" bgcolor="#EEEEEE">
<pre>
%<nop>RENDERLIST{"thread"}%
   * one
      * one.a
         * one.a.x
      * one.b
         * one.b.x
           continue
         * one.b.y
            * icon:person Tim
            * icon:person Mico
   * two
   * three
</pre>
</td><td valign="top" bgcolor="#EEEEEE">

<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> one </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> one.a </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> one.a.x </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> one.b </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> one.b.x </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> continue </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> one.b.y </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/person.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> Tim </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/person.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> Mico </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> two </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr> three </nobr></td>
</tr></table>

</td><td valign="top" bgcolor="#EEEEEE">

%RENDERLIST{"thread"}%
   * one
      * one.a
         * one.a.x
      * one.b
         * one.b.x
           continue
         * one.b.y
            * icon:person Tim
            * icon:person Mico
   * two
   * three

</td></tr>
<tr><td valign="top" bgcolor="#EEEEEE">
<pre>
%<nop>RENDERLIST{"org"}%
   * one
      * one.a
         * one.a.x
      * one.b
         * one.b.x
           continue
         * one.b.y
            * icon:person Tim
            * icon:person Mico
   * two
   * three
</pre>
</td><td valign="top" bgcolor="#EEEEEE">

<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.a </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.a.x </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.b </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.b.x </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; continue </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.b.y </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/person.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; Tim </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/person.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; Mico </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; two </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; three </nobr></td>
</tr></table>

</td><td valign="top" bgcolor="#EEEEEE">

%RENDERLIST{"org"}%
   * one
      * one.a
         * one.a.x
      * one.b
         * one.b.x
           continue
         * one.b.y
            * icon:person Tim
            * icon:person Mico
   * two
   * three

</td></tr>
<tr><td valign="top" bgcolor="#EEEEEE">
<pre>
%<nop>RENDERLIST{ "org" focus="one.b" }%
   * one
      * one.a
         * one.a.x
      * one.b
         * one.b.x
           continue
         * one.b.y
            * icon:person Tim
            * icon:person Mico
   * two
   * three
</pre>
</td><td valign="top" bgcolor="#EEEEEE">

<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; <b> one.b </b> </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.b.x </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ud.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; continue </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/home.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; one.b.y </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_udr.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/person.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; Tim </nobr></td>
</tr></table>
<table border="0" cellspacing="0" cellpadding="0"><tr>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/empty.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/dot_ur.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><img src="%ATTACHURL%/person.gif" width="16" height="16" alt="" border="0" /></td>
<td valign="top"><nobr>&nbsp; Mico </nobr></td>
</tr></table>

</td><td valign="top" bgcolor="#EEEEEE">

%RENDERLIST{ "org" focus="one.b" }%
   * one
      * one.a
         * one.a.x
      * one.b
         * one.b.x
           continue
         * one.b.y
            * icon:person Tim
            * icon:person Mico
   * two
   * three

</td></tr></table>

---++ <nop>%TOPIC% Settings

Plugin settings are stored as preferences variables. To reference a plugin setting write ==%<nop>&lt;plugin&gt;_&lt;setting&gt;%==, i.e. ==%<nop>RENDERPLUGIN_SHORTDESCRIPTION%==

   * One line description, is shown in the %TWIKIWEB%.TextFormattingRules topic:
      * Set SHORTDESCRIPTION = Render bullet lists in a variety of formats

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

   * Themes are named =&lt;SOMETHING&gt;_THEME= and contain a comma delimited list of render type with parameters:
      * Set THREAD_THEME = tree, 1
      * Set HOME_THEME = icon, 1, 16, 16, %ATTACHURL%/empty.gif, %ATTACHURL%/dot_udr.gif, %ATTACHURL%/dot_ud.gif, %ATTACHURL%/dot_ur.gif, %ATTACHURL%/home.gif
      * Set ORG_THEME = icon, 0, 16, 16, %ATTACHURL%/empty.gif, %ATTACHURL%/dot_udr.gif, %ATTACHURL%/dot_ud.gif, %ATTACHURL%/dot_ur.gif, %ATTACHURL%/home.gif
      * Set GROUP_THEME = icon, 0, 16, 16, %ATTACHURL%/empty.gif, %ATTACHURL%/dot_udr.gif, %ATTACHURL%/dot_ud.gif, %ATTACHURL%/dot_ur.gif, %ATTACHURL%/group.gif
      * Set EMAIL_THEME = icon, 0, 16, 16, %ATTACHURL%/empty.gif, %ATTACHURL%/dot_udr.gif, %ATTACHURL%/dot_ud.gif, %ATTACHURL%/dot_ur.gif, %ATTACHURL%/email.gif
      * Set TREND_THEME = icon, 0, 16, 16, %ATTACHURL%/empty.gif, %ATTACHURL%/dot_udr.gif, %ATTACHURL%/dot_ud.gif, %ATTACHURL%/dot_ur.gif, %ATTACHURL%/trend.gif
      * Set FILE_THEME = icon, 0, 16, 16, %ATTACHURL%/empty.gif, %ATTACHURL%/dot_udr.gif, %ATTACHURL%/dot_ud.gif, %ATTACHURL%/dot_ur.gif, %ATTACHURL%/file.gif

---++ Plugin Installation Instructions

__Note:__ You do not need to install anything on the browser to use this plugin. The following instructions are for the administrator who installs the plugin on the server where TWiki is running.

   * Download the ZIP file from the Plugin web (see below)
   * Unzip ==%TOPIC%.zip== in your twiki installation directory. Content:
     | *File:* | *Description:* |
     | ==data/TWiki/%TOPIC%.txt== | Plugin topic |
     | ==data/TWiki/%TOPIC%.txt,v== | Plugin topic repository |
     | ==lib/TWiki/Plugins/%TOPIC%.pm== | Plugin Perl module |
     | ==pub/TWiki/%TOPIC%/*.gif== | Image files for themes |
   * Test if the installation was successful:
      * See if the above example works

---++ Plugin Info

|  Plugin Author: | TWiki:Main/PeterThoeny |
|  Plugin Version: | 25 Apr 2006 (V1.033) |
|  Change History: | <!-- versions below in reverse order -->&nbsp; |
|  25 Apr 2006: | SVN sync, Cairo + Dakar compatibility |
|  14 Apr 2006: | [[http://TWiki.org/cgi-bin/view/Codev/TWikiRelease04x00][TWikiRelease04x00]] compatibility update |
|  21 Nov 2004: | Added benchmarks (no code changes) |
|  21 Mar 2004: | Internal change: Fixed unofficial function call |
|  01 Mar 2004: | Added FILE_THEME and folder/file icons |
|  29 Dec 2003: | Fixed rendering issue if focus bullet contains =icon:name=; added TREND_THEME |
|  16 Dec 2003: | Specify icons with =icon:name= syntax |
|  11 Dec 2003: | Added =focus= and =depth= parameters |
|  05 Dec 2003: | Fixed rendering issue with IE; added EMAIL_THEME |
|  02 Dec 2003: | Initial version |
|  CPAN Dependencies: | none |
|  Other Dependencies: | none |
|  Perl Version: | 5.005 |
|  TWiki:Plugins/Benchmark: | %TWIKIWEB%.GoodStyle 97%, %TWIKIWEB%.FormattedSearch 98%, RenderListPlugin 93% |
|  Plugin Home: | http://TWiki.org/cgi-bin/view/Plugins/%TOPIC% |
|  Feedback: | http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Dev |
|  Appraisal: | http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Appraisal |

__Related Topics:__ %TWIKIWEB%.TWikiPreferences, %TWIKIWEB%.TWikiPlugins, TWiki:Plugins/TreePlugin

-- TWiki:Main/PeterThoeny - 21 Nov 2004
This topic: TWiki/ > RenderListPlugin
Topic revision: r10 - 14 Apr 2006 - 17:57:34 - TWikiContributor
Copyright � by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback