From e6bcb8100f269f5e2aa0d19dd82a40947ab29b8d Mon Sep 17 00:00:00 2001
From: squidfunk <martin.donath@squidfunk.com>
Date: Sun, 23 Jan 2022 12:33:35 +0100
Subject: [PATCH] Updated Giscus example to support theme change without reload

---
 docs/setup/adding-a-comment-system.md | 12 +++++++++++-
 material/overrides/blog.html          |  2 +-
 src/overrides/blog.html               | 12 +++++++++++-
 3 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/docs/setup/adding-a-comment-system.md b/docs/setup/adding-a-comment-system.md
index a86ade118..3bfa77838 100644
--- a/docs/setup/adding-a-comment-system.md
+++ b/docs/setup/adding-a-comment-system.md
@@ -74,7 +74,17 @@ calling the `super()` function at the beginning of the block:
     document.addEventListener("DOMContentLoaded", function() {
       var ref = document.querySelector("[data-md-component=palette]")
       ref.addEventListener("change", function() {
-        location.reload()
+        var palette = __md_get("__palette")
+        if (palette && typeof palette.color === "object") {
+          var theme = palette.color.scheme === "slate" ? "dark" : "light"
+
+          /* Instruct Giscus to change theme */
+          var frame = document.querySelector(".giscus-frame")
+          frame.contentWindow.postMessage(
+            { giscus: { setConfig: { theme } } },
+            "https://giscus.app"
+          )
+        }
       })
     })
   </script>
diff --git a/material/overrides/blog.html b/material/overrides/blog.html
index 4b177e7e0..ae59b4cb7 100644
--- a/material/overrides/blog.html
+++ b/material/overrides/blog.html
@@ -6,5 +6,5 @@
   {{ super() }}
   <h2 id="__comments">{{ lang.t("meta.comments") }}</h2>
   <script src="https://giscus.app/client.js" data-repo="squidfunk/mkdocs-material" data-repo-id="MDEwOlJlcG9zaXRvcnk1MDYxNzQyOA==" data-category="_" data-category-id="DIC_kwDOAwRcVM4CAtJY" data-mapping="pathname" data-reactions-enabled="1" data-emit-metadata="1" data-theme="light" data-lang="en" crossorigin="anonymous" async></script>
-  <script>var giscus,palette=__md_get("__palette");palette&&"object"==typeof palette.color&&"slate"===palette.color.scheme&&(giscus=document.querySelector("script[src*=giscus]")).setAttribute("data-theme","dark"),document.addEventListener("DOMContentLoaded",function(){document.querySelector("[data-md-component=palette]").addEventListener("change",function(){location.reload()})})</script>
+  <script>var giscus,palette=__md_get("__palette");palette&&"object"==typeof palette.color&&"slate"===palette.color.scheme&&(giscus=document.querySelector("script[src*=giscus]")).setAttribute("data-theme","dark"),document.addEventListener("DOMContentLoaded",function(){document.querySelector("[data-md-component=palette]").addEventListener("change",function(){var e=__md_get("__palette");e&&"object"==typeof e.color&&(e="slate"===e.color.scheme?"dark":"light",document.querySelector(".giscus-frame").contentWindow.postMessage({giscus:{setConfig:{theme:e}}},"https://giscus.app"))})})</script>
 {% endblock %}
diff --git a/src/overrides/blog.html b/src/overrides/blog.html
index 32987668f..240090520 100644
--- a/src/overrides/blog.html
+++ b/src/overrides/blog.html
@@ -57,7 +57,17 @@
     document.addEventListener("DOMContentLoaded", function() {
       var ref = document.querySelector("[data-md-component=palette]")
       ref.addEventListener("change", function() {
-        location.reload()
+        var palette = __md_get("__palette")
+        if (palette && typeof palette.color === "object") {
+          var theme = palette.color.scheme === "slate" ? "dark" : "light"
+
+          /* Instruct Giscus to change theme */
+          var frame = document.querySelector(".giscus-frame")
+          frame.contentWindow.postMessage(
+            { giscus: { setConfig: { theme } } },
+            "https://giscus.app"
+          )
+        }
       })
     })
   </script>