lecodes-web-host 2.0.1 → 2.0.3

package/dist/api.d.ts

@@ -46,12 +46,45 @@ export type PreviewError = {
     detail?: string;
     nativeFrames?: string[];
 };
+/** A 3D engine in place of the runtime's: the `_creator` contract implemented in TypeScript
+ *  (lecodes-gl-lite). The host opens and closes its scene, tells it the size, and disposes of it;
+ *  the engine shows its own canvas. */
+export type Engine3d = Record<string, any> & {
+    openScene(sceneId: number): void;
+    closeScene(): void;
+    _onResize?(width: number, height: number, factor: number): void;
+    _dispose?(): void;
+};
+/** The host's fetched buffers and media players: the ids a bundle hands an engine are these. */
+export type HostStores = {
+    fetch(url: string, options: any, onComplete: (systemId: number, statusCode: number) => void, onReject: (err: Error) => void): unknown;
+    getBuffer(systemId: number): ArrayBuffer;
+    getBlob(systemId: number): Blob;
+    putBuffer(buffer: ArrayBuffer): number;
+    putLocalBuffer(name: string, buffer: ArrayBuffer): void;
+    hasLocalBuffer(name: string): boolean;
+    getLocalName(systemId: number): string | undefined;
+    getPlayer(id: number): HTMLVideoElement | HTMLAudioElement | null | undefined;
+    removePlayers(): void;
+};
+/** What the host lends an engine of the embedder's. */
+export type EnginePage = {
+    /** A canvas over the whole container, its backing store in device px, hidden until shown. */
+    newCanvas(): HTMLCanvasElement;
+    preloads: Set<string>;
+    /** The painter behind `_creatorCanvas` (a texture made of a canvas of the app's is read here). */
+    canvasHost: any;
+    stores: HostStores;
+};
 export type HostOptions = {
     /** The header of the bundle the host is for (`parseBundleHeader`): its engines decide the profile,
      *  its materials the archives, its fonts the boot faces. */
     header?: BundleHeader;
     /** The runtime profile, in place of the header's (a host with no bundle yet: an editor). */
     profile?: HostProfile;
+    /** A 3D engine of the embedder's as `_creator`, on a profile that carries none (`2d`, `ui`):
+     *  an editor's viewport on the lite engine. Ignored on the `full` profile. */
+    engine3d?: (page: EnginePage) => Promise<Engine3d>;
     /** false = an engine-only host: no UI renderer, no fonts. Default true. */
     ui?: boolean;
     /** The project, as the key its storage is kept under. Default: the header's name. */
@@ -147,6 +180,10 @@ export type Layer = {
 export type HostUI = {
     /** The layers the host paints now. */
     frame(): Layer[];
+    /** The node the runtime made last. An inspector that is told of an element as the SDK makes it
+     *  (`__lecodesCaptureSites` as a function) ties the element to this node: the SDK calls straight
+     *  after the create that made it. */
+    readonly lastCreated: number;
     /** The elements named `name`. */
     findAll(name: string): RenderNode[];
     /** The render tree as JSON / as text (what `lecodes render` writes). */
@@ -167,6 +204,10 @@ export type Host = {
     readonly world: Record<string, unknown>;
     /** The UI as the host paints it; null on an engine-only host. */
     readonly ui: HostUI | null;
+    /** The embedder's 3D engine (`engine3d`), as it made it; null where the runtime's own runs. */
+    engine3d(): Engine3d | null;
+    /** Bytes of the host's store, by their id: what a bundle fetched, what an engine captured. */
+    getBuffer(systemId: number): ArrayBuffer | undefined;
     /** Evaluate a bundle. Throws when the bundle is of another SDK major than this host. */
     run(code: string, options?: RunOptions): Run;
     /** A plugin's web half, by the id an app lists it under; a bundle gets the ones its header names. */

package/dist/index.js

@@ -6,7 +6,7 @@ const assetsURL = function(dep, importerUrl) {
   return new URL(dep, importerUrl).href;
 };
 const seen = {};
-const __vitePreload = function preload(baseModule, deps, importerUrl) {
+const __lecodesHostPreload = function preload(baseModule, deps, importerUrl) {
   let promise = Promise.resolve();
   if (deps && deps.length > 0) {
     let allSettled2 = function(promises) {
@@ -84,9 +84,9 @@ const __vitePreload = function preload(baseModule, deps, importerUrl) {
   });
 };
 const factories = {
-  full: () => __vitePreload(() => import("./chunks/creator-full-BYRA3WbP.js"), true ? [] : void 0, import.meta.url),
-  "2d": () => __vitePreload(() => import("./chunks/creator-2d-D13oxDsX.js"), true ? [] : void 0, import.meta.url),
-  ui: () => __vitePreload(() => import("./chunks/creator-ui-Cvoc0NZK.js"), true ? [] : void 0, import.meta.url)
+  full: () => __lecodesHostPreload(() => import("./chunks/creator-full-BYRA3WbP.js"), true ? [] : void 0, import.meta.url),
+  "2d": () => __lecodesHostPreload(() => import("./chunks/creator-2d-D13oxDsX.js"), true ? [] : void 0, import.meta.url),
+  ui: () => __lecodesHostPreload(() => import("./chunks/creator-ui-Cvoc0NZK.js"), true ? [] : void 0, import.meta.url)
 };
 const wasmUrl = {
   full: () => new URL("" + new URL("assets/creator-full-D2dSDdDj.wasm", import.meta.url).href, import.meta.url).href,
@@ -767,6 +767,67 @@ const installWasmCrashSymbolizer = () => {
 };
 const arrayBuffers = [null];
 new TextDecoder("utf-8");
+const _fetch = async (url, fetchOptions, onComplete, onReject) => {
+  let body = void 0;
+  if (fetchOptions.body) {
+    if (typeof fetchOptions.body === "object" && Array.isArray(fetchOptions.body._entries)) {
+      const formData = new FormData();
+      for (let [key, value, filename] of fetchOptions.body._entries) {
+        if (typeof value === "object") {
+          formData.append(key, new Blob([getBuffer(value._id)]), filename);
+        } else {
+          formData.append(key, value);
+        }
+      }
+      body = formData;
+    } else if (typeof fetchOptions.body === "string") {
+      body = fetchOptions.body;
+    } else {
+      onReject(new Error("Invalid body"));
+    }
+  }
+  const resp = await fetch(url, {
+    method: fetchOptions.method,
+    body,
+    headers: fetchOptions.headers,
+    mode: "cors",
+    credentials: "omit"
+  });
+  const onProgress = typeof fetchOptions.onProgress === "function" ? fetchOptions.onProgress : null;
+  if (!onProgress) {
+    const buffer = await resp.arrayBuffer();
+    arrayBuffers.push(buffer);
+    onComplete(arrayBuffers.length - 1, resp.status);
+    return;
+  }
+  const reader = resp.body?.getReader();
+  if (!reader) {
+    const buffer = await resp.arrayBuffer();
+    arrayBuffers.push(buffer);
+    onComplete(arrayBuffers.length - 1, resp.status);
+    return;
+  }
+  const contentLength = Number(resp.headers.get("content-length")) || void 0;
+  let loaded = 0;
+  const chunks = [];
+  while (true) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    if (value) {
+      chunks.push(value);
+      loaded += value.length;
+      onProgress({ loaded, total: contentLength });
+    }
+  }
+  const result = new Uint8Array(loaded);
+  let offset = 0;
+  for (const chunk of chunks) {
+    result.set(chunk, offset);
+    offset += chunk.length;
+  }
+  arrayBuffers.push(result.buffer);
+  onComplete(arrayBuffers.length - 1, resp.status);
+};
 const getUrl = (systemId) => {
   const blob = new Blob([arrayBuffers[systemId]]);
   return URL.createObjectURL(blob);
@@ -785,7 +846,17 @@ const putBuffer = (buffer) => {
   return arrayBuffers.length - 1;
 };
 const map = /* @__PURE__ */ new Map();
+const putLocalBuffer = (str, buf) => {
+  map.set(str, buf);
+  const systemId = localResources.get(str);
+  if (systemId !== void 0) arrayBuffers[systemId] = buf;
+};
+const hasLocalBuffer = (str) => map.has(str);
 const localResources = /* @__PURE__ */ new Map();
+const getLocalName = (systemId) => {
+  for (const [name, id] of localResources) if (id === systemId) return name;
+  return void 0;
+};
 const _fetchLocal = (path) => {
   const existsSystemId = localResources.get(path);
   if (existsSystemId !== void 0) {
@@ -1280,11 +1351,24 @@ class Canvas2DPainter {
   }
   drawImage(image, srcRect, dst, opts) {
     if (!image.handle) return;
-    const { src, dst: d } = srcRect ? { src: srcRect, dst } : computeObjectFit(image.naturalWidth, image.naturalHeight, dst, opts.fit);
+    const fit = srcRect ? { src: srcRect, dst } : computeObjectFit(image.naturalWidth, image.naturalHeight, dst, opts.fit);
+    const d = fit.dst;
+    let src = fit.src;
     const dw = Math.max(1, Math.ceil(d.width * this.dpr));
     const dh = Math.max(1, Math.ceil(d.height * this.dpr));
-    const handle = image.rasterize ? image.rasterize(dw, dh) : image.handle;
     const whole = !srcRect && opts.fit !== "cover";
+    let handle = image.handle;
+    if (image.rasterize) {
+      if (whole) handle = image.rasterize(dw, dh);
+      else {
+        const k = Math.max(dw / src.width, dh / src.height);
+        const rw = Math.max(1, Math.ceil(image.naturalWidth * k));
+        const rh = Math.max(1, Math.ceil(image.naturalHeight * k));
+        handle = image.rasterize(rw, rh);
+        const kx = rw / image.naturalWidth, ky = rh / image.naturalHeight;
+        src = { x: src.x * kx, y: src.y * ky, width: src.width * kx, height: src.height * ky };
+      }
+    }
     if (opts.tint === void 0) {
       if (whole) this.ctx.drawImage(handle, d.x, d.y, d.width, d.height);
       else this.ctx.drawImage(handle, src.x, src.y, src.width, src.height, d.x, d.y, d.width, d.height);
@@ -3871,7 +3955,7 @@ const loadBootFonts = async (fonts, doc, budgetMs = 2e3) => {
   }
   await Promise.race([Promise.all(loads), new Promise((res) => setTimeout(res, budgetMs))]);
 };
-const SDK_VERSION = "2.0.1";
+const SDK_VERSION = "2.0.3";
 const sdkMajor = (version) => {
   const m = version?.match(/^(\d+)\.\d+\.\d+/);
   return m ? Number(m[1]) : null;
@@ -4963,6 +5047,7 @@ const makeWorld = () => {
   };
   return { global, evaluate };
 };
+const stores = { fetch: _fetch, getBuffer, getBlob, putBuffer, putLocalBuffer, hasLocalBuffer, getLocalName, getPlayer, removePlayers };
 const nullHostUI = (onDestination, onDropped) => ({
   nodeFactory() {
   },
@@ -5044,15 +5129,27 @@ const createHost$1 = async (root, options = {}) => {
       M._free(p);
     }
   };
+  let engine3d = null;
+  let engine3dScene = -1;
   let destination = -1;
-  const onDestination = (kind) => {
+  const onDestination = (kind, id) => {
     destination = kind;
     if (kind === TREE_DEST_SCENE3D) gl?.show();
     if (kind === TREE_DEST_SCENE2D) scene2d?.show();
+    if (engine3d && kind === TREE_DEST_SCENE3D && id !== engine3dScene) {
+      engine3dScene = id;
+      engine3d.openScene(id);
+    }
   };
   const onDropped = (kind) => {
     if (kind === destination) return;
-    if (kind === TREE_DEST_SCENE3D) gl?.hide();
+    if (kind === TREE_DEST_SCENE3D) {
+      gl?.hide();
+      if (engine3d && engine3dScene >= 0) {
+        engine3dScene = -1;
+        engine3d.closeScene();
+      }
+    }
     if (kind === TREE_DEST_SCENE2D) scene2d?.hide();
   };
   const canvasHost = createCanvasHost();
@@ -5110,12 +5207,17 @@ const createHost$1 = async (root, options = {}) => {
   M._creatorWebInit();
   if (options.launchUrl) withStr(options.launchUrl, (p) => M._creatorWebSetLaunchUrl(p));
   renderer?.ui.install();
+  if (!has3d && options.engine3d) {
+    engine3d = await options.engine3d({ newCanvas: page.newCanvas, preloads, canvasHost, stores });
+    Object.defineProperty(globals, "_creator", { value: engine3d, configurable: true, writable: true, enumerable: false });
+  }
   if (has3d && header?.gl !== "defer") globals._creator?.createEngine();
   const safeArea = createSafeArea(root);
   if (options.safeArea) safeArea.set(options.safeArea);
   const resize = (size) => {
     gl?.resize();
     scene2d?.resize();
+    engine3d?._onResize?.(size.width, size.height, size.factor);
     if (renderer) {
       renderer.resize(size.width, size.height, size.factor);
       renderer.setSafeArea(safeArea.current());
@@ -5146,6 +5248,10 @@ const createHost$1 = async (root, options = {}) => {
     world: globals,
     /** The UI as the renderer holds it (the render tree, the pointer routing); null on an engine-only host. */
     ui: renderer?.ui ?? null,
+    /** The embedder's 3D engine (`engine3d`), as it made it; null where the runtime's own runs. */
+    engine3d: () => engine3d,
+    /** Bytes of the host's store, by their id: what a bundle fetched, what an engine captured. */
+    getBuffer: (systemId) => getBuffer(systemId),
     /** Evaluate a bundle. Throws when the bundle is of another SDK major than this host. */
     run(code, runOptions = {}) {
       const bundle = runOptions.header ?? parseBundleHeader$1(code);
@@ -5184,6 +5290,7 @@ const createHost$1 = async (root, options = {}) => {
       app.dispose();
       removePlayers();
       safeArea.destroy();
+      engine3d?._dispose?.();
       gl?.destroy();
       scene2d?.destroy();
       page.destroy();