wrap dark mode stuff in an anonymous function like a big boy coder

assets/js/dark-mode.js

@@ -2,99 +2,103 @@
 
 // inspired by https://codepen.io/kevinpowell/pen/EMdjOV
 
-// lightbulb toggle re-appears now that we know user has JS enabled
+(function() {
-const toggle = document.querySelector('button#dark-mode-toggle');
+  'use strict';
-toggle.style.visibility = 'visible';
 
-// check for preset `dark_mode_pref` in localStorage
+  // lightbulb toggle re-appears now that we know user has JS enabled
-let pref = localStorage.getItem('dark_mode_pref');
+  const toggle = document.querySelector('button#dark-mode-toggle');
+  toggle.style.visibility = 'visible';
 
-// keep track of current state (light by default)
+  // check for preset `dark_mode_pref` in localStorage
-let activated = false;
+  let pref = localStorage.getItem('dark_mode_pref');
 
-// dynamically switch utteranc.es's theme
+  // keep track of current state (light by default)
-let utterancesInit = false;
+  let activated = false;
-const setUtterances = function() {
-  let theme = activated ? 'github-dark' : 'github-light';
-  const container = document.querySelector('div#comments');
 
-  // don't do any of this if we're not on a page with comments enabled
+  // dynamically switch utteranc.es's theme
-  if (container) {
+  let utterancesInit = false;
-    if (!utterancesInit) {
+  const setUtterances = function() {
-      const script = document.createElement('script');
+    let theme = activated ? 'github-dark' : 'github-light';
-      script.type = 'text/javascript';
+    const container = document.querySelector('div#comments');
-      script.async = true;
-      script.defer = true;
-      script.src = 'https://utteranc.es/client.js';
-      script.crossorigin = true;
-      script.setAttribute('data-repo', '{{ .Site.Params.github | safeJS }}');
-      script.setAttribute('data-issue-term', 'og:title');
-      script.setAttribute('data-theme', theme);
-      script.setAttribute('data-label', 'comments');
-      container.appendChild(script);
 
-      utterancesInit = true;
+    // don't do any of this if we're not on a page with comments enabled
-    } else {
+    if (container) {
-      const frame = document.querySelector('.utterances-frame');
+      if (!utterancesInit) {
+        const script = document.createElement('script');
+        script.type = 'text/javascript';
+        script.async = true;
+        script.defer = true;
+        script.src = 'https://utteranc.es/client.js';
+        script.crossorigin = true;
+        script.setAttribute('data-repo', '{{ .Site.Params.github | safeJS }}');
+        script.setAttribute('data-issue-term', 'og:title');
+        script.setAttribute('data-theme', theme);
+        script.setAttribute('data-label', 'comments');
+        container.appendChild(script);
 
-      // be extra sure frame exists
+        utterancesInit = true;
-      if (frame) {
+      } else {
-        // https://github.com/utterance/utterances/blob/4d9823c6c4f9a58365f06e2aa76c51b8cf5d5478/src/configuration-component.ts#L160
+        const frame = document.querySelector('.utterances-frame');
-        frame.contentWindow.postMessage({
+
-          type: 'set-theme',
+        // be extra sure frame exists
-          theme: theme
+        if (frame) {
-        }, '*');
+          // https://github.com/utterance/utterances/blob/4d9823c6c4f9a58365f06e2aa76c51b8cf5d5478/src/configuration-component.ts#L160
+          frame.contentWindow.postMessage({
+            type: 'set-theme',
+            theme: theme
+          }, '*');
+        }
       }
     }
+  };
+
+  const activateDarkMode = function() {
+    document.body.classList.remove('light');
+    document.body.classList.add('dark');
+
+    activated = true;
+
+    setUtterances();
+  };
+
+  const activateLightMode = function() {
+    document.body.classList.remove('dark');
+    document.body.classList.add('light');
+
+    activated = false;
+
+    setUtterances();
+  };
+
+  // if user already explicitly toggled in the past, restore their preference.
+  if (pref === 'true') activateDarkMode();
+  if (pref === 'false') activateLightMode();
+
+  // user has never clicked the button, so go by their OS preference until/if they do so
+  if (!pref) {
+    // check for OS dark mode setting and switch accordingly
+    // https://gist.github.com/Gioni06/eb5b28343bcf5793a70f6703004cf333#file-darkmode-js-L47
+    if (window.matchMedia('(prefers-color-scheme: dark)').matches)
+      activateDarkMode();
+    else
+      activateLightMode();
+
+    // real-time switching if supported by OS/browser
+    // TODO: stop listening when the parent condition becomes false,
+    //       right now these keep listening even if pref is set.
+    window.matchMedia('(prefers-color-scheme: dark)').addListener(function(e) { if (e.matches) activateDarkMode(); });
+    window.matchMedia('(prefers-color-scheme: light)').addListener(function(e) { if (e.matches) activateLightMode(); });
   }
-};
 
-const activateDarkMode = function() {
+  // handle lightbulb click
-  document.body.classList.remove('light');
+  toggle.addEventListener('click', function() {
-  document.body.classList.add('dark');
+    // switch to the opposite theme & save preference in local storage
-
+    if (!activated) {
-  activated = true;
+      activateDarkMode();
-
+      localStorage.setItem('dark_mode_pref', 'true');
-  setUtterances();
+    } else {
-};
+      activateLightMode();
-
+      localStorage.setItem('dark_mode_pref', 'false');
-const activateLightMode = function() {
+    }
-  document.body.classList.remove('dark');
+  }, true);
-  document.body.classList.add('light');
+})();
-
-  activated = false;
-
-  setUtterances();
-};
-
-// if user already explicitly toggled in the past, restore their preference.
-if (pref === 'true') activateDarkMode();
-if (pref === 'false') activateLightMode();
-
-// user has never clicked the button, so go by their OS preference until/if they do so
-if (!pref) {
-  // check for OS dark mode setting and switch accordingly
-  // https://gist.github.com/Gioni06/eb5b28343bcf5793a70f6703004cf333#file-darkmode-js-L47
-  if (window.matchMedia('(prefers-color-scheme: dark)').matches)
-    activateDarkMode();
-  else
-    activateLightMode();
-
-  // real-time switching if supported by OS/browser
-  // TODO: stop listening when the parent condition becomes false,
-  //       right now these keep listening even if pref is set.
-  window.matchMedia('(prefers-color-scheme: dark)').addListener(function(e) { if (e.matches) activateDarkMode(); });
-  window.matchMedia('(prefers-color-scheme: light)').addListener(function(e) { if (e.matches) activateLightMode(); });
-}
-
-// handle lightbulb click
-toggle.addEventListener('click', function() {
-  // switch to the opposite theme & save preference in local storage
-  if (!activated) {
-    activateDarkMode();
-    localStorage.setItem('dark_mode_pref', 'true');
-  } else {
-    activateLightMode();
-    localStorage.setItem('dark_mode_pref', 'false');
-  }
-}, true);

assets/vendor/emoji/emoji.js

@@ -7,7 +7,7 @@
 *
 */
 
-var emoji = (function (
+(function (
 
   // WARNING:   this file is generated automatically via
   //            `node scripts/build.js`
@@ -570,6 +570,4 @@ var emoji = (function (
     return r.join(sep || '-');
   }
 
-}());
+}()).parse(document.body);
-
-emoji.parse(document.body);

layouts/_default/baseof.html

@@ -10,6 +10,7 @@
 {{ block "main" . }}{{ end }}
 </div>
 {{ partialCached "page/footer" . }}
+{{ partial "scripts/_bundle" . }}
 {{ partial "scripts/shortcodes" . }}
 {{ if eq hugo.Environment "production" }}
   {{ partialCached "scripts/simple_analytics" . }}

layouts/partials/head/_head.html

@@ -8,5 +8,4 @@
 {{ partialCached "head/feeds" . -}}
 {{ partialCached "head/webmention" . -}}
 {{ partial "head/canonical" . -}}
-{{ partial "scripts/_bundle" . }}
 {{ partial "head/schema" . -}}

layouts/partials/scripts/simple_analytics.html

@@ -1,2 +1,2 @@
-<script async defer src="https://s.jarv.is/app.js" data-skip-dnt="true"></script>
+<script async defer src="https://s.jarv.is/latest.js" data-skip-dnt="true"></script>
 <noscript><img src="https://s.jarv.is/image.gif" alt=""></noscript>