All: Allow toggling markdown plugins and added several new plugins (#…

…1347)

* Initial test of enabling plugins

* Added support for toggle-able plugins
- Also adds some new plugins

* Add instructions on adding toggle-plugins

* Fix subtle anchor bug
- webview was moving itself when scrolling to bottom anchors

* Moves the webview hack so that it only applies to anchors

* Add plugin descriptions to the README, also removed mermaid from README

* rename plugin.* to markdown.plugin.* to be more forward compatible

ElectronClient/app/gui/note-viewer/index.html

@@ -106,15 +106,13 @@
 
 		let previousContentHeight = contentElement.scrollHeight;
 		let startTime = Date.now();
-		ignoreNextScrollEvent = true;
 		restorePercentScroll();
 
 		if (!checkScrollIID_) {
 			checkScrollIID_ = setInterval(() => {
 				const h = contentElement.scrollHeight;
 				if (h !== previousContentHeight) {
 					previousContentHeight = h;
-					ignoreNextScrollEvent = true;
 					restorePercentScroll();
 				}
 				if (Date.now() - startTime >= 1000) {

ElectronClient/app/package.json

@@ -107,7 +107,18 @@
     "lodash": "^4.17.10",
     "mark.js": "^8.11.1",
     "markdown-it": "^8.4.1",
+    "markdown-it-abbr": "^1.0.4",
+    "markdown-it-anchor": "^5.0.2",
+    "markdown-it-deflist": "^2.0.3",
+    "markdown-it-emoji": "^1.4.0",
+    "markdown-it-footnote": "^3.0.1",
+    "markdown-it-ins": "^2.0.0",
     "markdown-it-katex": "^2.0.3",
+    "markdown-it-mark": "^2.0.0",
+    "markdown-it-multimd-table": "^3.1.3",
+    "markdown-it-sub": "^1.0.0",
+    "markdown-it-sup": "^1.0.0",
+    "markdown-it-toc-done-right": "^3.0.1",
     "md5": "^2.2.1",
     "mime": "^2.3.1",
     "moment": "^2.22.2",

README.md

@@ -251,23 +251,23 @@ You can create a link to a note by specifying its ID in the URL. For example:
 
 Since getting the ID of a note is not straightforward, each app provides a way to create such link. In the **desktop app**, right click on a note an select "Copy Markdown link". In the **mobile app**, open a note and, in the top right menu, select "Copy Markdown link". You can then paste this link anywhere in another note.
 
-## Charts
-
-You can create charts in Joplin using the [Mermaid syntax](https://mermaidjs.github.io/). To add such a graph, wrap the Mermaid script inside a "\`\`\`mermaid" code block like this:
-
-	```mermaid
-	graph TD;
-	    A-->B;
-	    A-->C;
-	    B-->D;
-	    C-->D;
-	```
-
-This is how it would look with the Markdown on the left, and rendered graph on the right:
-
-<img src="https://joplin.cozic.net/images/Mermaid.png" height="232px">
-
-Note that Mermaid graphs are always rendered on a white background regardless of the current theme. This is because they can contain various colours that may not be compatible with the current theme.
+## Plugins
+
+Joplin supports a number of plugins that can be toggled on top the standard markdown features you would expect. These toggle-able plugins are listed below. Note: not all of the plugins are enabled by default, if the enable field is 'no' below, then enter Tools->General Options to enable the plugin. Plugins can be disabled in the same manner.
+
+| Plugin | Syntax | Description | Enabled |
+|--------|--------|-------------|---------|
+| [Katex](https://katex.org) | `$$math expr$$` or `$math$` | [See Below](https://github.com/laurent22/joplin#math-notation) | yes |
+| [Mark](https://github.com/markdown-it/markdown-it-mark) | `==marked==` | Transforms into `<mark>marked</mark>` (highlighted) | yes |
+| [Footnote](https://github.com/markdown-it/markdown-it-footnote) | `Simples inline footnote ^[I'm inline!]` | See [plugin page](https://github.com/markdown-it/markdown-it-footnote) for full description | yes |
+| [TOC](https://github.com/nagaozen/markdown-it-toc-done-right) | Any of `${toc}, [[toc]], [toc], [[_toc_]]` | Adds a table of contents to the location of the toc page. Based on headings and sub-headings | no |
+| [Sub](https://github.com/markdown-it/markdown-it-sub) | `X~1~` | Transforms into X<sub>1</sub> | no |
+| [Sup](https://github.com/markdown-it/markdown-it-sup) | `X^2^` | Transforms into X<sup>2</sup> | no |
+| [Deflist](https://github.com/markdown-it/markdown-it-deflist) | See [pandoc](http://johnmacfarlane.net/pandoc/README.html#definition-lists) page for syntax | Adds the html `<dl>` tag accessible through markdown | no |
+| [Abbr](https://github.com/markdown-it/markdown-it-abbr) | *[HTML]: Hyper Text Markup Language | Allows definition of abbreviations that can be hovered over later for a full expansion | no |
+| [Emoji](https://github.com/markdown-it/markdown-it-emoji) | `:smile:` :smile: | See [this list](https://gist.github.com/rxaviers/7360908) for more emoji | no |
+| [Insert](https://github.com/markdown-it/markdown-it-ins) | `++inserted++` | Transforms into `<ins>inserted</ins>` (<ins>inserted</ins>) | no |
+| [Multitable](https://github.com/RedBug312/markdown-it-multimd-table) | See [MultiMarkdown](https://fletcher.github.io/MultiMarkdown-6/syntax/tables.html) page | Adds more power and customization to markdown tables | no |
 
 ## Math notation