static/game.js

class GameStage {
    constructor(canvas) {
        this.canvas = canvas;
        this.ctx = canvas.getContext("2d");
        this.resources = { food: 0 };
        this.population = 1;
        this.maxPopulation = 5;
        this.relations = "Neutral"; // Tribal relations
    }

    updateUI() {
        document.getElementById("resources").textContent = `Food: ${this.resources.food}`;
        document.getElementById("population").textContent = `Tribe: ${this.population}/${this.maxPopulation}`;
        document.getElementById("relations").textContent = `Relations: ${this.relations}`;
    }

    loadAsset(url) {
        const img = new Image();
        img.crossOrigin = "Anonymous"; // For CORS compatibility
        img.src = url;
        return img;
    }
}

// Global UI functions
function gatherFood() { game.gatherFood(); }
function buildHut() { game.buildHut(); }
function attackTribe() { game.attackTribe(); }
function socializeTribe() { game.socializeTribe(); }
function toggleEditor() {
    const editor = document.getElementById("editor");
    editor.style.display = editor.style.display === "none" ? "block" : "none";
}
function applyChanges() { game.applyCreatureChanges(); }