// import { Color, Face3, MeshBasicMaterial, Object3D, Vector2, Vector3 } from "three";
// import "./style.css";
import { Color, MeshBasicMaterial, Vector3 } from "three";
import { CameraControlState } from "../CameraControls";
import { GetBox } from "../GeUtils";
import { LoadBoard } from "../Utils";
import { Viewer } from "../Viewer";

let btn = document.createElement("button");
btn.innerHTML = "载入";
document.body.appendChild(btn);

let btn2 = document.createElement("button");
btn2.innerHTML = "清理";
document.body.appendChild(btn2);

let btn3 = document.createElement("button");
btn3.innerHTML = "爆炸图";
document.body.appendChild(btn3);

let el = document.createElement("canvas");

el.style.width = "80%";
el.style.height = "80%";
document.body.appendChild(el);

let view = new Viewer(el, (settings) =>
{
    settings.boardMaterial = new MeshBasicMaterial({
        color: new Color(0.8, 0.8, 0.8),
        polygonOffset: true,
        polygonOffsetFactor: 1, // positive value pushes polygon further away
        polygonOffsetUnits: 1,
        transparent: true,
        opacity: 0.5
    });
});

//修改这个顺序 改变1 2 3 个触摸点时的触发状态.
view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Rotate, CameraControlState.Scale, CameraControlState.Pan];
//例如,修改单指滑动为平移.
view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Pan, CameraControlState.Scale, CameraControlState.Rotate];

//加载
btn.onclick = () =>
{
    console.time();
    let data = require("./data.json");
    for (let i = 0; i < 1; i++)
        LoadBoard(view, data);
    console.timeEnd();
};

btn2.onclick = () =>
{
    // LoadBoard(view, []);
};

btn3.onclick = () =>
{
    let box = GetBox(view.m_Scene);

    let cen = box.getCenter(new Vector3());
    let m = [];
    for (let obj of view.m_Scene.children)
    {
        if (obj.userData && obj.userData instanceof Vector3)
        {
            let objCen = GetBox(obj).getCenter(new Vector3());

            let v = objCen.clone().sub(cen);

            let zv = obj.userData as Vector3;
            if (zv instanceof Vector3)
            {
                let d = zv.dot(v);
                // m.set(obj, zv.clone().multiplyScalar(d));
                m.push([obj, zv.clone().multiplyScalar(d)]);
            }
        }
    }


    let count = 0;

    let t = setInterval(() =>
    {
        for (let [o, v] of m)
        {
            o.position.add(
                v.clone().multiplyScalar(1.5 / 120)
            );
            o.updateMatrix();
        }

        view.ZoomAll();

        view.m_bNeedUpdate = true;

        count++;

        if (count === 60)
            clearInterval(t);
    }, 16);
};