LaTeX and Mermaid chart support

[Luticus]

Is your feature request related to a problem? Please describe.
Not exactly, but it will get closer to feature parody with the original text editor + markdown editor extension.

Although it should be noted that some of my current markdown documents look broken because they have latex and mermaid charts integrated into them and when viewed in this editor it makes them look bad.

Describe the solution you'd like
I would like latex support and support for mermaid charts in markdown. (feature parody with the markdown editor extension). Would also be really nice if there were a way to view the mark down in source mode and/or interpreted mode, like the markdown editor app does.

Describe alternatives you've considered
Currently, I switched back to the standard text editor and markdown extension, because they support more.

Additional context
LaTeX example:

Mermaid chart example:

[jancborchardt]

This is quite advanced, so it’s not likely to be on the main roadmap anytime soon as we have more core things to work on first. But this is a great thing to be picked up by anyone who wants to dive in and contribute! 🙂

@Luticus maybe you have some links to libraries that can be used?

[Luticus]

I wish. If I could I definitely would. Maybe I can take a look at the markdown editor project to get some ideas. Unfortunately I'm more of a python person these days. But I would love to contribute if I had some mentoring on where to even start :)

I wish I knew more about the NC API and where a good list of all available methods/classes/etc were and what they do.

[Luticus]

Ok for LaTeX it looks like KaTeX may be what we'd need: https://katex.org/

For the mermaid stuff it looks like they are using: https://github.com/tylingsoft/markdown-it-mermaid

I could probably try to figure out how to implement some of that but integrating it with the current nc text code I may require some pointers on. At any rate, that's a starting point.

[juliusknorr]

Here are some code hints:

• Registering of markdown-it plugins https://github.com/nextcloud/text/blob/master/src/EditorFactory.js#L101
• A new node type has to be registered here https://github.com/nextcloud/text/blob/master/src/EditorFactory.js#L65
• A class for the new node needs to be implemented like we do it for the image: https://github.com/nextcloud/text/blob/master/src/nodes/Image.js
  • make sure to provide a proper schema, that matches the result of the markdownit plugin https://github.com/nextcloud/text/blob/master/src/marks/index.js#L48-L73
  • The actual rendering of the node can be handled by a vue component like https://github.com/nextcloud/text/blob/master/src/nodes/ImageView.vue

[juliusknorr]

Another comment, since the mermaid is just a code block with the mermaid syntax defined, it would probably be better to just extend the tiptap codeblock node and extend the rendering to also present the resulting output with https://github.com/robin1liu/vue-mermaid

[Andreas-Kainz]

The Markdown Editor has both LaTeX and Mermaid support.

https://apps.nextcloud.com/apps/files_markdown

[pabsta]

Is there a known workaround to change the rendering of equations with the Mardown editor? The current rendering engine does a poor job (compared to mathjax/katex). A key attractive feature of latex is its beautiful typesetting of equations.

I'm happy with any hints or suggestions that could help me hack/enhance the two-pane markdown editor.