Vasyl Kazakov
71 lines
1.8 KiB
TypeScript
71 lines
1.8 KiB
TypeScript
import { ResourceInventoryC } from "./ResourceInventoryC";
|
|
import { ResourceType } from "./ResourceType";
|
|
|
|
type ResourceUIEntry = {
|
|
type: ResourceType;
|
|
icon: HTMLElement;
|
|
count: HTMLElement;
|
|
};
|
|
|
|
const PLACEHOLDER_COLORS: Record<ResourceType, string> = {
|
|
[ResourceType.Wood]: "#6b4423",
|
|
};
|
|
|
|
export class ResourceUIC {
|
|
private static entries = new Map<ResourceType, ResourceUIEntry>();
|
|
private static root: HTMLElement | null = null;
|
|
|
|
static init() {
|
|
const uiRoot = document.getElementById("ui");
|
|
if (!uiRoot) return;
|
|
|
|
this.root = document.createElement("div");
|
|
this.root.id = "resource-bar";
|
|
this.root.className = "resource-bar";
|
|
uiRoot.appendChild(this.root);
|
|
|
|
this.register(ResourceType.Wood);
|
|
}
|
|
|
|
static register(type: ResourceType) {
|
|
if (!this.root || this.entries.has(type)) return;
|
|
|
|
const counter = document.createElement("div");
|
|
counter.className = "resource-counter";
|
|
counter.dataset.resource = type;
|
|
|
|
const icon = document.createElement("div");
|
|
icon.className = "resource-icon";
|
|
icon.style.backgroundColor = PLACEHOLDER_COLORS[type];
|
|
|
|
const count = document.createElement("span");
|
|
count.className = "resource-count";
|
|
count.textContent = "0";
|
|
|
|
counter.appendChild(icon);
|
|
counter.appendChild(count);
|
|
this.root.appendChild(counter);
|
|
|
|
this.entries.set(type, { type, icon, count });
|
|
this.refresh(type);
|
|
}
|
|
|
|
static getIconCenter(type: ResourceType) {
|
|
const entry = this.entries.get(type);
|
|
if (!entry) return null;
|
|
|
|
const rect = entry.icon.getBoundingClientRect();
|
|
return {
|
|
x: rect.left + rect.width / 2,
|
|
y: rect.top + rect.height / 2,
|
|
};
|
|
}
|
|
|
|
static refresh(type: ResourceType) {
|
|
const entry = this.entries.get(type);
|
|
if (!entry) return;
|
|
|
|
entry.count.textContent = String(ResourceInventoryC.get(type));
|
|
}
|
|
}
|