Spoiler Tag

[crookedneighbor]

Background

Some guilds need to include trigger warnings for sensitive content in their messages. One way to handle this would be to implement the non-standard spoiler tag. Any content inside a spoiler tag should be rendered as normal markdown.

Example

>! I'm a spoiler
>! I'm _also_ a spoiler
I'm not a spoiler
>! * I'm another spoiler
>! * I'm yet another spoiler

Should render something like:

<div class="spoiler">
  <p>I'm a spoiler</p>
  <p>I'm <em>also</em> a spoiler</p>
</div>
<p>I'm not a spoiler</p>
<div class="spoiler">
  <ul>
     <li>I'm another spoiler</li>
     <li>I'm yet another spoiler</li>
  </ul>
</div>

Questions

• What should the behavior be?
  • A blank box and hover over it to display content?
  • A blank box that clicking on it reveals the content?
  • A minimal box that hovering or clicking unrolls it?
• How should it be styled?
  • Should it just supply the class and let the client style it?
  • Should it inline styles?
  • Should it provide it's own css stylesheet for use?
• Where should this live? Should it be a separate repo? Does that repo already exist?

[Alys]

My opinions:

• Essential that it works on all official Habitica methods of reading chat.
  • acceptable (necessary?) to have different methods of unhiding the spoiler in different tools
  • desirable to allow third-party extensions to override the spoiler hiding (e.g., possible for users to create a Stylish theme that always makes spoiler content unhidden).
• Supplying a class would be most flexible.
• I personally don't see a need for providing its own css stylesheet.
• Making it part of this repo would increase ease of use for third-party developers and hence increase the chance that third-party tools would obey the spoiler tag (important).

[crookedneighbor]

Unfortunately, this repo cannot be used for the mobile apps. And there isn't really a way to provide a markdown parser that all three platforms can use.

[SabreCat]

My vote would be for a minimal box, click to unroll. If that proves ungainly, however (gotta consider what happens if someone includes multiple separate blocks of spoilered-out text), blackout formatting across the text that vanishes on click would be my second choice.

Even if this can't be used in the mobile apps directly, are the mobile apps' markdown parsers extensible enough that we could add handling for the new tag to them individually? @Viirus

[crookedneighbor]

I'm going through old issues that I had opened on Github, I assume this issue is low enough priority that it's not really even worth keeping open. Agree?

[Alys]

It would be very helpful in some guilds. I'd still like to see it done. I think we haven't made progress on it because we forget to look at this repo. :(

If we're interested in contributors working on this library, I can help to publicise any issues we think are suitable for them.

[crookedneighbor]

👍

[benkelaar]

The quickest/easiest way to get this done would be to use something like https://github.com/markdown-it/markdown-it-container instead. That would mean you'd have to use a slightly different syntax, but then you can use a standard plugin to achieve much the same behaviour.

An alternative plugin is https://github.com/traPtitech/markdown-it-spoiler, but that one does inline only (Perhaps you could even combine it with the container plugin to get both in-line and block behaviour for !!!).

There's also https://www.npmjs.com/package/markdown-it-reddit-spoiler that comes closer to the suggested syntax, but that one seems very sketchy. Only one maintainer and quality is sub-par.

If you want me to give the !!! syntax a whirl, let me know.

[Alys]

I like the idea of using a standard plugin and the https://github.com/markdown-it/markdown-it-container sounds good. It doesn't matter that the syntax is different than we originally suggested.

Having block behaviour alone (no inline behaviour) is okay. In fact it will be good because people will have to put their trigger warning in one paragraph then the triggering material in the next paragraph, which will give a tiny bit of warning on clients where the spoiler tag doesn't work.

@benkelaar If you'd like to work on this that's fine with me but I suggest waiting a couple of business days to see if Habitica's staff have any comments. I'll drop a link to this into staff chat now.

---

(This is not directly related but is something for me to remember when/if this goes live: Using a spoiler tag does NOT mean that people can post content that violates the Community Guidelines. E.g., you can't get away with swearing in the Tavern if you put it in a spoiler tag, not even if you have a content warning. When we document the spoiler feature on the wiki, we must add a note about that.)

[crookedneighbor]

👋 @Alys you've probably already thought of this, but consumers of the API (most notably the mobile apps) will need to have their own parsing logic in place. Otherwise, someone could very easily think they are doing the right thing by hiding something that could be triggering on the main site, but have it be received as plain text in the mobile apps and 3rd party consumers.

Might just be a matter of making some of that clear in the wiki.

(Drifts back into the shadows)

[paglias]

I'm a bit worried about introducing non standard markdown syntax and having to add code to the mobile apps will mean it'll take some time before it can go live

[benkelaar]

Yeah sure, will look in to what is necessary in the mobile apps before adding it here.

[veeeeeee]

While we agree that this would be great to have, supporting custom markdown across all platforms is not something we have the resources to do right now, let alone maintain it going forward--especially given other projects needing our attention (accessibility comes to mind).

If in the future there is a flavor of Markdown that supports this across all platforms, we would be happy to reconsider.