From e6c7a4e1e2e3b0437b5dbbbeb7abc4e05622db16 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Mon, 12 Sep 2022 01:03:55 +0000
Subject: [PATCH] fix: latex rendering bugs + patch for #195

---
 layouts/partials/head.html |  169 +++++++++++++++++++++++++++++++++++++++++++++-----------
 1 files changed, 135 insertions(+), 34 deletions(-)

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index a81c9ed..59b228a 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -1,44 +1,78 @@
+<!-- set data/config yaml file based on website language -->
+{{ $config := cond (eq $.Site.Language.Lang "en") "config" (printf "config.%s" $.Site.Language.Lang) }}
+{{ $data := index $.Site.Data $config }}
 <head>
   <!-- Meta tags -->
   <meta charset="UTF-8" />
   <meta
     name="description"
-    content="{{if .IsHome}}{{$.Site.Data.config.description}}{{else}}{{.Summary}}{{end}}"
+    content="{{if .IsHome}}{{$data.description | default $.Site.Data.config.description}}{{else}}{{.Summary}}{{end}}"
   />
   <title>
-    {{ if .Title }}{{ .Title }}{{ else }}{{ $.Site.Data.config.page_title }}{{
+    {{ if .Title }}{{ .Title }}{{ else }}{{ $data.page_title | default $.Site.Data.config.page_title }}{{
     end }}
   </title>
   <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <link
-    rel="shortcut icon"
-    type="image/png"
-    href="{{$.Site.BaseURL}}/icon.png"
-  />
+
+  <!-- HTML Favicon -->
+  {{ $favicon := $data.favicon  | default $.Site.Data.config.favicon | default (slice (dict "rel" "shortcut icon" "type" "image/png" "href" "icon.png")) }}
+  {{ $type := (printf "%T" $favicon) }}
+  {{ if eq $type "string" }}
+  {{ $favicon | safeHTML }}
+  {{ else }}
+  {{ range $favicon }}
+  <link rel="{{.rel}}" {{if .type}}type="{{.type}}"{{end}} {{if .sizes}}sizes="{{.sizes}}"{{end}} href="{{$.Site.BaseURL}}/{{.href}}" />
+  {{- end }}
+  {{ end }}
 
   <!-- CSS Stylesheets and Fonts -->
-  <link
-    href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Source+Sans+Pro:wght@400;600;700&family=Fira+Code:wght@400;700&display=swap"
-    rel="stylesheet"
-  />
   {{$sass := resources.Match "styles/[!_]*.scss" }}
   {{$css := slice }}
   {{range $sass}}
   {{$scss := . | resources.ToCSS (dict "outputStyle" "compressed") }}
   {{$css = $css | append $scss}}
   {{end}}
+  {{if $data.enableCallouts | default $.Site.Data.config.enableCallouts}}
+    {{$scss := resources.Get "styles/_callouts.scss" | resources.ToCSS (dict "outputStyle" "compressed") }}
+    {{$css = $css | append $scss}}
+  {{end}}
   {{$finalCss := $css | resources.Concat "styles.css" | resources.Fingerprint "md5" | resources.Minify  }}
   <link href="{{$finalCss.Permalink}}" rel="stylesheet" />
 
-  {{ $darkMode := resources.Get "js/darkmode.js" | resources.Fingerprint "md5" |
-  resources.Minify }}
-  <script src="{{$darkMode.Permalink}}"></script>
-  {{partial "katex.html" .}}
+  {{$lightSyntax := resources.Get "styles/_light_syntax.scss" | resources.ToCSS (dict "outputStyle" "compressed") | resources.Fingerprint "md5" | resources.Minify  }}
+  <link href="{{$lightSyntax.Permalink}}" rel="stylesheet" id="theme-link">
 
+   <!-- Base scripts -->
+  {{$scripts := (slice "js/darkmode.js" "js/util.js")}}
+  {{range $scripts}}
+  {{$scriptname := .}}
+  {{ $s := resources.Get $scriptname | resources.ExecuteAsTemplate $scriptname . | resources.Fingerprint "md5" | resources.Minify }}
+  <script src="{{$s.Permalink}}"></script>
+  {{end}}
+  {{partial "katex.html" .}}
+    
+  <script src="https://unpkg.com/@floating-ui/core@0.7.3"></script>
+  <script src="https://unpkg.com/@floating-ui/dom@0.5.4"></script>
   {{ $popover := resources.Get "js/popover.js" | resources.Fingerprint "md5" |
   resources.Minify }}
   <script src="{{$popover.Permalink}}"></script>
 
+  <!-- Optional scripts -->
+  {{ if $data.enableCodeBlockTitle | default $.Site.Data.config.enableCallouts }}
+  {{ $codeTitle := resources.Get "js/code-title.js" | resources.Fingerprint "md5" | resources.Minify }}
+  <script src="{{$codeTitle.Permalink}}"></script>
+  {{end}}
+
+  {{ if $data.enableCodeBlockCopy | default $.Site.Data.config.enableCodeBlockCopy }}
+  {{ $clipboard := resources.Get "js/clipboard.js" | resources.Fingerprint "md5" | resources.Minify }}
+  <script src="{{$clipboard.Permalink}}"></script>
+  {{ end }}
+
+  {{ if $data.enableCallouts | default $.Site.Data.config.enableCallouts }}
+  {{ $callouts := resources.Get "js/callouts.js" | resources.Fingerprint "md5" | resources.Minify }}
+  <script src="{{$callouts.Permalink}}"></script>
+  {{ end }}
+
   <!--  Preload page vars  -->
   {{$linkIndex := resources.Get "indices/linkIndex.json" | resources.Fingerprint
   "md5" | resources.Minify | }} {{$contentIndex := resources.Get
@@ -61,31 +95,98 @@
           links,
           content,
         }))
+
+      const render = () => {
+      // NOTE: everything within this callback will be executed for every page navigation. This is a good place to put JavaScript that loads or modifies data on the page, adds event listeners, etc. If you are only dealing with basic DOM replacement, use the init function
+
+      const siteBaseURL = new URL(BASE_URL);
+      const pathBase = siteBaseURL.pathname;
+      const pathWindow = window.location.pathname;
+      const isHome = pathBase == pathWindow;
+
+      {{if $data.enableCodeBlockCopy | default $.Site.Data.config.enableCodeBlockCopy -}}
+      addCopyButtons();
+      {{ end }}
+
+      {{if $data.enableSPA | default $.Site.Data.config.enableSPA -}}
+      addTitleToCodeBlocks();
+      {{ end }}
+
+      {{if $data.enableCallouts | default $.Site.Data.config.enableCallouts -}}
+      addCollapsibleCallouts();
+      {{ end }}
+     
+      {{if $data.enableLinkPreview | default $.Site.Data.config.enableLinkPreview}}
+      initPopover(
+        {{strings.TrimRight "/" .Site.BaseURL }},
+        {{$data.enableContextualBacklinks | default $.Site.Data.config.enableContextualBacklinks}},
+        {{$data.enableLatex | default $.Site.Data.config.enableLatex}}
+      )
+      {{end}}
+
+      {{if $data.enableFooter | default $.Site.Data.config.enableFooter}}
+      const footer = document.getElementById("footer")
+      if (footer) {
+        const container = document.getElementById("graph-container")
+        // retry if the graph is not ready
+        if (!container) return requestAnimationFrame(render)
+        // clear the graph in case there is anything within it
+        container.textContent = ""
+
+        const drawGlobal = isHome && {{$.Site.Data.graphConfig.enableGlobalGraph}};
+        drawGraph(
+            {{strings.TrimRight "/" .Site.BaseURL}},
+            drawGlobal,
+            {{$.Site.Data.graphConfig.paths}},
+            drawGlobal ? {{$.Site.Data.graphConfig.globalGraph}} : {{$.Site.Data.graphConfig.localGraph}}
+          );
+
+        }
+      {{end}}
+    }
+
+    const init = (doc = document) => {
+      // NOTE: everything within this callback will be executed for initial page navigation. This is a good place to put JavaScript that only replaces DOM nodes.
+      {{if $data.enableCodeBlockCopy | default $.Site.Data.config.enableCodeBlockCopy -}}
+      addCopyButtons();
+      {{ end }}
+
+      {{if $data.enableCodeBlockTitle | default $.Site.Data.config.enableCodeBlockTitle -}}
+      addTitleToCodeBlocks();
+      {{- end -}}
+      {{if $data.enableLatex | default $.Site.Data.config.enableLatex}}
+      renderMathInElement(doc.body, {
+        delimiters: [
+          {left: '$$', right: '$$', display: true},
+          {left: '$', right: '$', display: false},
+        ],
+        macros: {
+          '’': "'"
+        },
+        throwOnError : false
+      });
+      {{end}}
+    };
   </script>
-  {{if $.Site.Data.config.enableSPA}}
+  {{if $data.enableSPA | default $.Site.Data.config.enableSPA}}
   {{ $router := resources.Get "js/router.js" | resources.Fingerprint "md5" |
   resources.Minify }}
   <script type="module">
-    import { init } from '{{$router.Permalink}}';
-    // NOTE: everything within this callback will be executed for every page navigation. This is a good place to put JavaScript that loads or modifies data on the page.
-    init(() => {
-      drawGraph(
-        {{strings.TrimRight "/" .Page.Permalink}},
-        {{strings.TrimRight "/" .Site.BaseURL}},
-        {{$.Site.Data.graphConfig.paths}},
-        {{$.Site.Data.graphConfig.depth}},
-        {{$.Site.Data.graphConfig.enableDrag}},
-        {{$.Site.Data.graphConfig.enableLegend}},
-        {{$.Site.Data.graphConfig.enableZoom}}
-      );
-
-      {{if $.Site.Data.config.enableLinkPreview}}
-        initPopover({{strings.TrimRight "/" .Site.BaseURL }})
-      {{end}}
-    });
+    import { attachSPARouting } from "{{$router.Permalink}}"
+    attachSPARouting(init, render)
   </script>
   {{else}}
-  <script>window.navigate = (url) => window.location.href = url</script>
+  <script>
+    window.Million = {
+      navigate: (url) => (window.location.href = url),
+      prefetch: () => {},
+    }
+
+    window.addEventListener("DOMContentLoaded", () => {
+      init()
+      render()
+    })
+  </script>
   {{end}}
 </head>
 {{ template "_internal/google_analytics.html" . }}

--
Gitblit v1.10.0