https://www.cambridgeenglish.org/js/sitemap-accordion.js

1/*jslint browser: true*/
2/*global $, jQuery*/
3/*
4SETUP
5*/
6var navWidth = 'auto'; //in pixels
7var ulIndent = 19; //in pixels
8var slideSpeed = 'fast'; // 'slow', 'normal', 'fast', or miliseconds 
9//end setup
10var pathname = window.location.pathname;
11
12$(function () {
13    "use strict";
14    $('.sitemapList').css('width', navWidth + 'px');
15    $('.sitemapList ul').css('width', navWidth + 'px');
16    $('.sitemapList ul').css('margin-left', ulIndent + 'px');
17    $('.sitemapList li>ul').css('display', 'block');
18    $('.sitemapList li>ul>li>ul').css('display', 'none');
19
20    $('.sitemapList a').each(function () {
21        var level = $(this).parents('ul').length,
22            liWidth = navWidth - (ulIndent * level) + 30;
23        $(this).parent('li').css('width', liWidth + 'px');
24    });
25
26    /*
27        add 'current' class to the current page
28        */
29    $('.sitemapList a').each(function () {
30        var thisHref = $(this).attr('href');
31        if ((window.location.pathname.indexOf(thisHref) === 0) || (window.location.pathname.indexOf('/' + thisHref) === 0)) {
32            $(this).addClass('current');
33        }
34    });
35
36    /*
37        display the current page
38        */
39    $('.current').parent('li').children('ul').show();
40    $('.current').parents('ul').show();
41
42    /*
43        add expand/collapse icons
44        */
45    $('.sitemapList li').each(function () {
46        if ($(this).children('ul').length > 0) {
47            if ($(this).children('ul').is(":visible")) {
48                $(this).children("span").prepend('<a class="toggler" href="#">-</a>');
49                $(this).css('background', 'none');
50            } else {
51                $(this).children("span").prepend('<a class="toggler" href="#">+</a>');
52                $(this).css('background', 'none').css('padding-left', '0px');
53            }
54        }
55    });
56
57    /*
58        open/close current each list on click
59        */
60    $(".sitemapList a.toggler").click(function () {
61        if ($(this).parent('span').parent('li').children('ul').html() !== null) {
62
63            if ($(this).parent('span').parent('li').parent('ul').hasClass("sitemapList")) {
64                //for outermost accordians
65                $(this).parent('span').parent('li').parent('ul').children('ul').hide();
66                $(this).text('+').parent('span').css("background", "none");
67                $(this).delay(100).is(':hidden');
68                if ($(this).parent('span').parent('li').children('ul').css('display') === "block") {
69                    $(this).parent('span').parent('li').children('ul').hide();
70                    $(this).text('+').parent('span').css("background", "none");
71                } else {
72                    $(this).parent('span').parent('li').children('ul').show();
73                    $(this).text('-').parent('span').css("background", "#E0EAFF");
74                }
75                return false;
76
77            } else {
78                //for nested accordians
79                $(this).parent('span').parent('li').parent('ul').children('ul').hide();
80                $(this).delay(100).is(':hidden');
81                if ($(this).parent('span').parent('li').children('ul').css('display') === "block") {
82                    $(this).parent('span').parent('li').children('ul').hide();
83                    $(this).css("line-height", "1.333em").text('+');
84                } else {
85                    $(this).parent('span').parent('li').children('ul').show();
86                    $(this).css("line-height", "1em").text('-');
87                }
88                return false;
89            }
90
91        } else {
92            return true;
93        }
94
95    });
96
97    //End Required Section
98    //Optional Section - Show Carrots
99    var charBeforeLb = 23, //characters before line break - you must calculate this - based on font-size and LI width;
100        paddingBig = 12, //push carrot arrow down (in pixels) when no there is a line break in the LI
101        paddingSmall = 8, //push carrot arrow down (in pixels) when no there is no line break in the LI
102        maxLiHeight = 50; // max height of LI when list is closed
103    /*
104        Logic to decide whether current list is open,
105        and determine how much padding to give the expand/collapse icons .  
106        */
107    $('.sitemapList > li').each(function () {
108        var childText = $(this).children('a').text(),
109            topPadding = paddingBig;
110        if (childText.length < charBeforeLb) {
111            topPadding = paddingSmall;
112        }
113        //if list is closed
114        if ($(this).height() < maxLiHeight) {
115            if ($(this).children('a').attr('class') === "current") {
116                $(this).parent('li').children('img').attr('src', '../images/imgOnOpen.gif');
117            } else {
118                $(this).parent('li').children('img').attr('src', '../images/imgOffClosed.gif');
119            }
120        } else { //if list is open
121            $(this).children('img').attr('src', '../images/imgOnOpen.gif');
122        }
123    });

124
125    //End Optional Section
126});
127
128function ExpandAll() {
129    "use strict";
130    $('.sitemapList ul').each(function () {
131        $(this).show();
132    });
133}
134
135function CollapseAll() {
136    "use strict";
137    $('.sitemapList ul').each(function () {
138        $(this).hide();
139    });
140}