Nested spoilers?

I found an old thread that I’d posted in a few years back - in which I had posted something with two or perhaps 3 levels of spoilers.

You can click on the blurred bit - which displays the outermost spoiler, Then a grayed bit showing the next level - but clicking on that just hides the whole thing again.

Fixable?

Do you have a link?

This post demonstrates the problem.

Level 1Level 2Level 3

Note that where you click on the grayed area changes the behavior.

I fiddled a bunch with Tripolar’s example, tried various tweaks and tricks and could not get a 3-level “blur” spoiler to ever work reliably. What happened was almost random & clicking the same spot twice did not always produce the same behavior.

But a 3 (or more)-level “hide details” spoiler works 99% as you’d expect:

Level 1

Level 1 body text

Level 2

Level 2 body text

Level 3

Level 3 body text

Level 4

Level 4 body text

I see two shortcomings with this simple version of nested spoilers:

  1. There’s no visual indication of the nesting; Once expanded it just looks like several separate sequential spoilers.

  2. If you expand all levels then close only level 1, when you re-open level 1 it remembers that the lower levels were already expanded.

    IOW, closing a level doesn’t auto-close the lower level spoilers. Whether that’s sensible or confusing behavior is probably more a matter of taste than of logical correctness.

If visual nesting matters you can fix that like this:

Level 1

Level 1 body text

    Level 2

    Level 2 body text

      Level 3

      Level 3 body text

        Level 4

        Level 4 body text

Quote my reply to see what I’ve done. Note that the blank line between each <ul> and the next [details=…] are required for it to work right.

I believe there is no fix for issue #2, if indeed it is an issue.

[Aside 1]
Discourse has a lot of quirks when mixing the various “flavors” of formatting:

  • “Safe” HTML = stuff in < >s
  • BBCode = stuff in [ ]s
  • Markdown = stuff using magic characters, like start a line with “*” to make a bulleted list or surround text with “*” to make italics.

IME an extra blank line separating commands from different flavors seems to fix most of those quirks without injecting a visible blank line into the results.

[Aside 2]
There is lots and lots of now-broken formatting in our pre-Discourse posts thanks to nuance differences in Discourse vs VBulletin. E.g. substantially every [quote] in my entire 20K+ oerve is broken. As are most instances of bold and italic. Durn shame.

I suspect that any attempt to make an automated mass repair runs a risk of mucking up as many innocent posts as it would fix. And who would program or execute that repair given the tragic vacuum in our administration?

That leaves it for some mod to manually repair each one upon request. Which seems like too much effort for too few mods. And runs the risk of turning each such thread into a revived zombie by virtue of the mods’ tweak refreshing the thread.

They did this manual fix-up for many (most?) of the rules stickies at the top of each forum. But for the millions of posts in pur collective history IMO that’s a non-starter.

Here’s the posting I was talking about.

Scroll down to find my second entry,

It definitely needed to be multi-spoilered as the tale was rather disgusting.

Cool. I created an empty post. Got no where with the spoiler though. No idea how the tags are implemented. In that case the introduction of a blank line screws up a 1 level spoiler.