From fc0479a1dc76030bcd423eed95f90180989d34b5 Mon Sep 17 00:00:00 2001
From: Bruno BELANYI <bruno@belanyi.fr>
Date: Sat, 20 Jul 2024 17:21:03 +0100
Subject: [PATCH] layouts: add Graphviz support

Similar to TikZ support.
---
 content/posts/2020-07-14-hello-world/index.md | 11 +++++++++++
 layouts/partials/head-extra.html              | 17 +++++++++++++++++
 layouts/shortcodes/graphviz.html              | 16 ++++++++++++++++
 3 files changed, 44 insertions(+)
 create mode 100644 layouts/shortcodes/graphviz.html

diff --git a/content/posts/2020-07-14-hello-world/index.md b/content/posts/2020-07-14-hello-world/index.md
index 805eb07..9eb06e8 100644
--- a/content/posts/2020-07-14-hello-world/index.md
+++ b/content/posts/2020-07-14-hello-world/index.md
@@ -8,6 +8,7 @@ tags:
 categories:
 favorite: false
 tikz: true
+graphviz: true
 ---
 
 ## Test post please ignore
@@ -40,6 +41,16 @@ echo hello world | cut -d' ' -f 1
   \end{tikzpicture}
 {{% /tikz %}}
 
+### Graphviz support
+
+{{% graphviz %}}
+  graph {
+    a -- b
+    b -- c
+    c -- a
+  }
+{{% /graphviz %}}
+
 ### Spoilers
 
 {{% spoiler "Don't open me" %}}
diff --git a/layouts/partials/head-extra.html b/layouts/partials/head-extra.html
index 1e65c9f..f0a049d 100644
--- a/layouts/partials/head-extra.html
+++ b/layouts/partials/head-extra.html
@@ -3,6 +3,23 @@
     <link rel="stylesheet" type="text/css" href="https://tikzjax.com/v1/fonts.css">
     <script async src="https://tikzjax.com/v1/tikzjax.js"></script>
 {{ end }}
+<!-- Graphviz support -->
+{{ if (.Params.graphviz) }}
+    <script src="https://cdn.jsdelivr.net/npm/@viz-js/viz@3.7.0/lib/viz-standalone.min.js"></script>
+    <script type="text/javascript">
+    (function() {
+        Viz.instance().then(function(viz) {
+            Array.prototype.forEach.call(document.querySelectorAll("pre.graphviz"), function(x) {
+                var svg = viz.renderSVGElement(x.innerText);
+                // Let CSS take care of the SVG size
+                svg.removeAttribute("width")
+                svg.setAttribute("height", "auto")
+                x.replaceChildren(svg)
+            })
+        })
+    })();
+    </script>
+{{ end }}
 {{ with .OutputFormats.Get "atom" -}}
     {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
 {{ end -}}
diff --git a/layouts/shortcodes/graphviz.html b/layouts/shortcodes/graphviz.html
new file mode 100644
index 0000000..45516a3
--- /dev/null
+++ b/layouts/shortcodes/graphviz.html
@@ -0,0 +1,16 @@
+<pre class="graphviz">
+    {{ with .Get "file" }}
+        {{ if eq (. | printf "%.1s") "/" }}
+            {{/* Absolute path are from root of site. */}}
+            {{ $.Scratch.Set "filepath" . }}
+        {{ else }}
+            {{/* Relative paths are from page directory. */}}
+            {{ $.Scratch.Set "filepath" $.Page.File.Dir }}
+            {{ $.Scratch.Add "filepath" . }}
+        {{ end }}
+
+        {{ $.Scratch.Get "filepath" | readFile }}
+    {{ else }}
+        {{.Inner}}
+    {{ end }}
+</pre>