Improved anchor jumps after instant loading and fixed Google Analytics

material/assets/manifest.json

@@ -1,6 +1,6 @@
 {
-  "assets/javascripts/bundle.js": "assets/javascripts/bundle.4de2b008.min.js",
+  "assets/javascripts/bundle.js": "assets/javascripts/bundle.b70c6ac3.min.js",
-  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.4de2b008.min.js.map",
+  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.b70c6ac3.min.js.map",
   "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.926ffd9e.min.js",
   "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.926ffd9e.min.js.map",
   "assets/stylesheets/main.css": "assets/stylesheets/main.1e07d700.min.css",

material/base.html

@@ -195,7 +195,7 @@
       {% endblock %}
     </div>
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/bundle.4de2b008.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.b70c6ac3.min.js' | url }}"></script>
       {%- set translations = {} -%}
       {%- for key in [
         "clipboard.copy",

material/partials/integrations/analytics.html

@@ -2,5 +2,5 @@
   This file was automatically generated - do not edit
 -#}
 {% set analytics = config.google_analytics %}
-<script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","{{ analytics[0] }}","{{ analytics[1] }}"),ga("set","anonymizeIp",!0),ga("send","pageview"),document.addEventListener("DOMContentLoaded",function(){document.forms.search&&document.forms.search.query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})})</script>
+<script>window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)},ga.l=+new Date,ga("create","{{ analytics[0] }}","{{ analytics[1] }}"),ga("set","anonymizeIp",!0),ga("send","pageview"),document.addEventListener("DOMContentLoaded",function(){document.forms.search&&document.forms.search.query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}),document.addEventListener("DOMContentSwitch",function(){ga("send","pageview")})</script>
 <script async src="https://www.google-analytics.com/analytics.js"></script>

src/assets/javascripts/index.ts

@@ -462,6 +462,9 @@ export function initialize(config: unknown) {
         .subscribe(([{ url, data }, { title, head }]) => {
           console.log("Done", url.href, data)
 
+          // trigger custom event
+          document.dispatchEvent(new CustomEvent("DOMContentSwitch"))
+
           // setDocumentTitle
           document.title = title
 
@@ -481,21 +484,20 @@ export function initialize(config: unknown) {
             }
           }
 
-          // // TODO: this doesnt work as expected
+          // search drawer close
-          // if (!data) {
+          useToggle("search").subscribe(el => {
-          //   const { hash } = new URL(href)
+            setToggle(el, false)
-          //   if (hash) {
+          })
-          //     const el = getElement(hash)
-          //     if (typeof el !== "undefined") {
-          //       el.scrollIntoView()
-          //       return
-          //     }
-          //   }
-          // }
 
-          // console.log(ev)
+          // // TODO: this doesnt work as expected
-          // if (!data)
+          if (url.hash) {
-          setViewportOffset(data || { y: 0 }) // push state!
+            console.log("hash data?", data)
+            const a = document.createElement("a")
+            a.href = url.hash
+            a.click()
+          } else {
+            setViewportOffset(data || { y: 0 }) // push state!
+          }
         })
 
     // internal$.subscribe(({ url }) => {

src/assets/javascripts/patches/script/index.ts

@@ -74,16 +74,10 @@ export function patchScripts(
   /* Evaluate all scripts via replacement */
   els$.subscribe(els => {
     for (const el of els) {
-      if (
+      if (el.src || /(^|\/javascript)$/i.test(el.type)) {
-        el.src || !el.type ||
-        /^(application|text)\/javascript$/i.test(el.type)
-      ) {
         const script = document.createElement("script")
-        if (el.src) {
+        const key = el.src ? "src" : "innerText"
-          script.src = el.src
+        script[key] = el[key]
-        } else {
-          script.innerText = el.innerText
-        }
         el.replaceWith(script)
       }
     }

src/partials/integrations/analytics.html

@@ -45,5 +45,10 @@
       })
     }
   })
+
+  /* Send page view on document switch (instant loading, custom event) */
+  document.addEventListener("DOMContentSwitch", function() {
+    ga("send", "pageview")
+  })
 </script>
 <script async src="https://www.google-analytics.com/analytics.js"></script>