feat: put javascript into separate files

static/colorscheme.js

@@ -0,0 +1,20 @@
+var radios = document.getElementsByName("color-scheme");
+var prev = localStorage.getItem("color-scheme");
+for (var i = 0; i < radios.length; i++) {
+  var _this = radios[i];
+  _this.checked = _this.value == prev;
+  radios[i].addEventListener("change", function() {
+    if (this.value !== prev) {
+      prev = this.value;
+      localStorage.setItem("color-scheme", this.value);
+    }
+  });
+}
+var button = document.getElementById("clear-color-scheme");
+button.addEventListener("click", function() {
+  for (var i = 0; i < radios.length; i++) {
+    var _this = radios[i];
+    _this.checked = false;
+    localStorage.removeItem("color-scheme");
+  }
+});

static/nonoscript.js

@@ -0,0 +1,9 @@
+function nonoscriptImplementer() {
+  var nonoscript = document.getElementsByClassName("nonoscript");
+  console.log(nonoscript);
+  for (let item of nonoscript) {
+    console.log("meep!");
+    item.classList.remove("nonoscript");
+  }
+}
+window.onload = nonoscriptImplementer();

templates/colorscheme.html

@@ -49,26 +49,6 @@
 
 <noscript>Persistence of user-selected color scheme is not possible without Javascript, however automatic detection from CSS will still work.</noscript>
 
-<script>
+<script src="/colorscheme.js">
-  var radios = document.getElementsByName("color-scheme");
-  var prev = localStorage.getItem("color-scheme");
-  for (var i = 0; i < radios.length; i++) {
-    var _this = radios[i];
-    _this.checked = _this.value == prev;
-    radios[i].addEventListener("change", function() {
-      if (this.value !== prev) {
-        prev = this.value;
-        localStorage.setItem("color-scheme", this.value);
-      }
-    });
-  }
-  var button = document.getElementById("clear-color-scheme");
-  button.addEventListener("click", function() {
-    for (var i = 0; i < radios.length; i++) {
-      var _this = radios[i];
-      _this.checked = false;
-      localStorage.removeItem("color-scheme");
-    }
-  });
 </script>
 <!-- End of component for color scheme selection -->

templates/nonoscript.html

@@ -16,15 +16,6 @@
   ```
 -->
 
-<script>
+<script src="/nonoscript.js">
-  function nonoscriptImplementer() {
-    var nonoscript = document.getElementsByClassName("nonoscript");
-    console.log(nonoscript);
-    for (let item of nonoscript) {
-      console.log("meep!");
-      item.classList.remove("nonoscript");
-    }
-  }
-  window.onload = nonoscriptImplementer();
 </script>
 <!-- End of component for no-noscript -->