extension to make TOC easier to manipulate with js/css

Anonymous avatarAnonymous created an issue

An alternative toctree directive that wraps the HTML TOC in a containing element - a div with class 'toc-holder'. An implementation is here:


The specific motivation for this is the need to convert a TOC to a YUI TreeView (http://developer.yahoo.com/yui/treeview). With the above extension, the required javascript should is a bit neater than otherwise, eg. something like:

YAHOO.util.Event.onDOMReady( function() {
    var holders = YAHOO.util.Dom.getElementsByClassName('toctree-holder', 'div');
    var holder, tocs, toc, subtocs, tree;
    for (i=0; i<holders.length; i++) {
         holder = holders[i];
          tocs = holder.getElementsByTagName('ul');
          if (tocs.length) {
              toc = tocs[0];
              subtocs = toc.getElementsByTagName('ul');
              if (!subtocs.length) {
              //the TOC has no subtocs, don't want a treeview
              else {
                  tree = new YAHOO.widget.TreeView(holder);

Without the extension, it's not as easy to determine if a list is a TOC or not.

Comments (3)

  1. Log in to comment
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.