<hide>/<details> messages

[sualehasif]

It would be nice to be able to hide specific parts of the message while writing a response. This encourages clarity and hide pictures/ long and bashy proofs of lemmas inside the message and focus on the key ideas outside. This also makes browsing easier. Ideally you can also recursively put hide tags inside of hide tags. That allows alot of flexibility in how this is used.

(I am not sure but it may also help loading the webpage faster if we don't render the hidden images/ messages until the user clicks the unhide button)

Example pictures/screenshots from artofproblemsolving.com attached below.

[sualehasif]

The claims hidden:

One of the claims expanded:

[cben]

Would standard html <details>...</details> tag work?

[sualehasif]

No, after a short check it seems like these don't work.

[edemaine]

<details> tag seems like a good way to go. These are probably not currently supported because they're not in the HTML sanitize whitelist, but that is easy to fix.

[diomidov]

Bump

[edemaine]

OK, I just deployed a quick fix to allow

<details><summary>Short form</summary>Lots and lots of text</details>

which renders like this:

Short form

Lots and lots of text

I'm not a huge fan of the syntax, but at least it's standard! I can't seem to find a Markdown equivalent, and I'm guessing LaTeX doesn't have one, though we could make one..

Perhaps more interesting would be to customize the formatting to make it look more ... Coauthory. Let me know your suggestions.

[diomidov]

Hmm... How about something like this? I stole the styles from .panel-primary and .panel-heading and added some padding.

[edemaine]

Nice idea to use panel formatting! I'm pushing a change that's based on (a compact version of) .panel-default, which we don't use elsewhere in Coauthor, but is in a similar style, and helps distinguish messages from these "submessages". Also switched the default triangle behavior to (compact versions of) the usual +/- buttons.

[diomidov]

Paragraph breaks don't work inside <details> in markdown mode: https://coauthor.csail.mit.edu/coauthor-dev/m/Fu6MrosTqQ7jE4uFo

[edemaine]

Another request we've heard is to not collapse already open <details> in a message while it's getting edited and rerendered. This is tricky: we'd need some way to detect the "same" <details> from one version of the message to the next, and restore the state.

I think it would help to at least have all <details> open in the preview when actively editing a message, as you probably want to see what you're doing in there. (This may have actually been the original request.)

[diomidov]

Ideally I'd want the <details> to be open iff the cursor is inside <details> in the source code. But this would require #212.