import { anthill } from "./anthill.js";
import { currency } from "./currency.js";
import { statsUi } from "./statsUi.js";
import { loadSprite } from "./loadSprite.js";
import { sfx } from "./sfx.js";
import { ensureTutorialSignalant } from "./storage.js";
import { tutorial } from "./tutorial.js";

export class QueenUi {
    constructor() {
        this.layout = {
            margin: 10,
            width: 300,
            height: 116,
            buttonX: 8,
            activeButtonY: 8,
            fixedButtonY: 58,
            buttonWidth: 133,
            buttonHeight: 49,
            statsButtonX: 144,
            statsButtonY: 59,
            statsButtonWidth: 148,
            statsButtonHeight: 49,
            currencyX: 147,
            currencyY: 25,
            currencyWidth: 143,
            currencyHeight: 30
        };
        this.panelSprite = loadSprite("assets/ui/queenUi.png");
        this.activeButtonSprite = loadSprite("assets/ui/queenButton_active.png");
        this.inactiveButtonSprite = loadSprite("assets/ui/queenButton_inactive.png");
        this.fixedButtonSprite = loadSprite("assets/ui/queenButton_fixed.png");
        this.unfixedButtonSprite = loadSprite("assets/ui/queenButton_unfixed.png");
        this.statsButtonSprite = loadSprite("assets/ui/statsButton.png");
        this.x = 0;
        this.y = 0;
    }

    reposition() {
        this.x = this.layout.margin;
        this.y = this.layout.margin;
    }

    getQueen() {
        return anthill.queen;
    }

    getPanelRect() {
        return {
            x: this.x,
            y: this.y,
            width: this.layout.width,
            height: this.layout.height
        };
    }

    getActiveButtonRect() {
        return {
            x: this.x + this.layout.buttonX,
            y: this.y + this.layout.activeButtonY,
            width: this.layout.buttonWidth,
            height: this.layout.buttonHeight
        };
    }

    getFixedButtonRect() {
        return {
            x: this.x + this.layout.buttonX,
            y: this.y + this.layout.fixedButtonY,
            width: this.layout.buttonWidth,
            height: this.layout.buttonHeight
        };
    }

    getStatsButtonRect() {
        return {
            x: this.x + this.layout.statsButtonX,
            y: this.y + this.layout.statsButtonY,
            width: this.layout.statsButtonWidth,
            height: this.layout.statsButtonHeight
        };
    }

    isPointInRect(x, y, rect) {
        return x >= rect.x && x <= rect.x + rect.width && y >= rect.y && y <= rect.y + rect.height;
    }

    isPointInside(x, y) {
        return this.isPointInRect(x, y, this.getPanelRect());
    }

    getClickAction(x, y) {
        if (!this.isPointInside(x, y)) {
            return null;
        }

        if (this.isPointInRect(x, y, this.getActiveButtonRect())) {
            return { type: "toggle-active" };
        }

        if (this.isPointInRect(x, y, this.getFixedButtonRect())) {
            return { type: "toggle-fixed" };
        }

        if (this.isPointInRect(x, y, this.getStatsButtonRect())) {
            return { type: "open-stats" };
        }

        return { type: "panel" };
    }

    handleLeftClick(x, y) {
        const action = this.getClickAction(x, y);
        if (!action) {
            return false;
        }

        const queen = this.getQueen();

        if (action.type === "toggle-active") {
            queen.active = !queen.active;
            sfx.play("queenBurrow");
            tutorial.trigger("queen.toggleActive");
            return true;
        }

        if (action.type === "toggle-fixed") {
            queen.isFixed = !queen.isFixed;
            if (queen.isFixed) {
                tutorial.trigger("queen.fix");
            } else {
                tutorial.trigger("queen.unfix");
            }
            return true;
        }

        if (action.type === "open-stats") {
            statsUi.toggleOpen();
            if (statsUi.isOpen) {
                if (tutorial.trigger("stats.open") && tutorial.getCurrentStep()?.trigger === "signalant.ghost") {
                    ensureTutorialSignalant();
                }
            }
            return true;
        }

        return action.type === "panel";
    }

    drawPanelSprite(ctx, sprite, x, y, width, height) {
        if (!sprite || !sprite.complete) {
            return;
        }

        ctx.drawImage(sprite, x, y, width, height);
    }

    drawCurrency(ctx) {
        ctx.save();
        ctx.fillStyle = "#c0c0c0";
        ctx.font = "bold 16px monospace";
        ctx.textAlign = "right";
        ctx.textBaseline = "middle";
        ctx.fillText(
            String(currency.amount),
            this.x + this.layout.currencyX + this.layout.currencyWidth,
            this.y + this.layout.currencyY + this.layout.currencyHeight / 2
        );
        ctx.restore();
    }

    draw(ctx) {
        const queen = this.getQueen();
        const activeButtonSprite = queen.active ? this.activeButtonSprite : this.inactiveButtonSprite;
        const fixedButtonSprite = queen.isFixed ? this.fixedButtonSprite : this.unfixedButtonSprite;

        this.reposition();
        this.drawPanelSprite(ctx, this.panelSprite, this.x, this.y, this.layout.width, this.layout.height);
        this.drawPanelSprite(
            ctx,
            activeButtonSprite,
            this.x + this.layout.buttonX,
            this.y + this.layout.activeButtonY,
            this.layout.buttonWidth,
            this.layout.buttonHeight
        );
        this.drawPanelSprite(
            ctx,
            fixedButtonSprite,
            this.x + this.layout.buttonX,
            this.y + this.layout.fixedButtonY,
            this.layout.buttonWidth,
            this.layout.buttonHeight
        );
        this.drawPanelSprite(
            ctx,
            this.statsButtonSprite,
            this.x + this.layout.statsButtonX,
            this.y + this.layout.statsButtonY,
            this.layout.statsButtonWidth,
            this.layout.statsButtonHeight
        );
        this.drawCurrency(ctx);
    }
}

export const queenUi = new QueenUi();