Skip to content

Instantly share code, notes, and snippets.

@royw
Created August 3, 2013 02:08
Show Gist options
  • Save royw/6144805 to your computer and use it in GitHub Desktop.
Save royw/6144805 to your computer and use it in GitHub Desktop.
Addition to CollapsibleLists.js to support expand all, collapse all.
<div id="floatingbar">
<ul>
<li><a href="#" onClick="CollapsibleLists.expand(true)">Expand All</a></li>
<li><a href="#" onClick="CollapsibleLists.expand(false)">Collapse All</a></li>
</ul>
</div>
var CollapsibleLists =
new function(){
// skipping the good stuff...
// Expands or collapses all list items depending on the passed value.
// if open is true, then opens all list items, else closes all list items.
this.expand = function(open){
// find all li elements with class collapsibleList(Open|Closed)
// and set per open flag
var elems = document.getElementsByTagName('li');
for (var index = 0; index < elems.length; index++) {
var elem = elems[index];
if (elem.className.match(/(^| )collapsibleList(Open|Closed)( |$)/)) {
elem.className =
elem.className.replace(
/(^| )collapsibleList(Open|Closed)( |$)/, '');
elem.className += ' collapsibleList' + (open ? 'Open' : 'Closed');
}
}
// find all ul with class collapsibleList then
// remove collapsibleList(Open|Closed)
// then set per open flag
// also change style for open to "display: block;" and
// for not open to "display: none;"
elems = document.getElementsByTagName('ul');
var first = true;
for (index = 0; index < elems.length; index++) {
elem = elems[index];
// check whether this list should be made collapsible
if (elem.className.match(/(^| )collapsibleList( |$)/)) {
elem.className =
elem.className.replace(
/(^| )collapsibleList(Open|Closed)( |$)/, '');
elem.className += ' collapsibleList' + (open ? 'Open' : 'Closed');
elem.style.display = (open ? 'block' : 'none');
// The top level ul's display style must be 'block'
if (first){
elem.style.display = 'block';
}
}
first = false;
}
};
}();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment