import { LICENSE_OPTIONS } from "../../../../constants/license"
import { EulerGraph } from "../../../EulerGraph"

export async function appendEditor() {
  Object.defineProperty(window, "devicePixelRatio", {
    get: function () {
      return 1
    },
    configurable: true,
  })

  const container = document.createElement("div")
  container.id = "engine_contaiter"
  container.style.width = "100%"
  container.style.height = "100%"
  document.body.style.cssText =
    "width: 100vw;height:100vh;position:relative;margin:0;padding:0"
  document.body.appendChild(container)

  const engine = new EulerGraph({ container })
  engine.enableServices(LICENSE_OPTIONS.full)

  await new Promise<void>((res) => {
    engine.addListener("started", (engine) => {
      engine.addScene()
      engine.setCurrentScene(engine.appState.sceneNames[0])
      engine.fitToWidth(0)
      res()
    })
  })

  return engine
}