add silksong path saving

renderer/index.html

@@ -81,7 +81,9 @@
   </template>
 
   <template id="settings-template">
-    <p>General settings</p>
+    <h2>General settings</h2>
+    <label for="silksong-path-label">Enter Silksong path: </label>
+    <input type="text" id="silksong-path-input" name="silksong-path-input">
   </template>
 
   <script src="renderer.js"></script>

renderer/renderer.js

@@ -10,13 +10,13 @@ const versionText = HomeTemplate.content.getElementById("version-text")
 
 navigate("home")
 
-function navigate(page) {
+async function navigate(page) {
   view.replaceChildren()
   switch (page) {
     case "home":
       title.innerText = "Home";
       const HomeTemplateCopy = HomeTemplate.content.cloneNode(true)
-      const versionText = HomeTemplateCopy.querySelector("#version-text")
+      const versionText = HomeTemplateCopy.getElementById("version-text")
       versionText.innerText =
         `Chrome version: (v${versions.chrome()}), ` +
         `Node.js version: (v${versions.node()}), Electron version: (v${versions.electron()})`
@@ -35,6 +35,17 @@ function navigate(page) {
 
     case "general-settings":
       const settingsTemplateCopy = settingsTemplate.content.cloneNode(true)
+      const silksongPathInput = settingsTemplateCopy.getElementById("silksong-path-input")
+
+      silksongPathInput.value = await window.save.loadSilksongPath()
+
+      silksongPathInput.addEventListener('input', async function(event) {
+        let silksongPath = silksongPathInput.value
+        console.log(silksongPath)
+        await window.save.saveSilksongPath(silksongPath)
+        console.log(await window.save.loadSilksongPath())
+      });
+
       view.appendChild(settingsTemplateCopy)
   }
 }

renderer/style.css

@@ -106,6 +106,14 @@ body {
   color: #ffffff;
 }
 
+.content h2 {
+  font-size: 24px;
+  margin-bottom: 20px;
+  color: #ffffff;
+  padding: 0 4px 4px;
+  border-bottom: 1px solid #ff6b6b; 
+}
+
 .view {
   width: 100%;
   background: rgba(0, 0, 0, 0.8);