Consolidate info update into one function; add area info

game.js

@@ -77,31 +77,16 @@ function renderTime(time) {
   return hours + ":" + minutes + ":" + seconds + " " + ampm;
 }
 
-function updateWorldInfo(state) {
-  Object.entries(state.info).forEach(([key, val]) => {
-
-    if (val.type == "meter") {
-      const field = document.querySelector("#world-info-" + key + " > .stat-bar");
-      field.style.width = (val.value / val.max * 100) + "%";
-    } else if (val.type == "counter") {
-      const field = document.querySelector("#world-info-" + key);
-      field.innerText = val.name + ": " + val.render;
-    }
-
-  });
-}
-
-function updatePlayerInfo(state) {
-  Object.entries(state.player.stats).forEach(([key, val]) => {
+function updateStatDisplay(stats, statType) {
+  Object.entries(stats).forEach(([key, val]) => {
 
     if (val.type == "meter") {
-      const field = document.querySelector("#player-info-" + key + " > .stat-bar");
+      const field = document.querySelector("#" + statType + "-info-" + key + " > .stat-bar");
       field.style.width = (val.value / val.max * 100) + "%";
     } else if (val.type == "counter") {
-      const field = document.querySelector("#player-info-" + key);
-      field.innerText = val.name + ": " + val.value;
+      const field = document.querySelector("#" + statType + "-info-" + key);
+      field.innerText = val.name + ": " + (val.render !== undefined ? val.render : val.value);
     }
-
   });
 }
 

satiate.js

@@ -24,8 +24,9 @@ function print(lines) {
 
 function refresh() {
   updateRoom(state);
-  updateWorldInfo(state);
-  updatePlayerInfo(state);
+  updateStatDisplay(state.info, "world");
+  updateStatDisplay(state.player.stats, "player");
+  updateStatDisplay(state.world[state.player.location].data.stats, "area");
 
   if (refreshHook) {
     refreshHook(state)

stories/demo.js

@@ -97,7 +97,12 @@ stories.push({
           print(["This is a test of the hooks"]);
           return true;
         }
-      ]
+      ],
+      "data": {
+        "stats": {
+          number: {name: "Seconds In Room", type: "counter", value: 0, color: "rgb(255,0,0)"}
+        }
+      }
     },
     "Locked Room": {
       "id": "Locked Room",
@@ -134,6 +139,11 @@ stories.push({
             }
           ]
         }
+      },
+      "data": {
+        "stats": {
+          
+        }
       }
     }
   }

world.js

@@ -142,6 +142,8 @@ function goToRoom(dest, state) {
 function updateRoom(state) {
   const name = state.player.location;
   const room = state.world[name];
+  
+  createStatDisplays(room.data.stats, "area");
 
   if (!state.player.rooms[room.id]) {
     state.player.rooms[room.id] = {};