Switch colors from anonymous functions to getters

game.js

@@ -36,7 +36,7 @@ function createStatDisplays(stats, statType) {
 
       const bar = document.createElement("div");
       bar.classList.add("stat-bar");
-      bar.style["background-color"] = val.color(val);
+      bar.style["background-color"] = val.color;
 
       field.appendChild(label);
       field.appendChild(bar);
@@ -96,7 +96,7 @@ function updateStatDisplay(stats, statType) {
 
       if (val.type == "meter") {
         const bar = document.querySelector("#" + statType + "-info-" + key + " > .stat-bar");
-        bar.style["background-color"] = val.color(val);
+        bar.style["background-color"] = val.color;
       }
     }
 

stories/demo.js

@@ -9,8 +9,8 @@ stories.push({
     "start": "Home",
     "setup": () => {
       state.info.time.value = 3600;
-      state.player.stats.oofs = {name: "Oofs", type: "meter", value: 0, max: 10, color: (self) => { console.log('hi'); return "rgb(" + (155 + self.value*10) + ",0,0)"}};
-      state.player.stats.number = {name: "Number", type: "counter", value: 0, max: 10, color: () => "rgb(255,255,255)"};
+      state.player.stats.oofs = {name: "Oofs", type: "meter", value: 0, max: 10, get color() { return "rgb(" + (155 + this.value*10) + ",0,0)"}};
+      state.player.stats.number = {name: "Number", type: "counter", value: 0, max: 10, color: "rgb(255,255,255)"};
     },
     "intro": () => {
       print(["don't fall down the stairs ok"]);

stories/fen-snack.js

@@ -33,8 +33,8 @@ stories.push({
     start: "stomach",
     setup: () => {
       state.info.time.value = 86400 - 60 * 25 - 25;
-      state.player.stats.health = {name: "Health", type: "meter", value: 100, min: 0, max: 100, color: (self) => "rgb(" + (155+self.value) + ",0,0)"};
-      state.player.stats.stamina = {name: "Stamina", type: "meter", value: 100, min: 0, max: 100, color: (self) => "rgb(100," + (155+self.value) + ",0)"};
+      state.player.stats.health = {name: "Health", type: "meter", value: 100, min: 0, max: 100, get color() {return "rgb(" + (155+this.value) + ",0,0)"}};
+      state.player.stats.stamina = {name: "Stamina", type: "meter", value: 100, min: 0, max: 100, get color() {return "rgb(100," + (155+this.value) + ",0)"}};
 
       startTimer({
         id: "taunting",