gorge/gorge.js

"use strict";

let belongings = {};

let ownedUpgrades = [];

let resources = {
  "food": 0
};

let updateRate = 60;

function calculateProductivity() {
  let productivity = 0;
  for (const [key, value] of Object.entries(belongings)) {
      productivity += productivityOf(key);
  }
  return productivity;
}

// here's where upgrades will go :3

function productivityOf(type) {
  let baseProd = buildings[type].prod;

  return baseProd * belongings[type].count;
}

function costOf(type) {
  let baseCost =  buildings[type].cost

  let countCost = baseCost * Math.pow(1.15, belongings[type].count);

  return Math.round(countCost);
}

function buyBuilding(type) {
  let cost = costOf(type);

  if (resources.food > cost) {
    belongings[type].count += 1;
    resources.food -= cost;
  }

}
// update stuff

function updateResources() {
  addResources();
  displayResources();
  displayBuildings();
  displayUpgrades();

  setTimeout(updateResources, 1000/updateRate);
}

function addResources() {
  resources.food += calculateProductivity() * 1 / updateRate;
}

function displayResources() {
  document.getElementById("resource-food").innerText = "Food: " + render(resources.food);

  document.getElementById("productivity").innerText = (Math.round(calculateProductivity() * 10) / 10) + " food/sec";
}

function displayBuildings() {
  for (const [key, value] of Object.entries(belongings)) {
    document.querySelector("#building-" + key + " > .building-button-name").innerText = value.count + " " + buildings[key].name + (value.count == 1 ? "" : "s");
    document.querySelector("#building-" + key + " > .building-button-cost").innerText = costOf(key) + " food";
  }
}

function displayUpgrades() {
  for (const [key, value] of Object.entries(upgrades)) {
    let button = document.querySelector("#upgrade-" + key);

    let valid = true;
    for (const [resource, amount] of Object.entries(upgrades[key].cost)) {
      if (resources[resource] < amount) {
        valid = false;
        break;
      }
    }

    if (valid) {
      button.classList.remove("upgrade-button-inactive");
    } else {
      button.classList.add("upgrade-button-inactive");
    }
  }
}

function eatMicro() {
  resources.food += 1;
}
// setup stuff lol

// we'll initialize the dict of buildings we can own

function setup() {
  initializeData();
  createButtons();
  registerListeners();

}

function initializeData() {
  for (const [key, value] of Object.entries(buildings)) {
    belongings[key] = {};
    belongings[key].count = 0;
  }
}

function registerListeners() {
  document.querySelectorAll(".building-button").forEach(function(button) {
    let id = button.id.replace("building-", "");
    button.addEventListener("click", function() { buyBuilding(id); });
  });

  document.querySelector("#tasty-micro").addEventListener("click", eatMicro);
}

function createButtons() {
  createBuildings();
  createUpgrades();
}

function createBuildings() {
  let container = document.querySelector("#buildings-area");

  for (const [key, value] of Object.entries(buildings)) {
    let button = document.createElement("div");
    button.classList.add("building-button");
    button.id = "building-" + key;
    let buttonName = document.createElement("div");
    buttonName.classList.add("building-button-name");
    let buttonCost = document.createElement("div");
    buttonCost.classList.add("building-button-cost");

    button.appendChild(buttonName);
    button.appendChild(buttonCost);

    container.appendChild(button);
  }
}

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) {

  let tooltip = document.querySelector("#upgrade-tooltip");

  tooltip.style.setProperty("display", "block");

  let tooltipDesc = document.querySelector("#upgrade-tooltip-desc");

  tooltipDesc.innerText = upgrades[id].desc;

  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);
  tooltip.style.setProperty("transform", "translate(-220px, " + yTrans + "px)");
}

function upgradeTooltipRemove() {
  let tooltip = document.querySelector("#upgrade-tooltip");

  tooltip.style.setProperty("display", "none");

}

function createUpgrades() {
  let container = document.querySelector("#upgrades-list");

  for (const [key, value] of Object.entries(upgrades)) {
    let button = document.createElement("div");
    button.classList.add("upgrade-button");
    button.id = "upgrade-" + key;
    let buttonName = document.createElement("div");
    buttonName.classList.add("upgrade-button-name");
    buttonName.innerText = value.name;
    button.appendChild(buttonName);

    button.addEventListener("mousemove", function(e) { upgradeTooltip(key, event); });
    button.addEventListener("mouseleave", function() { upgradeTooltipRemove(); });

    container.appendChild(button);
  }
}

window.onload = function() {
  setup();

  setTimeout(updateResources, 1000/updateRate);
}