import { 
  MxCAD3DObject,
  /** 新增 START **/
  Mx3dGePoint,
  Mx3dMkBox,
  /** 新增 END **/
} from "mxcad"

// 创建mxcad3d对象
const mxcad3d = new MxCAD3DObject()

// 初始化mxcad3d对象
mxcad3d.create({
    // canvas元素的css选择器字符串（示例中是id选择器），或canvas元素对象
    canvas: "#myCanvas",
    // 获取加载wasm相关文件(wasm/js/worker.js)路径位置
    locateFile: (fileName)=> new URL(`/node_modules/mxcad/dist/wasm/3d/${fileName}`, import.meta.url).href,
})

/** 新增 START **/
// 用于创建一个按钮并设置单击事件的工具函数
function createButton(text: string, fn: () => void) {
    const button = document.createElement("button");
    button.innerText = text;
    document.body.appendChild(button);
    button.onclick = fn;
}
/** 新增 END **/

/** 新增 START **/
// 此函数创建并显示一个方块
function drawBox()
{
    // 获取文档
    const doc = mxcad3d.getDocument();
    const pt1 = new Mx3dGePoint(5, 5, 5);
    const pt2 = new Mx3dGePoint(15, 15, 15);
    // 构造BOX
    const boxMaker = new Mx3dMkBox(pt1, pt2);
    // 获取拓扑形状
    const boxShape = boxMaker.Shape();
    // 文档中创建一个标签
    const boxLabel = doc.addShapeLabel();
    // 添加拓扑形状到标签中
    boxLabel.setShape(boxShape);
    // 更新显示（会更新canvas中显示的模型）
    mxcad3d.update();
}
/** 新增 END **/


// 初始化完成
mxcad3d.on("init", ()=>{
    console.log("初始化完成");
  	/** 新增 START **/
    // 创建一个按钮并设置标题为"绘制方块"，单击事件执行drawBox()
    createButton("绘制方块", drawBox);
    /** 新增 END **/
});