import { initEditor } from "@/modules/editor";
import { EditorMode } from "@/modules/editor/typings";
import { useResource } from "@/modules/resource";
import { SelectOneImage } from "@/pages/website/Material2/modal";
import { defineComponent } from "vue";

export default defineComponent(() => {
  const editor = initEditor();
  const resource = useResource();

  const params = new URLSearchParams(location.hash.split("?")[1]);
  editor.actions.switchMode((params.get("mode") || "editPage") as EditorMode);
  const prodId = params.get("id");
  if (prodId) {
    editor.actions.initDesign(prodId);
  } else {
    editor.jumpIndexHtml();
  }

  editor.controls.pickCtrl.onPickImage = async (maxCount: number) => {
    if (maxCount <= 1) {
      const url = await SelectOneImage();

      return [url as string];
    }
    return [];
  };

  editor.controls.pickCtrl.onPickPack = async () => {
    return resource.treeController.selectOnePackScene();
  };

  return () => <editor.components.Viewport class="!h-100vh" />;
});
