New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add Math Support #81

Closed
RoyiAvital opened this Issue Apr 28, 2016 · 17 comments

Comments

Projects
None yet
5 participants
@RoyiAvital

RoyiAvital commented Apr 28, 2016

Could you please add Math Equations support using MathJax (Like in StackEdit)?

Thank You.

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle Apr 30, 2016

Owner

Pandoc and MultiMarkdown already support MathJax. Simply install them, restart ghostwriter, and then select one of them from the combo box in the HTML Preview window. Here's an example for Pandoc:

<script src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>

Here is an equation to be rendered in Pandoc:

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

screenshot from 2016-04-30 08 54 44

And now for MultiMarkdown:

xhtml header:   <script src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>

Here is an equation rendered by MultiMarkdown:

\\[ {x}_{1,2}=\frac{-b\pm \sqrt{{b}^{2}-4ac}}{2a} \\]

screenshot from 2016-04-30 08 53 23

You can read more about MathJax integration at Pandoc's and MultiMarkdown's respective websites.

Happy writing!

Owner

wereturtle commented Apr 30, 2016

Pandoc and MultiMarkdown already support MathJax. Simply install them, restart ghostwriter, and then select one of them from the combo box in the HTML Preview window. Here's an example for Pandoc:

<script src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>

Here is an equation to be rendered in Pandoc:

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

screenshot from 2016-04-30 08 54 44

And now for MultiMarkdown:

xhtml header:   <script src='https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML'></script>

Here is an equation rendered by MultiMarkdown:

\\[ {x}_{1,2}=\frac{-b\pm \sqrt{{b}^{2}-4ac}}{2a} \\]

screenshot from 2016-04-30 08 53 23

You can read more about MathJax integration at Pandoc's and MultiMarkdown's respective websites.

Happy writing!

@wereturtle wereturtle closed this Apr 30, 2016

@RoyiAvital

This comment has been minimized.

Show comment
Hide comment
@RoyiAvital

RoyiAvital Apr 30, 2016

  1. Could you offer it out of the box?
  2. How can I install MultiMarkDown?
  3. How can I install Pandoc?

Thank You.

RoyiAvital commented Apr 30, 2016

  1. Could you offer it out of the box?
  2. How can I install MultiMarkDown?
  3. How can I install Pandoc?

Thank You.

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle May 1, 2016

Owner

The default Sundown processor that comes with ghostwriter cannot do MathJax, nor would I want to try to tackle writing MathJax functionality for it. (Sundown was written by a GitHub developer, so it's not even my code.)

To install Pandoc or MultiMarkdown, open ghostwriter, go to the Help menu in the menu bar, and select the "Quick Reference Guide" option. There's a list of Markdown processors you can install along with their URLs under the "Markdown Extensions" heading. Likewise, the README.md file (in the "About ghostwriter" section) has the same links. You will have to read each one's respective installation instructions to get started.

Owner

wereturtle commented May 1, 2016

The default Sundown processor that comes with ghostwriter cannot do MathJax, nor would I want to try to tackle writing MathJax functionality for it. (Sundown was written by a GitHub developer, so it's not even my code.)

To install Pandoc or MultiMarkdown, open ghostwriter, go to the Help menu in the menu bar, and select the "Quick Reference Guide" option. There's a list of Markdown processors you can install along with their URLs under the "Markdown Extensions" heading. Likewise, the README.md file (in the "About ghostwriter" section) has the same links. You will have to read each one's respective installation instructions to get started.

@RoyiAvital

This comment has been minimized.

Show comment
Hide comment
@RoyiAvital

RoyiAvital May 1, 2016

I see.
So it will lose its portability functionality?

RoyiAvital commented May 1, 2016

I see.
So it will lose its portability functionality?

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle May 2, 2016

Owner

Not if you put the Pandoc or MultiMarkdown executables next to the ghostwriter executable in your folder. Another user experimented with this, and ghostwriter found them perfectly.

Owner

wereturtle commented May 2, 2016

Not if you put the Pandoc or MultiMarkdown executables next to the ghostwriter executable in your folder. Another user experimented with this, and ghostwriter found them perfectly.

@RoyiAvital

This comment has been minimized.

Show comment
Hide comment
@RoyiAvital

RoyiAvital May 2, 2016

Hi,

OK, I did that, I installed Pandoc.
The issue is adding the script into the file isn't elegant and might hurt compatibility with other editors.

Is there a different (Upper Level) to insert the MathJax script?

Moreover, is there a way to add support for GitHub ToDo List:

  • Yes.
  • No.

Thank You.

RoyiAvital commented May 2, 2016

Hi,

OK, I did that, I installed Pandoc.
The issue is adding the script into the file isn't elegant and might hurt compatibility with other editors.

Is there a different (Upper Level) to insert the MathJax script?

Moreover, is there a way to add support for GitHub ToDo List:

  • Yes.
  • No.

Thank You.

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle May 8, 2016

Owner

I believe for Pandoc you don't actually have to put in the JavaScript snippet into your file. I just put that example in for completeness.

The problem with integrating a script into ghostwriter is that some people might want a newer version with bug fixes down the road. They would then run into ghostwriter colliding with their own script that they add themselves. This could cause some problems.

The bigger issue is that unless the Markdown processor (i.e., Pandoc, MultiMarkdown, etc.) supports converting MathJax into formats other than HTML, having ghostwriter automatically insert the MathJax script becomes no good. The equations will be lost when the user exports to, say, a Word Document or ODT. The user would then be misled in the HTML preview, thinking that equations will export fine to other formats when they won't. (Incidentally, I think Pandoc actually does handle this conversion OK. Give it a try for yourself. MultiMarkdown I'm not so sure about, since you have to put in the script by hand to make it work.)

As for GitHub ToDo List, I presume you mean the rendering of the checkboxes in HTML. As it stands, Sundown, which is built into ghostwriter by default, is the same Markdown processor that GitHub uses at this time (at least until they eventually switch to CommonMark). However, the part of GitHub's code that converts the ToDo lists to actual checkboxes isn't actually part of Sundown. They must use a wrapper that converts the ToDo list to HTML checkboxes first before passing in the result into Sundown for final conversion into HTML.

I suppose I could code ghostwriter to do this, but I don't exactly have perfect Markdown processing. Right now, it's relatively lazy, line-by-line processing for the syntax highlighting. To do it right, I would really have to be more thorough, like parsing nested list items and tables. Then there's the issue of not having any accidents with the Markdown processing such that I assume a block of text is one thing (a ToDo list), when it is actually something else (like a block of code or a table element) due to the user employing a particular extension or flavor of Markdown. Since ghostwriter supports plugging into multiple Markdown processors, a bad assumption on my part could cause document corruption.

So the bottom line is that I probably shouldn't try to add GitHub ToDo List rendering support. If you really want this feature, it would probably be best to request it from the Pandoc or MultiMarkdown developers. That is where the change should truly be implemented--in the Markdown processor itself. (There's no point in filing a new issue against Sundown, since it's being retired in favor of CommonMark. Perhaps one day CommonMark will add this as an extension.)

Owner

wereturtle commented May 8, 2016

I believe for Pandoc you don't actually have to put in the JavaScript snippet into your file. I just put that example in for completeness.

The problem with integrating a script into ghostwriter is that some people might want a newer version with bug fixes down the road. They would then run into ghostwriter colliding with their own script that they add themselves. This could cause some problems.

The bigger issue is that unless the Markdown processor (i.e., Pandoc, MultiMarkdown, etc.) supports converting MathJax into formats other than HTML, having ghostwriter automatically insert the MathJax script becomes no good. The equations will be lost when the user exports to, say, a Word Document or ODT. The user would then be misled in the HTML preview, thinking that equations will export fine to other formats when they won't. (Incidentally, I think Pandoc actually does handle this conversion OK. Give it a try for yourself. MultiMarkdown I'm not so sure about, since you have to put in the script by hand to make it work.)

As for GitHub ToDo List, I presume you mean the rendering of the checkboxes in HTML. As it stands, Sundown, which is built into ghostwriter by default, is the same Markdown processor that GitHub uses at this time (at least until they eventually switch to CommonMark). However, the part of GitHub's code that converts the ToDo lists to actual checkboxes isn't actually part of Sundown. They must use a wrapper that converts the ToDo list to HTML checkboxes first before passing in the result into Sundown for final conversion into HTML.

I suppose I could code ghostwriter to do this, but I don't exactly have perfect Markdown processing. Right now, it's relatively lazy, line-by-line processing for the syntax highlighting. To do it right, I would really have to be more thorough, like parsing nested list items and tables. Then there's the issue of not having any accidents with the Markdown processing such that I assume a block of text is one thing (a ToDo list), when it is actually something else (like a block of code or a table element) due to the user employing a particular extension or flavor of Markdown. Since ghostwriter supports plugging into multiple Markdown processors, a bad assumption on my part could cause document corruption.

So the bottom line is that I probably shouldn't try to add GitHub ToDo List rendering support. If you really want this feature, it would probably be best to request it from the Pandoc or MultiMarkdown developers. That is where the change should truly be implemented--in the Markdown processor itself. (There's no point in filing a new issue against Sundown, since it's being retired in favor of CommonMark. Perhaps one day CommonMark will add this as an extension.)

@RoyiAvital

This comment has been minimized.

Show comment
Hide comment
@RoyiAvital

RoyiAvital May 8, 2016

Hi,

  • Template
    I really think it would be best to have a Template script. Something like MarkDown Edit does. It allows the users some customization ability. No issues of buges since it is user editable.
  • MathJax
    You say if I use Pandoc it won't require the script? I will give it a try.
    MathJax support is very widely used in MarkDown, i really think it should be out of the box experience.

Thank You.

RoyiAvital commented May 8, 2016

Hi,

  • Template
    I really think it would be best to have a Template script. Something like MarkDown Edit does. It allows the users some customization ability. No issues of buges since it is user editable.
  • MathJax
    You say if I use Pandoc it won't require the script? I will give it a try.
    MathJax support is very widely used in MarkDown, i really think it should be out of the box experience.

Thank You.

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle May 8, 2016

Owner

A template script would be an interesting feature. I'll think about it.

There are some technical caveats to doing this now having to do with the QWebKit API being deprecrated in Qt in favor of the new QtWebEngine. The latter is missing features, and I am in limbo right now in regards to switching over to it. This makes me hesitant to add new WebKit-related features until I can switch to the QtWebEngine smoothly once it hopefully matures.

But like I said, I'll have to think about it.

Owner

wereturtle commented May 8, 2016

A template script would be an interesting feature. I'll think about it.

There are some technical caveats to doing this now having to do with the QWebKit API being deprecrated in Qt in favor of the new QtWebEngine. The latter is missing features, and I am in limbo right now in regards to switching over to it. This makes me hesitant to add new WebKit-related features until I can switch to the QtWebEngine smoothly once it hopefully matures.

But like I said, I'll have to think about it.

@Menci

This comment has been minimized.

Show comment
Hide comment
@Menci

Menci May 13, 2016

Good, but it seems that ghostwriter doesn't highlight the math and code syntax while editing.

For example, when I am writing $ \sum\limits_{i = 1} ^ {n} i_2 $, ghostwriter treat it as italic text.

When I want to write some C++ code, like

#include <cstdio>

It will be treated as a title.

Menci commented May 13, 2016

Good, but it seems that ghostwriter doesn't highlight the math and code syntax while editing.

For example, when I am writing $ \sum\limits_{i = 1} ^ {n} i_2 $, ghostwriter treat it as italic text.

When I want to write some C++ code, like

#include <cstdio>

It will be treated as a title.

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle May 16, 2016

Owner

Well for C++ code, you should be using either backticks like so for inline:

`#include <cstdio>`

Or to use a code block indent with four spaces or a tab:

This is a paragraph.  Code follows:

    #include <cstdio>

And of course there's the code fence way:

```
#include <cstdio>
```

There's a Pandoc way too, but you get the idea.

As for MathJax highlighting, I'll think about it, but I'm leaning toward not doing it. It's truly an extension, and not every Markdown processor supports it out of the box. In fact, there are even alternative math formats supported by various processors (LaTeX and AsciiMath, for example). I somewhat support pipe tables highlighting because it's just so popular, it's almost become a standard of sorts among the different Markdown editors. However, if I support highlighting for every extension known to man, I will end up with a mangled mess of regular expressions in the code which may even conflict. For example, even among processors supporting MathJax, there is a conflict of how to use the dollar signs. I'd have to pick which one to "approve" of, preferring one syntax over the other in ghostwriter's highlighting. This is problematic, because I would be effectively not warning of bad syntax for different processors, and would even imply by its highlighting in certain cases that the syntax is OK when for that particular processor it actually isn't. I likewise have no energy to keep up with the different syntaxes and have ghostwriter support highlighting based on which processor is being used.

I hope all of that makes sense.

Owner

wereturtle commented May 16, 2016

Well for C++ code, you should be using either backticks like so for inline:

`#include <cstdio>`

Or to use a code block indent with four spaces or a tab:

This is a paragraph.  Code follows:

    #include <cstdio>

And of course there's the code fence way:

```
#include <cstdio>
```

There's a Pandoc way too, but you get the idea.

As for MathJax highlighting, I'll think about it, but I'm leaning toward not doing it. It's truly an extension, and not every Markdown processor supports it out of the box. In fact, there are even alternative math formats supported by various processors (LaTeX and AsciiMath, for example). I somewhat support pipe tables highlighting because it's just so popular, it's almost become a standard of sorts among the different Markdown editors. However, if I support highlighting for every extension known to man, I will end up with a mangled mess of regular expressions in the code which may even conflict. For example, even among processors supporting MathJax, there is a conflict of how to use the dollar signs. I'd have to pick which one to "approve" of, preferring one syntax over the other in ghostwriter's highlighting. This is problematic, because I would be effectively not warning of bad syntax for different processors, and would even imply by its highlighting in certain cases that the syntax is OK when for that particular processor it actually isn't. I likewise have no energy to keep up with the different syntaxes and have ghostwriter support highlighting based on which processor is being used.

I hope all of that makes sense.

@RoyiAvital

This comment has been minimized.

Show comment
Hide comment
@RoyiAvital

RoyiAvital May 16, 2016

Hi,
Math is there for most of MarkDown editors because MD targets mainly developers and students and both usually use math.

For instance, MarkDown is used to document code yet most codes in Signal Processing, Image Processing, Computer Vision, Machine Learning and Statistics use a lot of math which without some Math in document it won't be a good documentation.

MathJax is just a way to add LaTeX syntax into MD (Or any HTML).
Hence the use if the $ $ and $$ $$ which is just like in LaTeX for Math Blocks.

I think the easiest way would to add "Opt In" support for Math.
Namely, add a check box in settings which is "Off" by default.
You can also add a choice for the user to select the delimiters ($ $, $$ $$ or ( ) and [ ]) which are options in MathJax.

All needed is to add a Script of MathJax.

Thank You.

RoyiAvital commented May 16, 2016

Hi,
Math is there for most of MarkDown editors because MD targets mainly developers and students and both usually use math.

For instance, MarkDown is used to document code yet most codes in Signal Processing, Image Processing, Computer Vision, Machine Learning and Statistics use a lot of math which without some Math in document it won't be a good documentation.

MathJax is just a way to add LaTeX syntax into MD (Or any HTML).
Hence the use if the $ $ and $$ $$ which is just like in LaTeX for Math Blocks.

I think the easiest way would to add "Opt In" support for Math.
Namely, add a check box in settings which is "Off" by default.
You can also add a choice for the user to select the delimiters ($ $, $$ $$ or ( ) and [ ]) which are options in MathJax.

All needed is to add a Script of MathJax.

Thank You.

@RoyiAvital

This comment has been minimized.

Show comment
Hide comment
@RoyiAvital

RoyiAvital Jan 23, 2018

Any change in policy regarding MathJax?

Thank You.

RoyiAvital commented Jan 23, 2018

Any change in policy regarding MathJax?

Thank You.

@asmwarrior

This comment has been minimized.

Show comment
Hide comment
@asmwarrior

asmwarrior Apr 28, 2018

Now, the mathjax URL is changed, for me, I use this code:

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    extensions: ["tex2jax.js"],
    jax: ["input/TeX", "output/HTML-CSS"],
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
      processEscapes: true
    },
    "HTML-CSS": { fonts: ["TeX"] }
  });
</script>
<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

The old link cdn.mathjax.org is dead as discussed in this page: Mathjax Not Rendering · Issue #160 · jamiemcg/Remarkable, also please note that my code also support the inline math ( like $E=mc^2$), it also discussed in the above link, also the mathjax's official document: https://docs.mathjax.org/en/latest/configuration.html#using-in-line-configuration-options

My suggestion here is that for the ghostwriter, could it be possible to add a common "preamble” (like the latex preamble) section, for me, every markdown document need the Mathjax support, thus I don't need to add those scripts in every md files. (which is the same idea like the md files for another editor: typora)

With those preamble, I can manually enable many options, like Mathjax and many others stated in Draw Diagrams With Markdown. Thanks.

asmwarrior commented Apr 28, 2018

Now, the mathjax URL is changed, for me, I use this code:

<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    extensions: ["tex2jax.js"],
    jax: ["input/TeX", "output/HTML-CSS"],
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
      processEscapes: true
    },
    "HTML-CSS": { fonts: ["TeX"] }
  });
</script>
<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML">
</script>

The old link cdn.mathjax.org is dead as discussed in this page: Mathjax Not Rendering · Issue #160 · jamiemcg/Remarkable, also please note that my code also support the inline math ( like $E=mc^2$), it also discussed in the above link, also the mathjax's official document: https://docs.mathjax.org/en/latest/configuration.html#using-in-line-configuration-options

My suggestion here is that for the ghostwriter, could it be possible to add a common "preamble” (like the latex preamble) section, for me, every markdown document need the Mathjax support, thus I don't need to add those scripts in every md files. (which is the same idea like the md files for another editor: typora)

With those preamble, I can manually enable many options, like Mathjax and many others stated in Draw Diagrams With Markdown. Thanks.

@asmwarrior

This comment has been minimized.

Show comment
Hide comment
@asmwarrior

asmwarrior Apr 29, 2018

BTW: any one knows how to use a local (offline) version of the Mathjax.js? How can I change the src path

src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML"

to a local path(I'm using Windows 7). thanks.

asmwarrior commented Apr 29, 2018

BTW: any one knows how to use a local (offline) version of the Mathjax.js? How can I change the src path

src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML"

to a local path(I'm using Windows 7). thanks.

@nayrangnu

This comment has been minimized.

Show comment
Hide comment
@nayrangnu

nayrangnu Jun 25, 2018

While I agree with @asmwarrior about adding a 'preamble' section, another way to handle this (and to add a few other features) would be to add the ability to enable Pandoc extensions in the settings. There is a built-in ability to render math, along with putting Markdown inside HTML blocks and others. It might also make it easier to export to PDF while keeping the math intact.

The easiest solution would be to put a 'Pandoc Settings' section in the settings window with a text box to allow custom selection of extensions. Currently, only the Smart Typography extension appears to be used, but it looks like adding other extensions is possible using the same method.

nayrangnu commented Jun 25, 2018

While I agree with @asmwarrior about adding a 'preamble' section, another way to handle this (and to add a few other features) would be to add the ability to enable Pandoc extensions in the settings. There is a built-in ability to render math, along with putting Markdown inside HTML blocks and others. It might also make it easier to export to PDF while keeping the math intact.

The easiest solution would be to put a 'Pandoc Settings' section in the settings window with a text box to allow custom selection of extensions. Currently, only the Smart Typography extension appears to be used, but it looks like adding other extensions is possible using the same method.

@wereturtle

This comment has been minimized.

Show comment
Hide comment
@wereturtle

wereturtle Jun 28, 2018

Owner

The easiest solution would be to put a 'Pandoc Settings' section in the settings window with a text box to allow custom selection of extensions. Currently, only the Smart Typography extension appears to be used, but it looks like adding other extensions is possible using the same method.

Mathjax is already enabled by default in Pandoc. I was able to try the following with Pandoc with no additional inclusion of any JavaScript, and ghostwriter previewed the equation nicely:

The following is an equation for Pandoc:

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$
Owner

wereturtle commented Jun 28, 2018

The easiest solution would be to put a 'Pandoc Settings' section in the settings window with a text box to allow custom selection of extensions. Currently, only the Smart Typography extension appears to be used, but it looks like adding other extensions is possible using the same method.

Mathjax is already enabled by default in Pandoc. I was able to try the following with Pandoc with no additional inclusion of any JavaScript, and ghostwriter previewed the equation nicely:

The following is an equation for Pandoc:

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

Repository owner locked as resolved and limited conversation to collaborators Jun 28, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.