src/render/costs.ts

   1 import {City} from "../repository/city";
   2
   3 type Cost = {
   4   credits: number,
   5   time: number,
   6   alloys?: number,
   7   energy?: number,
   8   land?: number,
   9   food?: number,
  10   population?: number,
  11   soldiers?: number
  12   attackers?: number,
  13   defenders?: number
  14 }
  15
  16 function lineItem(display: string, value: number, available: number): string {
  17   let className = '';
  18
  19   if(available <= value && available >= 0) {
  20     className = 'danger-text';
  21   }
  22   else if(available >= value) {
  23     className = 'success-text';
  24   }
  25   return `
  26   <div>
  27     <b>${display}:</b>
  28     <span class="text ${className}">${value.toLocaleString()}</span>
  29   </div>
  30   `;
  31 }
  32
  33 export function renderCost(cost: Cost, city: City): string {
  34   const costAsArray = [];
  35
  36   costAsArray.push(lineItem('Credits', cost.credits, city.credits));
  37   costAsArray.push(lineItem('Time', cost.time, -1));
  38
  39   if(cost.alloys) {
  40     costAsArray.push(lineItem('Alloys', cost.alloys, city.alloys));
  41   }
  42   if(cost.food) {
  43     costAsArray.push(lineItem('Food', cost.food, city.food));
  44   }
  45   if(cost.energy) {
  46     costAsArray.push(lineItem('Energy', cost.energy, city.energy));
  47   }
  48   if(cost.land) {
  49     costAsArray.push(lineItem('Space', cost.land, city.totalSpace - city.usedSpace));
  50   }
  51   if(cost.population) {
  52     costAsArray.push(lineItem('Pop', cost.population, city.population));
  53   }
  54   if(cost.soldiers) {
  55     costAsArray.push(lineItem('Soldiers', cost.soldiers, city.soldiers));
  56   }
  57   if(cost.attackers) {
  58     costAsArray.push(lineItem('Attackers', cost.attackers, city.attackers));
  59   }
  60   if(cost.defenders) {
  61     costAsArray.push(lineItem('Defenders', cost.defenders, city.defenders));
  62   }
  63
  64
  65   return `<div class="cost-display">${costAsArray.join("")}</div>`;
  66 }