import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import style from "./style.module.css";
import Carousel from "./carousel";
import WheelFrame from "./wheel-frame";
import { useEffect, useState } from "react";
export default function BlockSelector({ gameRef, staticBlock, staticBlockItems, posterItems, onSelectionChange }) {
    const [hasBeenInteracted, setHasBeenInteracted] = useState(false);
    useEffect(() => {
        if (!gameRef.current || !gameRef.current.scene || !posterItems.length)
            return;
        const scene = gameRef.current.scene;
        const currentSelection = staticBlock === "left" ? scene.selectedCogTiltLeftBlock
            : staticBlock === "right" ? scene.selectedCogTiltRightBlock
                : scene.selectedCogFireBlock;
        if (currentSelection) {
            onSelectionChange?.(staticBlock, currentSelection);
            return;
        }
        const item = posterItems[0];
        switch (staticBlock) {
            case "left":
                scene.selectedCogTiltLeftBlock = item;
                break;
            case "right":
                scene.selectedCogTiltRightBlock = item;
                break;
            case "shoot":
                scene.selectedCogFireBlock = item;
                break;
        }
        onSelectionChange?.(staticBlock, item);
        // gameRef.current.scene.registerCogEvents();
    }, [gameRef.current, onSelectionChange, posterItems, staticBlock]);
    const onBlockChange = (item) => {
        if (!item)
            return;
        if (!gameRef.current || !gameRef.current.scene)
            return;
        const scene = gameRef.current.scene;
        const currentSelection = staticBlock === "left" ? scene.selectedCogTiltLeftBlock
            : staticBlock === "right" ? scene.selectedCogTiltRightBlock
                : scene.selectedCogFireBlock;
        if (currentSelection?.block === item.block) {
            return;
        }
        switch (staticBlock) {
            case "left":
                scene.selectedCogTiltLeftBlock = item;
                break;
            case "right":
                scene.selectedCogTiltRightBlock = item;
                break;
            case "shoot":
                scene.selectedCogFireBlock = item;
                break;
        }
        onSelectionChange?.(staticBlock, item);
        // gameRef.current.scene.registerCogEvents();
    };
    const clickHandler = () => {
        setHasBeenInteracted(true);
    };
    return (_jsxs("div", { className: [style.blockSelector, hasBeenInteracted ? "" : style.uninteracted].join(" "), onClick: clickHandler, children: [_jsx("div", { className: style.carouselContainer, children: _jsx(WheelFrame, { Carusel: Carousel, onFrontPosterChange: (item) => { }, posterItems: staticBlockItems, isStatic: true }) }), _jsx("div", { className: style.carouselContainer, children: _jsx(WheelFrame, { Carusel: Carousel, onFrontPosterChange: onBlockChange, posterItems: posterItems }) })] }));
}
