Use one shared html file for the syntax highlighting

Using Olivier's idea to check the meta tag, we can distinguish rustdoc
from "the rest". The html is included in mdbook by directly by
symlinking head.hbs.

.github/workflows/ci.yaml

@@ -305,7 +305,7 @@ jobs:
       # allow deprecated warning because we are using nightly and some things might be deprecated in nightly
       # for which the stable alternative is not yet available
       RUSTFLAGS: -D warnings -W deprecated
-      RUSTDOCFLAGS: --html-in-header=/home/runner/work/sixtyfps/sixtyfps/docs/html/sixtyfps-docs-preview.html --html-in-header=/home/runner/work/sixtyfps/sixtyfps/docs/html/sixtyfps-docs-highlight-rust.html -D warnings -W deprecated
+      RUSTDOCFLAGS: --html-in-header=/home/runner/work/sixtyfps/sixtyfps/docs/html/sixtyfps-docs-preview.html --html-in-header=/home/runner/work/sixtyfps/sixtyfps/docs/html/sixtyfps-docs-highlight.html -D warnings -W deprecated
       SIXTYFPS_NO_QT: 1
       CARGO_INCREMENTAL: false
       MDBOOK_VERSION: 0.4.10

api/sixtyfps-cpp/docs/_templates/layout.html

@@ -2,5 +2,5 @@
 {% block scripts %}
 {{ super() }}
 {% include "../../../../docs/html/sixtyfps-docs-preview.html" %}
-{% include "../../../../docs/html/sixtyfps-docs-highlight-cpp.html" %}
+{% include "../../../../docs/html/sixtyfps-docs-highlight.html" %}
 {% endblock %}

api/sixtyfps-rs/Cargo.toml

@@ -31,4 +31,4 @@ pin-weak = "1"
 rustc_version = "0.4"
 
 [package.metadata.docs.rs]
-rustdoc-args = [ "--html-in-header", "docs/html/sixtyfps-docs-preview.html", "--html-in-header", "docs/html/sixtyfps-docs-highlight-rust.html" ]
+rustdoc-args = [ "--html-in-header", "docs/html/sixtyfps-docs-preview.html", "--html-in-header", "docs/html/sixtyfps-docs-highlight.html" ]

docs/building.md

@@ -125,7 +125,7 @@ html to the documentation with the `--html-in-header` rustdoc flag.
 Here is how to build the documentation to include preview of the .60 files.
 
 ```sh
-RUSTDOCFLAGS="--html-in-header=$PWD/docs/html/sixtyfps-docs-preview.html --html-in-header=$PWD/docs/html/sixtyfps-docs-highlight-rust.html" cargo +nightly doc --no-deps
+RUSTDOCFLAGS="--html-in-header=$PWD/docs/html/sixtyfps-docs-preview.html --html-in-header=$PWD/docs/html/sixtyfps-docs-highlight.html" cargo +nightly doc --no-deps
 ```
 
 ### C++ doc

docs/html/sixtyfps-docs-highlight-cpp.html

@@ -1,16 +0,0 @@
-<!--
-    This file is used to add syntax highlighting of the `.60` snippets in the generated C++ documentation.
-    It is injected in the Sphinx documentation via _templates/layout.html.
--->
-<link rel="stylesheet" href="https://sixtyfps.io/highlight-default.css">
-<script src="https://sixtyfps.io/highlight.pack.js"></script>
-<script src="https://sixtyfps.io/highlight_60.js"></script>
-<script>
-    window.addEventListener("DOMContentLoaded", () => {
-        // The Sphinx/my_st generated HTML for code blocks does not use <code> tags, so highlight.js'
-        // default selector "pre code" does not match. Let's do it by hand:
-        for (block of document.querySelectorAll("div.highlight-60 div.highlight pre")) {
-            hljs.highlightBlock(block)
-        }
-    });
-</script>

docs/html/sixtyfps-docs-highlight-rust.html

@@ -1,40 +0,0 @@
-<!--
-    This file is used to add syntax highlighting of the `.60` snippets in the generated rustdoc documentation.
-    It can be injected via the `--html-in-header sixtyfps-docs-highlight-rust.html` option of rustdoc.
--->
-<link rel="stylesheet" href="https://sixtyfps.io/highlight-default.css">
-<script src="https://sixtyfps.io/highlight.pack.js"></script>
-<script src="https://sixtyfps.io/highlight_60.js"></script>
-<script>
-    window.addEventListener("DOMContentLoaded", () => {
-        // Only highlight .60 blocks, leave the others to rustdoc
-        for (dot60Block of document.querySelectorAll("pre code.language-60")) {
-            hljs.highlightBlock(dot60Block)
-        }
-
-        // Some of the rustdoc selectors require the pre element to have the rust class
-        for (codeBlock of document.querySelectorAll(".language-60.hljs")) {
-            codeBlock.parentElement.classList.add("rust")
-        }
-
-        // Change the hljs generated classes to the rustdoc
-        // ones, so that the highlighting adjusts to the theme correctly.
-        const highlightJSToRustDoc = [
-            ["comment", "comment"],
-            ["number", "number"],
-            ["symbol", "struct"], // width:
-            ["keyword", "kw"],
-            ["built_in", "primitive"],
-            ["string", "string"],
-            ["title", "fnname"], // Foo :=
-            ["type", "type"]
-        ];
-
-        for ([hljs_class, rustdoc_class] of highlightJSToRustDoc) {
-            for (titleElement of document.querySelectorAll(`.hljs-${hljs_class}`)) {
-                titleElement.classList.remove(`hljs-${hljs_class}`);
-                titleElement.classList.add(rustdoc_class);
-            }
-        }
-    });
-</script>

docs/html/sixtyfps-docs-highlight.html

@@ -0,0 +1,53 @@
+<!--
+    This file is used to add syntax highlighting of the `.60` snippets in the generated rustdoc, sphinx and mdbook documentation.
+    It can be injected via the `--html-in-header sixtyfps-docs-highlight.html` option of rustdoc, is included via _templates/layout.html
+    in sphinx and via head.hbs in mdbook.
+-->
+<link rel="stylesheet" href="https://sixtyfps.io/highlight-default.css">
+<script src="https://sixtyfps.io/highlight.pack.js"></script>
+<script src="https://sixtyfps.io/highlight_60.js"></script>
+<script>
+  window.addEventListener("DOMContentLoaded", () => {
+    const rustDoc = document.querySelector('meta[name="generator"]')?.content == "rustdoc";
+    if (rustDoc) {
+      // Only highlight .60 blocks, leave the others to rustdoc
+      for (dot60Block of document.querySelectorAll("pre code.language-60")) {
+        hljs.highlightBlock(dot60Block)
+      }
+
+      // Some of the rustdoc selectors require the pre element to have the rust class
+      for (codeBlock of document.querySelectorAll(".language-60.hljs")) {
+        codeBlock.parentElement.classList.add("rust")
+      }
+
+      // Change the hljs generated classes to the rustdoc
+      // ones, so that the highlighting adjusts to the theme correctly.
+      const highlightJSToRustDoc = [
+        ["comment", "comment"],
+        ["number", "number"],
+        ["symbol", "struct"], // width:
+        ["keyword", "kw"],
+        ["built_in", "primitive"],
+        ["string", "string"],
+        ["title", "fnname"], // Foo :=
+        ["type", "type"]
+      ];
+
+      for ([hljs_class, rustdoc_class] of highlightJSToRustDoc) {
+        for (titleElement of document.querySelectorAll(`.hljs-${hljs_class}`)) {
+          titleElement.classList.remove(`hljs-${hljs_class}`);
+          titleElement.classList.add(rustdoc_class);
+        }
+      }
+    } else {
+      // For use with the mdbook Tutorial
+      hljs.initHighlighting();
+
+      // The Sphinx/my_st generated HTML for code blocks does not use <code> tags, so highlight.js'
+      // default selector "pre code" does not match. Let's do it by hand:
+      for (block of document.querySelectorAll("div.highlight-60 div.highlight pre")) {
+        hljs.highlightBlock(block)
+      }
+    }
+  });
+</script>

docs/tutorial/theme/head.hbs

@@ -1,4 +0,0 @@
-<link rel="stylesheet" href="https://sixtyfps.io/highlight-default.css">
-<script src="https://sixtyfps.io/highlight.pack.js"></script>
-<script src="https://sixtyfps.io/highlight_60.js"></script>
-<script>hljs.initHighlightingOnLoad();</script>

docs/tutorial/theme/head.hbs

@@ -0,0 +1 @@
+../../html/sixtyfps-docs-highlight.html