Add Dropdown for Local Builds

builder.js

@@ -176,6 +176,8 @@ function init() {
     });
 
     decodeBuild(url_tag);
+
+    populateBuildList();
 }
 
 function getItemNameFromID(id) {
@@ -885,18 +887,34 @@ function shareBuild() {
     }
 }
 
+function populateBuildList() {
+    const buildList = document.getElementById("build-choice");
+    const savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
+
+    for (const buildName of Object.keys(savedBuilds).sort()) {
+        const buildOption = document.createElement("option");
+        buildOption.setAttribute("value", buildName);
+        buildList.appendChild(buildOption);
+    }
+}
+
 function saveBuild() {
     if (player_build) {
-        let savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
+        const savedBuilds = window.localStorage.getItem("builds") === null ? {} : JSON.parse(window.localStorage.getItem("builds"));
-        let saveName = document.getElementById("build-name").value;
+        const saveName = document.getElementById("build-name").value;
-        let encodedBuild = encodeBuild();
+        const encodedBuild = encodeBuild();
         if ((!Object.keys(savedBuilds).includes(saveName)
                 || document.getElementById("saved-error").textContent !== "") && encodedBuild !== "") {
             savedBuilds[saveName] = encodedBuild.replace("#", "");
             window.localStorage.setItem("builds", JSON.stringify(savedBuilds));
 
             document.getElementById("saved-error").textContent = "";
-            document.getElementById("saved-build").textContent = "Build saved Locally";
+            document.getElementById("saved-build").textContent = "Build saved locally";
+            
+            const buildList = document.getElementById("build-choice");
+            const buildOption = document.createElement("option");
+            buildOption.setAttribute("value", saveName);
+            buildList.appendChild(buildOption);
         } else {
             document.getElementById("saved-build").textContent = "";
             if (encodedBuild === "") {

index.html

@@ -157,7 +157,9 @@
                         <tr>
                             <td class="left">
                                 <label for="build-name">Build Name:</label><br>
-                                <input id="build-name" name="build-name"/>
+                                <input id="build-name" name="build-name" list="build-choice" />
+                                <datalist id="build-choice">
+                                </datalist>
 
                                 <!-- Dummy <p> tag for horizontal alignment -->
                                 <p style="top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; white-space: nowrap; word-break:break-word;"></p>