none
[openafs-wiki.git] / TWiki / TablePlugin.mdwn
1 # <a name="Table Plugin"></a> Table Plugin
2
3 Gives extra control of table display:
4
5 - Allows sorting
6 - Changing table properties like border width, cell spacing and cell padding
7 - Changing background color and text color for header cells
8 - Changing background color and text color for data cells - colors can _alternate_
9 - Table attributes can be set and overridden in this order:
10   - Default `TABLEATTRIBUTES` Plugin setting in this topic.
11   - A `TABLEATTRIBUTES` preferences setting on site-level ([[TWikiPreferences]]) or web-level (any [[WebPreferences]]), e.g.
12     - `Set TABLEATTRIBUTES = tableborder="0" cellpadding="1" ...`
13   - Before a table using `%TABLE{...}%`
14
15 ## <a name="Sorting"></a> Sorting
16
17 Click on column heading text to sort by a column. Initial column will be sorted in descending order, click again to get ascending order. The type of data in the cell is determined automatically:
18
19 - date if format is:
20   - dd MMM YYY - hh:mm
21   - dd-MMM-YY or dd-MM-YYYY (can be / or space in place of -)
22   - MMM is Jan, Feb, etc
23 - number is digits, with optional decimal point
24 - otherwise treated as text
25
26 ## <a name="%TOPIC% Global Settings"></a> %TOPIC% Global Settings
27
28 Plugin settings are stored as preferences variables. To reference a plugin setting write <code>**%&lt;plugin&gt;\_&lt;setting&gt;%**</code>, for example, <code>**%INTERWIKIPLUGIN\_SHORTDESCRIPTION%**</code>
29
30 - One line description, shown in the [[TextFormattingRules]] topic:
31   - Set SHORTDESCRIPTION = Control attributes of tables and sorting of table columns
32
33 - Set DEBUG to 1 to get debug messages in `data/debug.txt`. Default: `0`
34   - Set DEBUG = 0
35
36 - Make sortable:
37   - #Set SORT = attachments
38   - Set SORT = all
39   - #Set SORT = none
40
41 - Default table attributes:
42   - Set TABLEATTRIBUTES = tableborder="1" cellpadding="0" cellspacing="1" headerbg="#99CCCC" databg="#FFFFCC, #FFFFFF"
43
44 ## <a name="Table Attributes"></a> Table Attributes
45
46 Attributes are defined as a `TABLEATTRIBUTES` Plugin setting in this topic, a `TABLEATTRIBUTES` preferences setting, or on line before the table using `%TABLE{...}%`:
47
48 <table border="1" cellpadding="0" cellspacing="0" style="border-width: 1px">
49   <tr>
50     <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=0;table=1;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Argument</font></a></th>
51     <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=1;table=1;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Comment</font></a></th>
52     <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=2;table=1;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Example</font></a></th>
53   </tr>
54   <tr>
55     <td bgcolor="#ecf2f8" style=""><code>sort</code></td>
56     <td bgcolor="#ecf2f8" style=""> Set table sorting <code>"on"</code> or <code>"off"</code></td>
57     <td bgcolor="#ecf2f8" style=""><code>sort="on"</code></td>
58   </tr>
59   <tr>
60     <td bgcolor="#ffffff" style=""><code>initsort</code></td>
61     <td bgcolor="#ffffff" style=""> Column to sort initially (<code>"1"</code> to number of columns) </td>
62     <td bgcolor="#ffffff" style=""><code>initsort="2"</code></td>
63   </tr>
64   <tr>
65     <td bgcolor="#ecf2f8" style=""><code>initdirection</code></td>
66     <td bgcolor="#ecf2f8" style=""> Initial sorting direction for <code>initsort</code>, set to <code>"up"</code> or <code>"down"</code></td>
67     <td bgcolor="#ecf2f8" style=""><code>initdirection="up"</code></td>
68   </tr>
69   <tr>
70     <td bgcolor="#ffffff" style=""><code>headerbg</code></td>
71     <td bgcolor="#ffffff" style=""> Header cell background colour. Choose one of the [[TWiki/StandardColors]]</td>
72     <td bgcolor="#ffffff" style=""><code>headerbg="#99CCCC"</code></td>
73   </tr>
74   <tr>
75     <td bgcolor="#ecf2f8" style=""><code>headercolor</code></td>
76     <td bgcolor="#ecf2f8" style=""> Header cell text colour </td>
77     <td bgcolor="#ecf2f8" style=""><code>headercolor="#0000CC"</code></td>
78   </tr>
79   <tr>
80     <td bgcolor="#ffffff" style=""><code>databg</code></td>
81     <td bgcolor="#ffffff" style=""> Data cell background colour, a comma separated list. Specify <code>"none"</code> for no colour, that is to use the colour/background of the page the table is on. </td>
82     <td bgcolor="#ffffff" style=""><code>databg="#C8CB8F, #DBDDB5"</code></td>
83   </tr>
84   <tr>
85     <td bgcolor="#ecf2f8" style=""><code>datacolor</code></td>
86     <td bgcolor="#ecf2f8" style=""> Data cell text colour, a comma separated list </td>
87     <td bgcolor="#ecf2f8" style=""><code>datacolor="#0000CC, #000000"</code></td>
88   </tr>
89   <tr>
90     <td bgcolor="#ffffff" style=""><code>tableborder</code></td>
91     <td bgcolor="#ffffff" style=""> Table border width (pixels) </td>
92     <td bgcolor="#ffffff" style=""><code>tableborder="2"</code></td>
93   </tr>
94   <tr>
95     <td bgcolor="#ecf2f8" style=""><code>tableframe</code></td>
96     <td bgcolor="#ecf2f8" style=""> Table frame, set to <code>"void"</code> (no sides), <code>"above"</code> (the top side only), <code>"below"</code> (the bottom side only), <code>"hsides"</code> (the top and bottom sides only), <code>"lhs"</code> (the left-hand side only), <code>"rhs"</code> (the right-hand side only), <code>"vsides"</code> (the right and left sides only), <code>"box"</code> (all four sides), <code>"border"</code> (all four sides); default <code>"void"</code></td>
97     <td bgcolor="#ecf2f8" style=""><code>tableframe="hsides"</code></td>
98   </tr>
99   <tr>
100     <td bgcolor="#ffffff" style=""><code>tablerules</code></td>
101     <td bgcolor="#ffffff" style=""> Table rules, set to <code>"none"</code> (no rules), <code>"groups"</code> (rules will appear between row groups and column groups only), <code>"rows"</code> (rules will appear between rows only), <code>"cols"</code> (rules will appear between columns only), <code>"all"</code> (rules will appear between all rows and columns); default <code>"none"</code></td>
102     <td bgcolor="#ffffff" style=""><code>tablerules="rows"</code></td>
103   </tr>
104   <tr>
105     <td bgcolor="#ecf2f8" style=""><code>cellpadding</code></td>
106     <td bgcolor="#ecf2f8" style=""> Cell padding (pixels) </td>
107     <td bgcolor="#ecf2f8" style=""><code>cellpadding="0"</code></td>
108   </tr>
109   <tr>
110     <td bgcolor="#ffffff" style=""><code>cellspacing</code></td>
111     <td bgcolor="#ffffff" style=""> Cell spacing (pixels) </td>
112     <td bgcolor="#ffffff" style=""><code>cellspacing="3"</code></td>
113   </tr>
114   <tr>
115     <td bgcolor="#ecf2f8" style=""><code>valign</code></td>
116     <td bgcolor="#ecf2f8" style=""> Vertical alignment of cells, set to <code>"top"</code>, <code>"middle"</code>, <code>"bottom"</code> or <code>"baseline"</code></td>
117     <td bgcolor="#ecf2f8" style=""><code>valign="top"</code></td>
118   </tr>
119   <tr>
120     <td bgcolor="#ffffff" style=""><code>headeralign</code></td>
121     <td bgcolor="#ffffff" style=""> Header cell alignment, one value for all columns, or a comma separated list for different alignment of individual columns. Set to <code>"left"</code>, <code>"center"</code>, <code>"right"</code> or <code>"justify"</code>. Overrides individual cell settings </td>
122     <td bgcolor="#ffffff" style=""><code>headeralign="left, right"</code></td>
123   </tr>
124   <tr>
125     <td bgcolor="#ecf2f8" style=""><code>dataalign</code></td>
126     <td bgcolor="#ecf2f8" style=""> Data cell alignment, one value for all columns, or a comma separated list for different alignment of individual columns. Set to <code>"left"</code>, <code>"center"</code>, <code>"right"</code> or <code>"justify"</code>. Overrides individual cell settings </td>
127     <td bgcolor="#ecf2f8" style=""><code>dataalign="center"</code></td>
128   </tr>
129   <tr>
130     <td bgcolor="#ffffff" style=""><code>tablewidth</code></td>
131     <td bgcolor="#ffffff" style=""> Table width: Percentage of window width, or absolute pixel value. Default is unspecified </td>
132     <td bgcolor="#ffffff" style=""><code>tablewidth="100%"</code></td>
133   </tr>
134   <tr>
135     <td bgcolor="#ecf2f8" style=""><code>columnwidths</code></td>
136     <td bgcolor="#ecf2f8" style=""> Column widths: Comma delimited list of column widths, percentage or absolute pixel value. Default is unspecified </td>
137     <td bgcolor="#ecf2f8" style=""><code>columnwidths="80%, 20%"</code></td>
138   </tr>
139   <tr>
140     <td bgcolor="#ffffff" style=""><code>headerrows</code></td>
141     <td bgcolor="#ffffff" style=""> Number of header rows to exclude from sort; default <code>"1"</code></td>
142     <td bgcolor="#ffffff" style=""><code>headerrows="1"</code></td>
143   </tr>
144   <tr>
145     <td bgcolor="#ecf2f8" style=""><code>footerrows</code></td>
146     <td bgcolor="#ecf2f8" style=""> Number of footer rows to exclude from sort; default <code>"0"</code></td>
147     <td bgcolor="#ecf2f8" style=""><code>footerrows="1"</code></td>
148   </tr>
149 </table>
150
151 The `%TABLE{...}%` settings override `TABLEATTRIBUTES` preferences settings, which override the `TABLEATTRIBUTES` Plugin settings.
152
153 ## <a name="Example"></a> Example
154
155 Line before table: `%TABLE{ sort="on" tableborder="0" cellpadding="1" cellspacing="3" headerbg="#000099" headercolor="#FFFFCC" databg="#C8CB8F, #DBDDB5" headerrows="2" footerrows="1" }%`
156
157 <table border="0" cellpadding="1" cellspacing="3" style="border-width: 0px">
158   <tr>
159     <th bgcolor="#000099" colspan="6" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> Table with two Header Rows and Footer Row </strong> </font></span></th>
160   </tr>
161   <tr>
162     <th bgcolor="#000099" maxcols="0" style=""><a href="http://localhost?sortcol=0;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#FFFFCC">Num</font></a></th>
163     <th bgcolor="#000099" maxcols="0" style=""><a href="http://localhost?sortcol=1;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#FFFFCC">Status</font></a></th>
164     <th bgcolor="#000099" maxcols="0" style=""><a href="http://localhost?sortcol=2;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#FFFFCC">Action</font></a></th>
165     <th bgcolor="#000099" maxcols="0" style=""><a href="http://localhost?sortcol=3;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#FFFFCC">Who</font></a></th>
166     <th bgcolor="#000099" maxcols="0" style=""><a href="http://localhost?sortcol=4;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#FFFFCC">When</font></a></th>
167     <th bgcolor="#000099" maxcols="0" style=""><a href="http://localhost?sortcol=5;table=2;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#FFFFCC">Progress</font></a></th>
168   </tr>
169   <tr>
170     <td bgcolor="#C8CB8F" style=""> 1 </td>
171     <td bgcolor="#C8CB8F" style=""> C </td>
172     <td bgcolor="#C8CB8F" style=""> Chose new colours </td>
173     <td bgcolor="#C8CB8F" style=""> John </td>
174     <td bgcolor="#C8CB8F" style=""> 1-Dec-02 </td>
175     <td bgcolor="#C8CB8F" style="">   </td>
176   </tr>
177   <tr>
178     <td bgcolor="#DBDDB5" style=""> 2 </td>
179     <td bgcolor="#DBDDB5" style=""> X </td>
180     <td bgcolor="#DBDDB5" style=""> Release </td>
181     <td bgcolor="#DBDDB5" style=""> John </td>
182     <td bgcolor="#DBDDB5" style=""> 1-Apr-02 </td>
183     <td bgcolor="#DBDDB5" style="">   </td>
184   </tr>
185   <tr>
186     <td bgcolor="#C8CB8F" style=""> 3 </td>
187     <td bgcolor="#C8CB8F" style="">   </td>
188     <td bgcolor="#C8CB8F" style=""> Get feedback </td>
189     <td bgcolor="#C8CB8F" style=""> Anne </td>
190     <td bgcolor="#C8CB8F" style=""> 1-Feb-02 </td>
191     <td bgcolor="#C8CB8F" style="">   </td>
192   </tr>
193   <tr>
194     <td bgcolor="#DBDDB5" style=""> 12 </td>
195     <td bgcolor="#DBDDB5" style=""> C </td>
196     <td bgcolor="#DBDDB5" style=""> Spec error handling </td>
197     <td bgcolor="#DBDDB5" style=""> Jack </td>
198     <td bgcolor="#DBDDB5" style=""> 1-Dec-02 </td>
199     <td bgcolor="#DBDDB5" style="">   </td>
200   </tr>
201   <tr>
202     <td bgcolor="#C8CB8F" style=""> 5 </td>
203     <td bgcolor="#C8CB8F" style="">   </td>
204     <td bgcolor="#C8CB8F" style=""> Abc </td>
205     <td bgcolor="#C8CB8F" style=""> John </td>
206     <td bgcolor="#C8CB8F" style="">   </td>
207     <td bgcolor="#C8CB8F" style="">   </td>
208   </tr>
209   <tr>
210     <th bgcolor="#000099" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> Num </strong> </font></span></th>
211     <th bgcolor="#000099" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> Status </strong> </font></span></th>
212     <th bgcolor="#000099" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> Action </strong> </font></span></th>
213     <th bgcolor="#000099" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> Who </strong> </font></span></th>
214     <th bgcolor="#000099" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> When </strong> </font></span></th>
215     <th bgcolor="#000099" maxcols="0" style=""><span><font color="#FFFFCC"> <strong> Progress </strong> </font></span></th>
216   </tr>
217 </table>
218
219 ## <a name="Plugin Installation Instructions"></a> Plugin Installation Instructions
220
221 **Note:** You do not need to install anything on the browser to use this plugin. Below installation instructions are for the administrator who needs to install this plugin on the TWiki server.
222
223 - Download the ZIP file from the Plugin web (see below)
224 - Unzip <code>**%TOPIC%.zip**</code> in your twiki installation directory. Content: <table border="1" cellpadding="0" cellspacing="0" style="border-width: 1px">
225   <tr>
226     <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=0;table=3;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">File:</font></a></th>
227     <th bgcolor="#6b7f93" maxcols="0" style=""><a href="http://localhost?sortcol=1;table=3;up=0#sorted_table" rel="nofollow" title="Sort by this column"><font color="#ffffff">Description:</font></a></th>
228   </tr>
229   <tr>
230     <td bgcolor="#ecf2f8" style=""><code><b>data/TWiki/%TOPIC%.txt</b></code></td>
231     <td bgcolor="#ecf2f8" style=""> Plugin topic </td>
232   </tr>
233   <tr>
234     <td bgcolor="#ffffff" style=""><code><b>data/TWiki/%TOPIC%.txt,v</b></code></td>
235     <td bgcolor="#ffffff" style=""> Plugin topic repository </td>
236   </tr>
237   <tr>
238     <td bgcolor="#ecf2f8" style=""><code><b>lib/TWiki/Plugins/%TOPIC%.pm</b></code></td>
239     <td bgcolor="#ecf2f8" style=""> Plugin Perl module </td>
240   </tr>
241   <tr>
242     <td bgcolor="#ffffff" style=""><code><b>pub/TWiki/%TOPIC%/diamond.gif</b></code></td>
243     <td bgcolor="#ffffff" style=""> Diamond symbol </td>
244   </tr>
245   <tr>
246     <td bgcolor="#ecf2f8" style=""><code><b>pub/TWiki/%TOPIC%/down.gif</b></code></td>
247     <td bgcolor="#ecf2f8" style=""> Down arrow </td>
248   </tr>
249   <tr>
250     <td bgcolor="#ffffff" style=""><code><b>pub/TWiki/%TOPIC%/up.gif</b></code></td>
251     <td bgcolor="#ffffff" style=""> Up arrow </td>
252   </tr>
253 </table>
254 - Test if the plugin is correctly installed:
255   - Check above example if the table renders as expected
256   - Try click on heading to sort. Other tables should also be sortable
257
258 ## <a name="Plugin Info"></a> Plugin Info
259
260 <table border="1" cellpadding="0" cellspacing="0" style="border-width: 1px">
261   <tr>
262     <td align="right" bgcolor="#ecf2f8" style=""> Plugin Author: </td>
263     <td bgcolor="#ecf2f8" style="">[[TWiki/JohnTalintyre]], [[TWiki/PeterThoeny]]</td>
264   </tr>
265   <tr>
266     <td align="right" bgcolor="#ffffff" style=""> Plugin Version: </td>
267     <td bgcolor="#ffffff" style=""> 24 May 2003 </td>
268   </tr>
269   <tr>
270     <td align="right" bgcolor="#ecf2f8" style=""> Change History: </td>
271     <td bgcolor="#ecf2f8" style="">  </td>
272   </tr>
273   <tr>
274     <td align="right" bgcolor="#ffffff" style=""> 24 May 2003: </td>
275     <td bgcolor="#ffffff" style=""> PTh: New <code>|^|</code> rule for multi row span (TWiki:Main/WalterMundt); added tableframe and tablerules (TWiki:Main/JohannesMartin); ignore columnwidths for multi column span; validate headerrows and footerrows (TWiki:Main/DarrylGreen) </td>
276   </tr>
277   <tr>
278     <td align="right" bgcolor="#ecf2f8" style=""> 17 Dec 2002: </td>
279     <td bgcolor="#ecf2f8" style=""> PTh: Removed individual table Plugin settings; added TABLEATTRIBUTES Plugins setting and TABLEATTRIBUTES preferences setting </td>
280   </tr>
281   <tr>
282     <td align="right" bgcolor="#ffffff" style=""> 15 Dec 2002: </td>
283     <td bgcolor="#ffffff" style=""> PTh: Added headerrows and footerrows params (TWiki:Main/DarrylGreen, TWiki:Main/WoutMertens); added tablewidth and columnwidths params (TWiki:Main/ThorstenSommermann) </td>
284   </tr>
285   <tr>
286     <td align="right" bgcolor="#ecf2f8" style=""> 09 Dec 2002: </td>
287     <td bgcolor="#ecf2f8" style=""> PTh: Added headercolor and datacolor parameters </td>
288   </tr>
289   <tr>
290     <td align="right" bgcolor="#ffffff" style=""> 05 Jun 2002: </td>
291     <td bgcolor="#ffffff" style=""> PTh: Added "none" value to databg parameter (suggested by TWiki:Main/TaitCyrus); fixed sorting by stripping HTML tags, removing links and making sort ignore case (suggested by TWiki:Main/ShawnBradford) </td>
292   </tr>
293   <tr>
294     <td align="right" bgcolor="#ecf2f8" style=""> 13 Mar 2002: </td>
295     <td bgcolor="#ecf2f8" style=""> PTh: Added TWiki:Main/ShawnBradford 's initsort and initdirection </td>
296   </tr>
297   <tr>
298     <td align="right" bgcolor="#ffffff" style=""> 12 Mar 2002: </td>
299     <td bgcolor="#ffffff" style=""> PTh: Added valign, headeralign and dataalign; fixed bug of swapped cellpadding/cellspacing; fixed warning of uninitialized value </td>
300   </tr>
301   <tr>
302     <td align="right" bgcolor="#ecf2f8" style=""> 05 Jan 2002: </td>
303     <td bgcolor="#ecf2f8" style=""> PTh: Fixed sorting bug of cells with leading white space </td>
304   </tr>
305   <tr>
306     <td align="right" bgcolor="#ffffff" style=""> 06 Dec 2001: </td>
307     <td bgcolor="#ffffff" style=""> PTh: Fixed date sorting bug <br /> 03 Dec 2001 PTh: Fixed sort="off" bug and more </td>
308   </tr>
309   <tr>
310     <td align="right" bgcolor="#ecf2f8" style=""> 29 Nov 2001: </td>
311     <td bgcolor="#ecf2f8" style=""> PTh: Fixed Perl warnings </td>
312   </tr>
313   <tr>
314     <td align="right" bgcolor="#ffffff" style=""> 16 Nov 2001: </td>
315     <td bgcolor="#ffffff" style=""> PTh: Added table border, cell spacing, cell padding, gif files </td>
316   </tr>
317   <tr>
318     <td align="right" bgcolor="#ecf2f8" style=""> 07 Oct 2001: </td>
319     <td bgcolor="#ecf2f8" style=""> JT: Initial version </td>
320   </tr>
321   <tr>
322     <td align="right" bgcolor="#ffffff" style=""> CPAN Dependencies: </td>
323     <td bgcolor="#ffffff" style=""> none </td>
324   </tr>
325   <tr>
326     <td align="right" bgcolor="#ecf2f8" style=""> Other Dependencies: </td>
327     <td bgcolor="#ecf2f8" style=""> none </td>
328   </tr>
329   <tr>
330     <td align="right" bgcolor="#ffffff" style=""> Perl Version: </td>
331     <td bgcolor="#ffffff" style=""> 5.0 </td>
332   </tr>
333   <tr>
334     <td align="right" bgcolor="#ecf2f8" style=""> Plugin Home: </td>
335     <td bgcolor="#ecf2f8" style=""><a href="http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%" target="_top">http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%</a></td>
336   </tr>
337   <tr>
338     <td align="right" bgcolor="#ffffff" style=""> Feedback: </td>
339     <td bgcolor="#ffffff" style=""><a href="http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Dev" target="_top">http://TWiki.org/cgi-bin/view/Plugins/%TOPIC%Dev</a></td>
340   </tr>
341 </table>
342
343 **_Related Topics:_** [[TWikiPreferences]], [[TWikiPlugins]], [[StandardColors]]
344
345 -- [[JohnTalintyre]] - 07 Oct 2001 <br /> -- [[PeterThoeny]] - 24 May 2003 <br />