@editframe/elements 0.20.4-beta.0 → 0.23.6-beta.0

package/dist/DelayedLoadingState.js

@@ -6,9 +6,6 @@ var DelayedLoadingState = class {
 		this.loadingDelayMs = delayMs;
 		this.onStateChange = onStateChange;
 	}
-	/**
-	* Start a delayed loading operation
-	*/
 	startLoading(operationId, message, options = {}) {
 		const isBackground = options.background || false;
 		const existingOp = this.operations.get(operationId);
@@ -34,9 +31,6 @@ var DelayedLoadingState = class {
 			isBackground: false
 		});
 	}
-	/**
-	* Clear a loading operation
-	*/
 	clearLoading(operationId) {
 		const operation = this.operations.get(operationId);
 		if (!operation) return;
@@ -44,36 +38,21 @@ var DelayedLoadingState = class {
 		this.operations.delete(operationId);
 		this.updateLoadingState();
 	}
-	/**
-	* Clear all loading operations
-	*/
 	clearAllLoading() {
 		for (const operation of this.operations.values()) if (operation.timeout) clearTimeout(operation.timeout);
 		this.operations.clear();
 		this.updateLoadingState();
 	}
-	/**
-	* Get current loading state
-	*/
 	get isLoading() {
 		return this.isCurrentlyLoading;
 	}
-	/**
-	* Get current loading message
-	*/
 	get message() {
 		return this.currentMessage;
 	}
-	/**
-	* Check if any non-background operations are active
-	*/
 	hasActiveOperations() {
 		for (const operation of this.operations.values()) if (!operation.isBackground) return true;
 		return false;
 	}
-	/**
-	* Get the message for the most recent non-background operation
-	*/
 	getCurrentMessage() {
 		let latestTime = 0;
 		let latestMessage = "";
@@ -83,9 +62,6 @@ var DelayedLoadingState = class {
 		}
 		return latestMessage;
 	}
-	/**
-	* Trigger loading state (called by timeout)
-	*/
 	triggerLoadingState() {
 		if (this.hasActiveOperations() && !this.isCurrentlyLoading) {
 			this.isCurrentlyLoading = true;
@@ -93,9 +69,6 @@ var DelayedLoadingState = class {
 			this.onStateChange?.(true, this.currentMessage);
 		}
 	}
-	/**
-	* Update loading state based on current operations
-	*/
 	updateLoadingState() {
 		const shouldBeLoading = this.hasActiveOperations();
 		if (shouldBeLoading !== this.isCurrentlyLoading) {

package/dist/EF_FRAMEGEN.d.ts

@@ -1,12 +1,14 @@
 import { VideoRenderOptions } from '../../assets/src/index.ts';
+import { TraceContext } from './otel/tracingHelpers.js';
 interface Bridge {
-    onInitialize: (callback: (renderOptions: VideoRenderOptions) => void) => void;
+    onInitialize: (callback: (renderOptions: VideoRenderOptions, traceContext?: TraceContext, otelEndpoint?: string) => void) => void;
     initialized(): void;
-    onBeginFrame(callback: (frameNumber: number, isLast: boolean) => void): void;
-    onTriggerCanvas(callback: () => void): void;
+    onBeginFrame(callback: (frameNumber: number, isLast: boolean, traceContext?: TraceContext) => void): void;
+    onTriggerCanvas(callback: (traceContext?: TraceContext) => void): void;
     frameReady(frameNumber: number, audioSamples: ArrayBuffer): void;
     error(error: Error): void;
     syncLog(sequence: number, message: string, callback: () => void): void;
+    exportSpans?: (endpoint: string, payload: string) => void;
 }
 declare global {
     interface Window {

package/dist/EF_FRAMEGEN.js

@@ -1,4 +1,6 @@
+import { clearCurrentFrameSpan, enableTracing, extractParentContext, setCurrentFrameSpan, withSpan, withSpanAndContext } from "./otel/tracingHelpers.js";
 import { shallowGetTimegroups } from "./elements/EFTimegroup.js";
+import { setupBrowserTracing } from "./otel/setupBrowserTracing.js";
 var TriggerCanvas = class {
 	constructor() {
 		this.canvasInitialized = false;
@@ -91,17 +93,54 @@ var EFFramegen = class {
 	connectToBridge() {
 		const BRIDGE = this.BRIDGE;
 		if (!BRIDGE) throw new Error("No BRIDGE when attempting to connect to bridge");
-		BRIDGE.onInitialize(async (renderOptions) => {
-			await this.initialize(renderOptions).catch((error) => {
-				console.error("[EF_FRAMEGEN.connectToBridge] error initializing", error);
+		BRIDGE.onInitialize(async (renderOptions, traceContext, otelEndpoint) => {
+			if (renderOptions.enableTracing && otelEndpoint) {
+				enableTracing();
+				await setupBrowserTracing({
+					otelEndpoint,
+					serviceName: "telecine-browser",
+					bridge: BRIDGE,
+					useBatching: true
+				});
+			}
+			const parentContext = extractParentContext(traceContext);
+			await withSpan("browser.initialize", {
+				width: renderOptions.encoderOptions.video.width,
+				height: renderOptions.encoderOptions.video.height,
+				fps: renderOptions.encoderOptions.video.framerate,
+				durationMs: renderOptions.encoderOptions.toMs - renderOptions.encoderOptions.fromMs
+			}, parentContext, async () => {
+				await this.initialize(renderOptions).catch((error) => {
+					console.error("[EF_FRAMEGEN.connectToBridge] error initializing", error);
+					throw error;
+				});
 			});
 			BRIDGE.initialized();
 		});
-		BRIDGE.onBeginFrame((frameNumber, isLast) => {
-			this.beginFrame(frameNumber, isLast);
+		BRIDGE.onBeginFrame((frameNumber, isLast, traceContext) => {
+			const parentContext = extractParentContext(traceContext);
+			withSpanAndContext("browser.frame.render", {
+				frameNumber,
+				isLast
+			}, parentContext, async (span, _spanContext) => {
+				setCurrentFrameSpan(span);
+				try {
+					await this.beginFrame(frameNumber, isLast);
+				} finally {
+					clearCurrentFrameSpan();
+				}
+			}).catch((error) => {
+				console.error("[EF_FRAMEGEN.beginFrame] error:", error);
+				clearCurrentFrameSpan();
+				throw error;
+			});
 		});
-		BRIDGE.onTriggerCanvas(() => {
-			this.triggerCanvas.trigger();
+		BRIDGE.onTriggerCanvas((traceContext) => {
+			withSpan("browser.canvas.trigger", {}, extractParentContext(traceContext), async () => {
+				this.triggerCanvas.trigger();
+			}).catch((error) => {
+				console.error("[EF_FRAMEGEN.triggerCanvas] error:", error);
+			});
 		});
 	}
 	get showFrameBox() {
@@ -113,8 +152,7 @@ var EFFramegen = class {
 		if (!workbench) throw new Error("No workbench found");
 		workbench.rendering = true;
 		workbench.playing = false;
-		const timegroups = shallowGetTimegroups(workbench);
-		const firstGroup = timegroups[0];
+		const firstGroup = shallowGetTimegroups(workbench)[0];
 		if (!firstGroup) throw new Error("No temporal elements found");
 		const startingTimeMs = renderOptions.encoderOptions.fromMs;
 		await firstGroup.waitForMediaDurations();
@@ -142,8 +180,7 @@ var EFFramegen = class {
 		const workbench = document.querySelector("ef-workbench");
 		if (!workbench) throw new Error("No workbench found");
 		workbench.rendering = true;
-		const timegroups = shallowGetTimegroups(workbench);
-		const firstGroup = timegroups[0];
+		const firstGroup = shallowGetTimegroups(workbench)[0];
 		if (!firstGroup) throw new Error("No temporal elements found");
 		const frameTime = this.renderOptions.encoderOptions.fromMs + frameNumber * this.frameDurationMs;
 		firstGroup.currentTimeMs = Number(Number(frameTime).toFixed(5));
@@ -183,3 +220,4 @@ var EFFramegen = class {
 	}
 };
 if (typeof window !== "undefined") window.EF_FRAMEGEN = new EFFramegen();
+export {};

package/dist/_virtual/_@oxc-project_runtime@0.94.0/helpers/decorate.js

@@ -0,0 +1,7 @@
+function __decorate(decorators, target, key, desc) {
+	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+	else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+	return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+export { __decorate };

package/dist/attachContextRoot.d.ts

@@ -0,0 +1 @@
+export declare const attachContextRoot: () => void;

package/dist/attachContextRoot.js

@@ -0,0 +1,9 @@
+import { ContextRoot } from "@lit/context";
+var contextRoot = null;
+const attachContextRoot = () => {
+	if (typeof window === "undefined") return;
+	if (contextRoot !== null) return;
+	contextRoot = new ContextRoot();
+	contextRoot.attach(document.body);
+};
+export { attachContextRoot };

package/dist/elements/ContextProxiesController.d.ts

@@ -20,7 +20,7 @@ export type ContextProxyConfig = {
  *   // @ts-expect-error controller is intentionally not referenced directly
  *   #contextProxyController = new ContextProxyController(this, {
  *     target: () => this.targetElement,
- *     contexts: [playingContext, loopContext, targetTimegroupContext]
+ *     contexts: [playingContext, loopContext, targetTemporalContext]
  *   });
  * }
  * ```
@@ -28,7 +28,6 @@ export type ContextProxyConfig = {
 export declare class ContextProxyController implements ReactiveController {
     private host;
     private proxyMap;
-    private boundHandler;
     private pendingRequests;
     constructor(host: LitElement, config: ContextProxyConfig);
     hostConnected(): void;

package/dist/elements/EFAudio.js

@@ -1,12 +1,12 @@
 import { EF_INTERACTIVE } from "../EF_INTERACTIVE.js";
-import { EFMedia } from "./EFMedia.js";
+import { __decorate } from "../_virtual/_@oxc-project_runtime@0.94.0/helpers/decorate.js";
 import { TWMixin } from "../gui/TWMixin2.js";
+import { EFMedia } from "./EFMedia.js";
 import { Task } from "@lit/task";
 import { html } from "lit";
 import { customElement, property } from "lit/decorators.js";
-import _decorate from "@oxc-project/runtime/helpers/decorate";
 import { createRef, ref } from "lit/directives/ref.js";
-let EFAudio = class EFAudio$1 extends TWMixin(EFMedia) {
+var EFAudio = class EFAudio$1 extends TWMixin(EFMedia) {
 	constructor(..._args) {
 		super(..._args);
 		this._propertyHack = false;
@@ -31,17 +31,13 @@ let EFAudio = class EFAudio$1 extends TWMixin(EFMedia) {
 	render() {
 		return html`<audio ${ref(this.audioElementRef)}></audio>`;
 	}
-	/**
-	* Legacy getter for fragment index task (maps to audioSegmentIdTask)
-	* Still used by EFCaptions
-	*/
 	get fragmentIndexTask() {
 		return this.audioSegmentIdTask;
 	}
 };
-_decorate([property({
+__decorate([property({
 	type: Boolean,
 	attribute: "dummy-property"
 })], EFAudio.prototype, "_propertyHack", void 0);
-EFAudio = _decorate([customElement("ef-audio")], EFAudio);
+EFAudio = __decorate([customElement("ef-audio")], EFAudio);
 export { EFAudio };

package/dist/elements/EFCaptions.d.ts

@@ -66,8 +66,6 @@ export declare class EFCaptionsAfterActiveWord extends EFCaptionsSegment {
 declare const EFCaptions_base: (new (...args: any[]) => import('./EFSourceMixin.js').EFSourceMixinInterface) & (new (...args: any[]) => import('./EFTemporal.js').TemporalMixinInterface) & (new (...args: any[]) => import('./FetchMixin.js').FetchMixinInterface) & typeof LitElement;
 export declare class EFCaptions extends EFCaptions_base {
     static styles: import('lit').CSSResult[];
-    displayMode: "word" | "segment" | "context";
-    contextWords: number;
     targetSelector: string;
     set target(value: string);
     wordStyle: string;
@@ -100,7 +98,7 @@ export declare class EFCaptions extends EFCaptions_base {
     private customCaptionsDataTask;
     private transcriptionFragmentDataTask;
     unifiedCaptionsDataTask: Task<readonly [Caption | null | undefined, Caption | null | undefined], Caption | null | undefined>;
-    frameTask: Task<TaskStatus[], void>;
+    frameTask: Task<readonly [TaskStatus, number], void>;
     connectedCallback(): void;
     protected updated(changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
     updateTextContainers(): void;