Extension talk:Treeview5.php

This talk page pertains specifically to the development of this extension. For more general discussion about bugs and usage etc, please refer to the mediawiki.org talk page at MW:Extension talk:Tree view

Treeview5.1 is a new approach to the core recursive bullet-list code which doesn't require any voodoo, and should be compatible with all MediaWiki versions including 1.12.

How it works

The initial problem was how to write a parser-function which could generate a tree which could be composed of other transcluded tree's (i.e. parser-functions which are recursively executed forming a larger whole structure together). This seemed impossible since there are no MediaWiki properties available in the environment which reveal the current depth that the parser-function expansion is operating at.

But after thinking about the problem more closely, it turns out that the tree can be constructed without depth information by converting each tree row into a new format containing depth and tree id information which is protected from wiki-parsing. This information can then be converted into tree JavaScript after the parser has finished in the ParserAfterTidy hook.

Here is the wikitext of an example tree which includes two transcluded tree's

*[[toplevl]]
**bar
***baz
*foo
**[[Bar]]
***{{:Foo}}
**[[Baz]]
***{{:Bar}}

The expandTree method (the #tree parser-function hook) then converts all the matched rows into the following general structure:

1{uniq}-{id}-{depth}-{item}2{uniq}

Where uniq is a unique string representing treeview's in general, id is a unique string representing the current tree, depth is the depth of the current row with respect to the current tree root, and item is the wikitext within the current row. The information is "protected" from the parser merely by the fact that it contains no markup characters, but this could be made more robust later.

After the resulting structure has been parsed, the content portions will have been converted into HTML and the information portions remain unchanged. Below is the HTML source of the above example after parsing and printed at the start of the renderTree method (the ParserAfterTidy hook).

1tv47c8d2444a04d-47c8d2447a3e7-1-<a href="/wiki/index.php?title=Toplevl&action=edit" class="new" title="Toplevl">toplevl</a>2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-2-bar2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-3-baz2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-1-foo2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-2-<a href="/Bar" title="Bar">Bar</a>2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-3-1tv47c8d2444a04d-47c8d244781d7-1-<a href="/Foo" title="Foo">Foo</a>2tv47c8d2444a04d2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d244781d7-2-bar2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d244781d7-3-baz2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d244781d7-1-foo2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d244781d7-2-<a href="/Bar" title="Bar">Bar</a>2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d244781d7-2-<a href="/wiki/index.php?title=Baz&action=edit" class="new" title="Baz">Baz</a>2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-2-<a href="/wiki/index.php?title=Baz&action=edit" class="new" title="Baz">Baz</a>2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a3e7-3-1tv47c8d2444a04d-47c8d2447a020-1-<a href="/Bar" title="Bar">bar</a>2tv47c8d2444a04d2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a020-2-baz2tv47c8d2444a04d
1tv47c8d2444a04d-47c8d2447a020-3-biz2tv47c8d2444a04d

The following match and loop will then loop through all the rows no matter what level and extract the values back out

{{{1}}}

Here is a bullet list of the id, depth and item information from the rows when running the above code over the HTML source shown above:

• 47c8d2447a3e7:1,toplevl
• 47c8d2447a3e7:2,bar
• 47c8d2447a3e7:3,baz
• 47c8d2447a3e7:1,foo
• 47c8d2447a3e7:2,Bar
• 47c8d2447a3e7:3,
• 47c8d244781d7:1,Foo
• 47c8d244781d7:2,bar
• 47c8d244781d7:3,baz
• 47c8d244781d7:1,foo
• 47c8d244781d7:2,Bar
• 47c8d244781d7:2,Baz
• 47c8d2447a3e7:2,Baz
• 47c8d2447a3e7:3,
• 47c8d2447a020:1,bar
• 47c8d2447a020:2,baz
• 47c8d2447a020:3,biz

The content of the loop then converts the list into JavaScript statements which result in a dTree. The correct recursive depths are calculated by adding the last depth to the current if its id is a new one.

See also

• dTree (javascript based)
• Slipstream wp-Dtree (php based)