xref: /template/sprintdoc/js/sidebar.js (revision 285c4f96a7bf542c86a909eec254bc890763ec6d)
1/**
2 * Initialize the sidebar to have a toggleable menu system with icon support
3 */
4jQuery(function () {
5    const $nav = jQuery('#dokuwiki__aside').find('nav.nav-main');
6    if (!$nav.length) return;
7
8    const ELEMENT = 'h1,h2,h3,h4,h5'; // FIXME move to config
9    const $elements = $nav.find(ELEMENT);
10    $elements.each(function () {
11        const $me = jQuery(this);
12
13        // prepare text and the optional icon
14        const data = $me.text().split('@', 2);
15        const text = data[0].trim();
16        const $icon = jQuery('<span>')
17            .text(text.substr(0, 1).toUpperCase() + text.substr(1, 1).toLowerCase())
18            .wrapInner('<strong>');
19        if (data[1]) {
20            const src = data[1].trim();
21            $icon.load(DOKU_BASE + 'lib/tpl/sprintdoc/svg.php?svg=' + src + '&e=1'); // directly embed
22        }
23
24        // make the new toggler
25        const $toggler = jQuery('<h6>')
26                .addClass('navi-toggle')
27                .text(text)
28                .prepend($icon)
29            ;
30
31        // wrap all following sibling til the next element in a wrapper
32        const $wrap = jQuery('<div>').addClass('navi-pane');
33        const $sibs = $me.nextAll();
34        for (let i = 0; i < $sibs.length; i++) {
35            const $sib = jQuery($sibs[i]);
36            if($sib.is(ELEMENT)) break;
37            $sib.detach().appendTo($wrap);
38        }
39        $wrap.hide();
40        $wrap.insertAfter($me);
41
42        // replace element with toggler
43        $me.replaceWith($toggler);
44
45        // add toggling the wrapper
46        $toggler.click(function () {
47            $wrap.dw_toggle(undefined, function () {
48                $me.toggleClass('open');
49            });
50        });
51
52    });
53
54});
55