Birthday: January 18th
December 2015
February 2016

Posted on

Collapse-O-Matic Grouping and Expandall Issues

If we set up two groups for the sole purpose of creating expand/collapse all triggers that will only expand/collapse the related group we currently have to create something like:

Science Fiction:

[expand title="Star Wars" rel="fiction"]Alliance to Restore the Republic vs. Galactic Empire[/expand]
<span class="expandall" rel="fiction">Expand All Science Fiction</span>
<span class="collapseall" rel="fiction">Collapse All Science Fiction</span>

Pure Science:

[expand title="Space Race" rel="history"]USA vs. USSR[/expand]
<span class="expandall" rel="history">Expand All Pure Science</span>
<span class="collapseall" rel="history">Collapse All Pure Science</span>

Rel Example:

Science Fiction

  • Star Wars
    Alliance to Restore the Republic vs. Galactic Empire
  • Star Trek
    United Federation of Planets vs. Klingon Empire vs. Romulan Star Empire vs. Cardassian Union vs. the Borg vs. the Dominion
  • Battlestar Galactica
    Twelve Colonies vs. Cylon Empire

Expand All Science Fiction
Collapse All Science Fiction

Pure Science

  • Space Race
    USA vs. USSR
  • Ansari X Prize
    Scaled Composites vs. Many Others

Expand All Pure Science
Collapse All Pure Science

So this works, but what if we do NOT what the expanding of one group to automatically collapse any open items of other groups?

As of Collapse-O-matic version 1.7.1, two new attributes have been introduced to deal with exactly this issue. For the shortcode:
togglegroup='your_group_name'
and for the roll-your-own method:
data-togglegroup='your_group_name'

Science Fiction:

[expand title="Star Wars" togglegroup="fiction"]Alliance to Restore the Republic vs. Galactic Empire[/expand]
<span class="expandall" data-togglegroup="fiction">Expand All Science Fiction</span>
<span class="collapseall" data-togglegroup="fiction">Collapse All Science Fiction</span>

Pure Science:

[expand title="Space Race" togglegroup="history"]USA vs. USSR[/expand]
<span class="expandall" data-togglegroup="history">Expand All Pure Science</span>
<span class="collapseall" data-togglegroup="history">Collapse All Pure Science</span>
[expand title="Expand All" swaptitle="Collapse All" trigclass="setall" togglegroup="history"/]

Group Example:

Science Fiction

  • Star Wars
    Alliance to Restore the Republic vs. Galactic Empire
  • Star Trek
    United Federation of Planets vs. Klingon Empire vs. Romulan Star Empire vs. Cardassian Union vs. the Borg vs. the Dominion
  • Battlestar Galactica
    Twelve Colonies vs. Cylon Empire

Expand All Science Fiction
Collapse All Science Fiction

Pure Science

  • Space Race
    USA vs. USSR
  • Ansari X Prize
    Scaled Composites vs. Many Others

Expand All Pure Science
Collapse All Pure

Expand All*

Adding Highlander Grouping:

[expand title="Monkey" togglegroup="animal" rel="animal-highlander"]monkeys are fast[/expand]
[expand title="Donkey" togglegroup="animal" rel="animal-highlander"]donkeys are strong[/expand]
<span class="expandall" data-togglegroup="animal">Expand All Animals</span>
<span class="collapseall" data-togglegroup="animal">Collapse All Animals</span>
[expand title="Expand All" swaptitle="Collapse All" trigclass="setall" togglegroup="animal"/]
  • Monkey
    Monkeys are fast
  • Donkey
    Donkeys are strong

Expand All Animals
Collapse All Animals

Expand All*

*collapse-pro-matic only