Move buttons are no longer re-created every time the game refreshes

satiate.js

@@ -83,6 +83,7 @@ function init(story) {
   initWorld(story, state);
   initAudio(story, state);
   initGame(story, state);
+  resetControls(state);
 
   story.intro.setup(state);
 

world.js

@@ -11,6 +11,14 @@ dirs = {
   "descend": "Down"
 }
 
+moveListeners = {
+
+}
+
+actionListeners = {
+
+}
+
 function initWorld(story, state) {
   state.world = story["world"];
   initRoomState(state);
@@ -23,6 +31,25 @@ function initRoomState(state) {
   });
 }
 
+function resetControls(state) {
+  const moveHolder = document.querySelector("#move-holder");
+
+  moveHolder.innerHTML = "";
+
+  Object.entries(dirs).forEach(([dir, name]) => {
+    const button = document.createElement("button");
+    button.classList.add("move-button")
+    button.id = "move-" + dir;
+    button.classList.add("disabled");
+    button.setAttribute("disabled", "true");
+    button.textContent = dirs[dir];
+    moveHolder.appendChild(button);
+
+    moveListeners[dir] = undefined;
+  });
+}
+
+
 function showActionDescription(desc) {
   const descHolder = document.querySelector("#desc");
 
@@ -69,6 +96,8 @@ function moveToRoom(src, exit, dest, state) {
 
   state.player.location = dest;
 
+  resetControls();
+
   refresh();
 }
 
@@ -92,6 +121,8 @@ function goToRoom(dest, state) {
 
   state.player.location = dest;
 
+  resetControls();
+
   refresh();
 }
 
@@ -109,18 +140,11 @@ function updateRoom(state) {
   areaName.textContent = room.name;
   areaDesc.textContent = room.desc;
 
-  const moveHolder = document.querySelector("#move-holder");
-
-  moveHolder.innerHTML = "";
-
   Object.entries(dirs).forEach(([dir, name]) => {
-    const button = document.createElement("button");
-    button.classList.add("move-button")
-    button.id = "move-" + dir;
+    const button = document.querySelector("#move-" + dir);
     button.classList.add("disabled");
     button.setAttribute("disabled", "true");
     button.textContent = dirs[dir];
-    moveHolder.appendChild(button);
   });
 
   if (room.exits) {
@@ -148,11 +172,19 @@ function updateRoom(state) {
       button.classList.remove("disabled");
       button.removeAttribute("disabled");
 
-      button.addEventListener("click", () => {
-        // todo: log
+      if (moveListeners[dir]) {
+        button.removeEventListener("click", moveListeners[dir]);
+        moveListeners[dir] = undefined;
+      }
+
+      moveFunc = () => {
         moveToRoom(room, exit, exit.target, state);
-      })
+      };
+
+      button.addEventListener("click", moveFunc);
 
+      moveListeners[dir] = moveFunc;
+      
       button.addEventListener("mouseenter", () => {
         showActionDescription(exit.desc);
       });