73 lines
1.9 KiB
Svelte
73 lines
1.9 KiB
Svelte
|
<script lang="ts">
|
||
|
import moves from "../moves";
|
||
|
import type { BuildingType, CostType, UnitType } from "../types";
|
||
|
import { getUnitSource } from "../utils";
|
||
|
import type { VillageState } from "../village";
|
||
|
import village from "../village";
|
||
|
import Cost from "./Cost.svelte";
|
||
|
|
||
|
export let building: BuildingType;
|
||
|
|
||
|
|
||
|
let numberOfUnits = 1;
|
||
|
$: unitType = building.behavior.units?.type || '';
|
||
|
$: unit = getUnitSource(unitType);
|
||
|
$: maximumUnits = getMaxCountOfUnits($village, unit);
|
||
|
$: if (numberOfUnits > maximumUnits) {
|
||
|
numberOfUnits = maximumUnits || 1;
|
||
|
}
|
||
|
$: cost = {
|
||
|
wood: unit.cost.wood * numberOfUnits,
|
||
|
stone: unit.cost.stone * numberOfUnits,
|
||
|
iron: unit.cost.iron * numberOfUnits,
|
||
|
food: unit.cost.food * numberOfUnits,
|
||
|
};
|
||
|
|
||
|
|
||
|
function recruit() {
|
||
|
moves.recruitUnits(building.id, unitType, numberOfUnits);
|
||
|
}
|
||
|
|
||
|
function getMaxCountOfUnits(V: VillageState, unitData: UnitType): number {
|
||
|
let res = Infinity;
|
||
|
Object.entries(V.resources).forEach(([resource, value]) => {
|
||
|
const cost = unitData.cost[resource as keyof CostType] || 0;
|
||
|
if (cost > 0) {
|
||
|
res = Math.min(
|
||
|
res,
|
||
|
Math.floor(value / cost)
|
||
|
);
|
||
|
}
|
||
|
});
|
||
|
|
||
|
return res;
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<div class="university">
|
||
|
<p>Create Philosophers</p>
|
||
|
<div class="cost"><Cost { cost } /></div>
|
||
|
|
||
|
<input
|
||
|
type="range"
|
||
|
name="units"
|
||
|
min="1"
|
||
|
max={ maximumUnits }
|
||
|
bind:value={ numberOfUnits }
|
||
|
/>
|
||
|
<input
|
||
|
type="number"
|
||
|
name="units"
|
||
|
min="1"
|
||
|
max={ maximumUnits }
|
||
|
bind:value={ numberOfUnits }
|
||
|
/>
|
||
|
<button on:click={ recruit } disabled={ numberOfUnits > maximumUnits }>Recruit</button>
|
||
|
</div>
|
||
|
|
||
|
<style>
|
||
|
.university .cost {
|
||
|
margin: 1em;
|
||
|
}
|
||
|
</style>
|