Fixed slider value not being updated on reloading

.eslintrc.json

@@ -5,7 +5,7 @@
     "node": true,
     "jest": true
   },
-  "extends": ["eslint:recommended", "prettier"],
+  "extends": ["eslint:recommended"],
   "globals": {
     "Atomics": "readonly",
     "SharedArrayBuffer": "readonly"

public/index.html

@@ -13,14 +13,16 @@
     />
     <script>
       if (navigator.serviceWorker) {
-        navigator.serviceWorker.register("service-worker.js").then(
-          (registration) =>
-            console.log(
-              `Service worker registered on scope ${registration.scope}`,
-            ),
-          (reason) =>
-            console.log(`Service worker failed to register ~ ${reason}`),
-        )
+        navigator.serviceWorker
+          .register("service-worker.js")
+          .then(
+            (registration) =>
+              console.log(
+                `Service worker registered on scope ${registration.scope}`,
+              ),
+            (reason) =>
+              console.log(`Service worker failed to register ~ ${reason}`),
+          )
       }
     </script>
   </head>

src/app.js

@@ -8,6 +8,7 @@ import * as HTML from "./elements.js"
 import { connect } from "./room.js"
 import * as toolSelection from "./tool-selection.js"
 import * as humanhash from "humanhash"
+import jdenticon from "jdenticon"
 
 const TEST_ROOM = "imperial"
 
@@ -161,7 +162,6 @@ const getOrInsertPeerById = (id) => {
 
   const peerElem = document.createElement("li")
 
-  const jdenticon = require("jdenticon")
   const avatarImage = document.createElement("svg")
   avatarImage.innerHTML = jdenticon.toSvg(id, 50)
   avatarImage.className = "avatar"

src/tool-selection.js

@@ -49,11 +49,18 @@ HTML.picker.addEventListener("change", () => {
 
 HTML.slider.oninput = function() {
   HTML.output.innerHTML = this.value
-  strokeRadius = this.value / 10
+  strokeRadius = this.value / 2
 }
 
 HTML.output.innerHTML = HTML.slider.value
 
+// If the page has been refreshed
+if (performance.navigation.type == 1) {
+  const sliderValue = parseInt(HTML.output.innerHTML)
+  HTML.slider.setAttribute("value", sliderValue)
+  strokeRadius = sliderValue / 2
+}
+
 const x = window.matchMedia(
   "only screen and (orientation: landscape) and (max-width: 600px)",
 )