From f051dcbc30edb84d431b624e9e7f6c83af807ddd Mon Sep 17 00:00:00 2001
From: Fen Dweller <chemicalcrux@gmail.com>
Date: Fri, 20 Jul 2018 11:15:54 -0500
Subject: [PATCH] Upgrades have a cost. Added cost to tooltip (so much for
 using the "right tense" in commit messages lul)

---
 constants.js | 16 +++++++++++++++-
 gorge.css    |  7 +++++++
 gorge.html   |  1 +
 gorge.js     | 15 +++++++++++++++
 4 files changed, 38 insertions(+), 1 deletion(-)

diff --git a/constants.js b/constants.js
index 2167b4f..b364fa5 100644
--- a/constants.js
+++ b/constants.js
@@ -1,5 +1,10 @@
 "use strict";
 
+const resourceTypes = {
+  "food": {
+    name: "Food"
+  }
+}
 const buildings = {
   "micro": {
     "name": "Micro",
@@ -48,6 +53,9 @@ const upgrades = {
   "micro-prod-1": {
     "name": "Bigger Micros",
     "desc": "A macro micro? Certainly more filling.",
+    "cost": {
+      "food": 100
+    },
     "effect": {
       "type": "prod-2x",
       "target": "micro"
@@ -56,6 +64,12 @@ const upgrades = {
   "micro-prod-2": {
     "name": "Beefy Micros",
     "desc": "25% more protein, 10% fewer carbs.",
-    "effect": "prod-2x"
+    "cost": {
+      "food": 500
+    },
+    "effect": {
+      "type": "prod-2x",
+      "target": "micro"
+    }
   }
 }
diff --git a/gorge.css b/gorge.css
index 05326a7..bc29257 100644
--- a/gorge.css
+++ b/gorge.css
@@ -91,6 +91,13 @@ body.dark {
   position: absolute;
   top: 50px;
 }
+
+#upgrade-tooltip-cost {
+  position: absolute;
+  right: 0px;
+  bottom: 0px;
+}
+
 .upgrade-button {
   width: 75px;
   height: 75px;
diff --git a/gorge.html b/gorge.html
index a47710f..acec4ac 100644
--- a/gorge.html
+++ b/gorge.html
@@ -31,6 +31,7 @@
     <div id="upgrade-tooltip">
       <div id="upgrade-tooltip-desc"></div>
       <div id="upgrade-tooltip-effect"></div>
+      <div id="upgrade-tooltip-cost"></div>
     </div>
     <div id="upgrades-list"></div>
   </div>
diff --git a/gorge.js b/gorge.js
index cc364af..63f24da 100644
--- a/gorge.js
+++ b/gorge.js
@@ -123,6 +123,16 @@ function createBuildings() {
   }
 }
 
+function renderCost(cost) {
+  let list = [];
+
+  for (const [key, value] of Object.entries(cost)) {
+    list.push(value + " " + resourceTypes[key].name);
+  }
+
+  return list.join(", ");
+}
+
 function upgradeTooltip(id, event) {
   console.log(upgrades[id].desc);
   console.log(event.clientX, event.clientY);
@@ -138,6 +148,11 @@ function upgradeTooltip(id, event) {
   let tooltipEffect = document.querySelector("#upgrade-tooltip-effect");
 
   tooltipEffect.innerText = upgrade_types[upgrades[id].effect.type].desc(buildings[upgrades[id].effect.target].name);
+
+  let tooltipCost = document.querySelector("#upgrade-tooltip-cost");
+
+  tooltipCost.innerText = renderCost(upgrades[id].cost);
+
   let yOffset = tooltip.parentElement.getBoundingClientRect().y;
 
   let yTrans = Math.round(event.clientY - yOffset);