From 8ee2e54042f6b0dcd6b8de680e4162e1803eaae3 Mon Sep 17 00:00:00 2001 From: Fen Dweller Date: Fri, 20 Jul 2018 13:40:06 -0500 Subject: [PATCH] Building buttons fit properly, and gray out when unusable. Can buy when you have exactly enough food now --- gorge.css | 11 ++++++++++- gorge.js | 16 +++++++++++----- 2 files changed, 21 insertions(+), 6 deletions(-) diff --git a/gorge.css b/gorge.css index 7dbf7d4..2dcfd20 100644 --- a/gorge.css +++ b/gorge.css @@ -30,7 +30,7 @@ body.dark { .building-button { display: block; - width: 100%; + width: 90%; height: 75px; background-color: #222; color: #eee; @@ -40,6 +40,11 @@ body.dark { user-select: none; } +.building-button-disabled { + background-color: #111; + color: #999; +} + .building-button .building-button-name { font-size: 24px; position: relative; @@ -60,6 +65,10 @@ body.dark { background-color: #333; } +.building-button-disabled:hover { + background-color: #111 !important; +} + .building-button:active { border-color: #333; background-color: #111; diff --git a/gorge.js b/gorge.js index e26e2c5..7c03e97 100644 --- a/gorge.js +++ b/gorge.js @@ -26,8 +26,8 @@ function productivityOf(type) { return baseProd * belongings[type].count; } -function costOf(type) { - let baseCost = buildings[type].cost +function costOfBuilding(type) { + let baseCost = buildings[type].cost let countCost = baseCost * Math.pow(1.15, belongings[type].count); @@ -35,9 +35,9 @@ function costOf(type) { } function buyBuilding(type) { - let cost = costOf(type); + let cost = costOfBuilding(type); - if (resources.food > cost) { + if (resources.food >= cost) { belongings[type].count += 1; resources.food -= cost; } @@ -67,7 +67,13 @@ function displayResources() { function displayBuildings() { for (const [key, value] of Object.entries(belongings)) { document.querySelector("#building-" + key + " > .building-button-name").innerText = value.count + " " + (value.count == 1 ? buildings[key].name : buildings[key].plural); - document.querySelector("#building-" + key + " > .building-button-cost").innerText = costOf(key) + " food"; + document.querySelector("#building-" + key + " > .building-button-cost").innerText = costOfBuilding(key) + " food"; + + if (costOfBuilding(key) > resources.food) { + document.querySelector("#building-" + key).classList.add("building-button-disabled"); + } else { + document.querySelector("#building-" + key).classList.remove("building-button-disabled"); + } } }