PrismJS / prism

Lightweight, robust, elegant syntax highlighting.
https://prismjs.com
MIT License
12.34k stars 1.29k forks source link

Support code folding #1442

Open trixpan opened 6 years ago

trixpan commented 6 years ago

It would be great if PrismJS could support cold folding.

mAAdhaTTah commented 6 years ago

This would make an interesting plugin.

Calytic commented 6 years ago

1045 What happened to this?

mAAdhaTTah commented 6 years ago

There is a link to a small blog post in that issue, but the developer closed the PR. You can pick up where they left off if you'd like.

Calytic commented 6 years ago

I was able to use his approach with <details> and <summary> tags effectively in my own code. However, this approach was inconsistent with the line numbers plugin.

Despite "folding" the code correctly, the line numbers do not fold in tandem and as such were incorrect relative to the document being folded.

If the line numbers plugin was updated to be compatible with the presence of <details> and <summary> tags, that would be a good first step to fixing this issue.

felipecrs commented 3 years ago

This would be an awesome feature. :-)

nlundquist commented 3 years ago

I've released my implementation of code folding for Prism here: https://github.com/nlundquist/prism-js-fold

It works via the <details>/<summary> tags suggested by Lea, doing a efficient pass over the input characters, inserting tags wherever pairs of {} or [] are found. The approach has worked phenomenally for me with JS & JSON and should work just as well any C-like language.

No doubt the line numbers plugin will have the same issues mentioned above, however that issue is not a problem with the code folding implementation itself.

tim-626 commented 3 years ago

@nlundquist, curious if your extension would work for C#-style "regions" such as:

#region Test Region
public void MyMethod()
{
    ...
}
#endregion

At first glance it looks like the code scans just single characters ('[', '{', etc.) at a time, so wouldn't handle finding values like "#region" or "#endregion". Is that correct?

nlundquist commented 3 years ago

@tim-626 correct, my plugin would only fold on [] & {}. It's also currently set up to only fold code marked as js, json or javascript.

The approach taken in my plugin is a single character scan, so it would be a bit awkward to patch it to fold on the #region/#endregion symbols which aren't common to broader C-like langs . My code works as a proof of concept to show folding via details/summary is a viable approach however if you wished to base a C# folder off it.

I'd be happy to recast my plugin as prism-clike-fold and extend the list of languages it supports, as long as it doesn't require deviating from it's current approach too much.