Add mermaidjs support

README.md

@@ -21,5 +21,6 @@ set backupcopy=yes
 - [x] live reload when .md file changes
 - [x] directory files list on `/` endpoint
 - [x] LaTex support
+- [x] mermaidjs
 - [ ] graphviz
 - [ ] colour `<code>` with syntax highlighting

main.go

@@ -13,6 +13,8 @@ import (
 	"github.com/gorilla/websocket"
 )
 
+const version = "v0_20230626"
+
 var (
 	upgrader = websocket.Upgrader{
 		ReadBufferSize:  1024,
@@ -27,6 +29,8 @@ type PageModel struct {
 }
 
 func main() {
+	fmt.Println("md-live-server version:", version)
+
 	router := mux.NewRouter()
 	router.HandleFunc("/", getDir).Methods("GET")
 	router.HandleFunc("/{path}", getPage).Methods("GET")

templates.go

@@ -152,6 +152,8 @@ td{
 </div>
 
 
+<!-- TODO: make all the imports locally, to allow working offline -->
+
 <!-- LaTex renderization -->
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.css" integrity="sha384-Um5gpz1odJg5Z4HAmzPtgZKdTBHZdw8S29IecapCSB31ligYPhHQZMIlWLYQGVoc" crossorigin="anonymous">
 
@@ -161,6 +163,11 @@ td{
 <!-- To automatically render math in text elements, include the auto-render extension: -->
 <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/contrib/auto-render.min.js" integrity="sha384-vZTG03m+2yp6N6BNi5iM4rW4oIwk5DfcNdFfxkk9ZWpDriOkXX8voJBFrAO7MpVl" crossorigin="anonymous"></script>
 
+<!-- Mermaidjs -->
+<script type="module">
+  import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';
+</script>
+
 <script>
     document.addEventListener("DOMContentLoaded", function() {
         renderMathInElement(document.body, {
@@ -180,6 +187,7 @@ td{
 
 <script>
 (function() {
+
 	var conn = new WebSocket("ws://127.0.0.1:8080/ws/{{.Title}}");
 	conn.onclose = function(evt) {
 	    console.log('Connection closed');
@@ -203,7 +211,6 @@ td{
 		  // • rendering keys, e.g.:
 		  throwOnError : false
 		});
-
 	}
 })();
 

test.md

@@ -37,3 +37,12 @@ $y^2 = x^3 + 7$
 
 $\left(\frac{1}{\sqrt{x}}\right)$
 
+
+## Mermaid example
+
+<pre class="mermaid">
+graph LR
+    A --- B
+    B-->C[fa:fa-ban forbidden]
+    B-->D(fa:fa-spinner);
+</pre>