window.addEventListener('DOMContentLoaded', async function () {
    const urlParams = new URLSearchParams(window.location.search);
    const modelBlobUrl = urlParams.get("model");

    if (!modelBlobUrl) {
        alert("モデルが指定されていません。");
        return;
    }

    const canvas = document.getElementById("renderCanvas");
    const engine = new BABYLON.Engine(canvas, true);

    const createScene = async function () {
        const scene = new BABYLON.Scene(engine);

        // カメラとライトをセットアップ
        const camera = new BABYLON.ArcRotateCamera("Camera", Math.PI / 2, Math.PI / 2, 4, BABYLON.Vector3.Zero(), scene);
        camera.attachControl(canvas, true);

        const light = new BABYLON.HemisphericLight("light", new BABYLON.Vector3(1, 1, 0), scene);

        try {
            // blob URLからデータを取得
            const response = await fetch(modelBlobUrl);
            const arrayBuffer = await response.arrayBuffer();

            // GLB/GLTF データをロード
            const blob = new Blob([arrayBuffer], { type: "model/gltf-binary" });
            const file = new File([blob], "model.glb");

            await BABYLON.SceneLoader.Append("", file, scene);
            console.log("モデルが正常にロードされました。");
        } catch (error) {
            console.error("モデルのロードに失敗しました:", error);
            alert("モデルの読み込みに失敗しました。詳細はコンソールを確認してください。");
        }

        return scene;
    };

    const scene = await createScene();
    engine.runRenderLoop(() => {
        scene.render();
    });

    window.addEventListener("resize", function () {
        engine.resize();
    });
});