@neta-art/cohub 9.0.1 → 11.0.0

package/dist/board/stage/texture-pool.d.ts

@@ -0,0 +1,24 @@
+import { Texture } from "pixi.js";
+//#region src/board/stage/texture-pool.d.ts
+type BoardImageTexturePool = {
+  acquire: (url: string) => Promise<Texture | null>;
+  release: (url: string) => Promise<void>;
+};
+/** A CDN variant that fails to process falls back to the media it came from. */
+declare function loadBoardImageTexture(url: string): Promise<Texture>;
+declare function unloadBoardImageTexture(url: string, texture: Texture | null): Promise<void>;
+/**
+ * Share image textures by resolved URL without sharing Board ownership.
+ *
+ * Pixi's Assets cache is global, but its unload operation is not reference
+ * counted. The pool adds that missing application-level ownership layer:
+ * multiple Board managers share one load and texture, while the last release
+ * is the only one allowed to unload it.
+ */
+declare function createBoardImageTexturePool(options?: {
+  loadTexture?: (url: string) => Promise<Texture | null>;
+  unloadTexture?: (url: string, texture: Texture | null) => Promise<void>;
+}): BoardImageTexturePool;
+declare const boardImageTexturePool: BoardImageTexturePool;
+//#endregion
+export { BoardImageTexturePool, boardImageTexturePool, createBoardImageTexturePool, loadBoardImageTexture, unloadBoardImageTexture };

package/dist/board/stage/texture-pool.js

@@ -0,0 +1,153 @@
+import { variantSource } from "../../media.js";
+import { loadVideoThumbnailTexture } from "../render/video-thumbnail.js";
+import { Assets, Texture } from "pixi.js";
+//#region src/board/stage/texture-pool.ts
+/** Load an image in the page's CORS context when Pixi's worker path fails. */
+function loadImageElementTexture(url) {
+	return new Promise((resolve, reject) => {
+		const image = new Image();
+		image.crossOrigin = "anonymous";
+		image.onload = () => {
+			try {
+				resolve(Texture.from(image));
+			} catch (error) {
+				reject(error);
+			}
+		};
+		image.onerror = () => reject(/* @__PURE__ */ new Error(`Failed to load board image: ${url}`));
+		image.src = url;
+	});
+}
+/**
+* Bypass the HTTP cache: an `<img>` that fetched this URL without CORS leaves
+* an entry lacking CORS headers, and every CORS load of it then fails.
+*/
+async function loadUncachedTexture(url) {
+	const response = await fetch(url, { cache: "no-store" });
+	if (!response.ok) throw new Error(`HTTP ${response.status}`);
+	return Texture.from(await createImageBitmap(await response.blob()));
+}
+/**
+* Keep Pixi's worker/ImageBitmap fast path, but recover through an anonymous
+* image element when that browser context rejects a cross-origin cover, then
+* through an uncached fetch when the cached copy is not CORS-readable.
+*/
+async function loadImageTexture(url) {
+	try {
+		return await Assets.load({
+			src: url,
+			parser: "texture"
+		});
+	} catch (workerError) {
+		const errors = [workerError];
+		for (const load of [loadImageElementTexture, loadUncachedTexture]) try {
+			return await load(url);
+		} catch (error) {
+			errors.push(error);
+		}
+		throw new AggregateError(errors, `Failed to load board image: ${url}`);
+	}
+}
+/** A CDN variant that fails to process falls back to the media it came from. */
+async function loadBoardImageTexture(url) {
+	try {
+		return await loadImageTexture(url);
+	} catch (error) {
+		const source = variantSource(url);
+		if (!source) throw error;
+		return source.type === "video" ? loadVideoThumbnailTexture(source.url) : loadImageTexture(source.url);
+	}
+}
+async function unloadBoardImageTexture(url, texture) {
+	await Assets.unload(url).catch(() => {});
+	if (!texture?.destroyed) texture?.destroy(true);
+}
+/**
+* Share image textures by resolved URL without sharing Board ownership.
+*
+* Pixi's Assets cache is global, but its unload operation is not reference
+* counted. The pool adds that missing application-level ownership layer:
+* multiple Board managers share one load and texture, while the last release
+* is the only one allowed to unload it.
+*/
+function createBoardImageTexturePool(options) {
+	const load = options?.loadTexture ?? loadBoardImageTexture;
+	const unload = options?.unloadTexture ?? unloadBoardImageTexture;
+	const entries = /* @__PURE__ */ new Map();
+	function removeIfIdle(url, entry) {
+		if (entry.refs === 0 && entry.loading === null && entry.unloading === null && entry.texture === null && entries.get(url) === entry) entries.delete(url);
+	}
+	function releaseFailedAcquire(url, entry) {
+		entry.refs = Math.max(0, entry.refs - 1);
+		removeIfIdle(url, entry);
+	}
+	function unloadIfIdle(url, entry) {
+		if (entry.refs > 0 || entry.loading || entry.unloading || !entry.texture) return entry.unloading ?? Promise.resolve();
+		const texture = entry.texture;
+		entry.texture = null;
+		const unloading = Promise.resolve().then(() => unload(url, texture)).catch(() => {});
+		entry.unloading = unloading;
+		unloading.finally(() => {
+			if (entry.unloading === unloading) entry.unloading = null;
+			removeIfIdle(url, entry);
+		});
+		return unloading;
+	}
+	async function acquire(url) {
+		let entry = entries.get(url);
+		if (!entry) {
+			entry = {
+				refs: 0,
+				texture: null,
+				loading: null,
+				unloading: null
+			};
+			entries.set(url, entry);
+		}
+		entry.refs += 1;
+		if (entry.unloading) await entry.unloading;
+		if (entry.texture) return entry.texture;
+		if (!entry.loading) {
+			const current = entry;
+			entry.loading = Promise.resolve().then(() => load(url)).then((texture) => {
+				current.loading = null;
+				current.texture = texture;
+				if (!texture) removeIfIdle(url, current);
+				else unloadIfIdle(url, current);
+				return texture;
+			}, (error) => {
+				current.loading = null;
+				removeIfIdle(url, current);
+				throw error;
+			});
+		}
+		try {
+			const texture = await entry.loading;
+			if (!texture) releaseFailedAcquire(url, entry);
+			return texture;
+		} catch (error) {
+			releaseFailedAcquire(url, entry);
+			throw error;
+		}
+	}
+	async function release(url) {
+		const entry = entries.get(url);
+		if (!entry || entry.refs <= 0) return;
+		entry.refs -= 1;
+		if (entry.refs > 0) return;
+		if (entry.loading) try {
+			await entry.loading;
+		} catch {
+			return;
+		}
+		if (entry.refs === 0) await unloadIfIdle(url, entry);
+		else removeIfIdle(url, entry);
+	}
+	return {
+		acquire,
+		release
+	};
+}
+const boardImageTexturePool = createBoardImageTexturePool();
+//#endregion
+export { boardImageTexturePool, createBoardImageTexturePool, loadBoardImageTexture, unloadBoardImageTexture };

package/dist/board/stage/views.d.ts

@@ -0,0 +1,38 @@
+import { BoardViewport } from "../model/geometry.js";
+import { BoardScene, BoardSceneItem } from "../model/scene.js";
+import "../model/index.js";
+import { BoardPointerEvent } from "../editor/interaction.js";
+import { BoardEditor } from "../editor/editor.js";
+import "../editor/index.js";
+//#region src/board/stage/views.d.ts
+type BoardItemViewContext = {
+  editor: BoardEditor;
+  zoom: number;
+  selected: boolean;
+  toPointerEvent(event: PointerEvent): BoardPointerEvent;
+};
+type BoardItemViewInstance = {
+  update?(item: BoardSceneItem, context: BoardItemViewContext): void;
+  destroy?(): void;
+};
+type BoardItemView = {
+  type: string | ((item: BoardSceneItem) => boolean);
+  mount(element: HTMLElement, item: BoardSceneItem, context: BoardItemViewContext): BoardItemViewInstance;
+};
+type BoardItemViewLayer = {
+  readonly element: HTMLElement;
+  sync(input: {
+    ids: ReadonlySet<string> | null;
+    scene: BoardScene;
+    camera: BoardViewport;
+    surface: {
+      width: number;
+      height: number;
+    };
+    selection: ReadonlySet<string>;
+  }): void;
+  destroy(): void;
+};
+declare function createBoardItemViewLayer(host: HTMLElement, editor: BoardEditor, views: readonly BoardItemView[], camera: () => BoardViewport): BoardItemViewLayer;
+//#endregion
+export { BoardItemView, BoardItemViewContext, BoardItemViewInstance, BoardItemViewLayer, createBoardItemViewLayer };

package/dist/board/stage/views.js

@@ -0,0 +1,93 @@
+import { toBoardPointerEvent } from "./pointer.js";
+//#region src/board/stage/views.ts
+const VISIBLE_MARGIN = 240;
+function screenStyle(frame, camera, order) {
+	const { zoom } = camera;
+	return [
+		`z-index:${order}`,
+		`left:${frame.x * zoom + camera.x}px`,
+		`top:${frame.y * zoom + camera.y}px`,
+		`width:${frame.width * zoom}px`,
+		`height:${frame.height * zoom}px`,
+		`--board-zoom:${zoom}`,
+		`transform:rotate(${frame.rotation}deg)`
+	].join(";");
+}
+function onScreen(frame, camera, surface) {
+	const left = frame.x * camera.zoom + camera.x;
+	const top = frame.y * camera.zoom + camera.y;
+	return left + frame.width * camera.zoom >= -240 && top + frame.height * camera.zoom >= -240 && left <= surface.width + VISIBLE_MARGIN && top <= surface.height + VISIBLE_MARGIN;
+}
+function createBoardItemViewLayer(host, editor, views, camera) {
+	const element = host.ownerDocument.createElement("div");
+	element.dataset.boardViews = "";
+	element.style.cssText = "position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none";
+	host.appendChild(element);
+	const mounted = /* @__PURE__ */ new Map();
+	const toPointerEvent = (event) => toBoardPointerEvent(event, host.getBoundingClientRect(), camera());
+	const viewFor = (item) => views.find((view) => typeof view.type === "string" ? view.type === item.type : view.type(item));
+	function unmount(id, entry) {
+		entry.instance.destroy?.();
+		entry.element.remove();
+		mounted.delete(id);
+	}
+	return {
+		element,
+		sync({ ids, scene, camera: view, surface, selection }) {
+			if (views.length === 0) return;
+			const live = /* @__PURE__ */ new Set();
+			for (const id of ids ?? scene.items.map((item) => item.id)) {
+				const item = scene.get(id);
+				if (!item) continue;
+				const itemView = viewFor(item);
+				if (!itemView || !onScreen(item.frame, view, surface)) continue;
+				live.add(item.id);
+				const context = {
+					editor,
+					zoom: view.zoom,
+					selected: selection.has(item.id),
+					toPointerEvent
+				};
+				const style = screenStyle(item.frame, view, scene.indexOf(item.id));
+				let entry = mounted.get(item.id);
+				if (entry && entry.view !== itemView) {
+					unmount(item.id, entry);
+					entry = void 0;
+				}
+				if (!entry) {
+					const node = host.ownerDocument.createElement("div");
+					node.dataset.boardItem = item.id;
+					node.style.cssText = `position:absolute;pointer-events:none;transform-origin:center;${style}`;
+					element.appendChild(node);
+					mounted.set(item.id, {
+						view: itemView,
+						element: node,
+						instance: itemView.mount(node, item, context),
+						item,
+						zoom: context.zoom,
+						selected: context.selected,
+						style
+					});
+					continue;
+				}
+				if (entry.style !== style) {
+					entry.element.style.cssText = `position:absolute;pointer-events:none;transform-origin:center;${style}`;
+					entry.style = style;
+				}
+				if (entry.item !== item || entry.zoom !== context.zoom || entry.selected !== context.selected) {
+					entry.item = item;
+					entry.zoom = context.zoom;
+					entry.selected = context.selected;
+					entry.instance.update?.(item, context);
+				}
+			}
+			for (const [id, entry] of mounted) if (!live.has(id)) unmount(id, entry);
+		},
+		destroy() {
+			for (const [id, entry] of mounted) unmount(id, entry);
+			element.remove();
+		}
+	};
+}
+//#endregion
+export { createBoardItemViewLayer };