@editframe/elements 0.26.1-beta.0 → 0.26.3-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -268,12 +268,17 @@ let EFTimegroup = class EFTimegroup$1 extends EFTargetable(EFTemporal(TWMixin(Li
|
|
|
268
268
|
}
|
|
269
269
|
connectedCallback() {
|
|
270
270
|
super.connectedCallback();
|
|
271
|
-
if (!this.playbackController) this.waitForMediaDurations().then(() => {
|
|
271
|
+
if (!this.playbackController) this.waitForMediaDurations().then(async () => {
|
|
272
|
+
let didLoadFromStorage = false;
|
|
272
273
|
if (this.id) {
|
|
273
274
|
const maybeLoadedTime = this.loadTimeFromLocalStorage();
|
|
274
|
-
if (maybeLoadedTime !== void 0)
|
|
275
|
+
if (maybeLoadedTime !== void 0) {
|
|
276
|
+
this.currentTime = maybeLoadedTime;
|
|
277
|
+
didLoadFromStorage = true;
|
|
278
|
+
}
|
|
275
279
|
}
|
|
276
280
|
if (EF_INTERACTIVE && this.seekTask.status === TaskStatus.INITIAL) this.seekTask.run();
|
|
281
|
+
else if (didLoadFromStorage) await this.seekTask.run();
|
|
277
282
|
});
|
|
278
283
|
if (this.parentTimegroup) new TimegroupController(this.parentTimegroup, this);
|
|
279
284
|
if (this.shouldWrapWithWorkbench()) this.wrapWithWorkbench();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EFTimegroup.js","names":["sequenceDurationCache: WeakMap<EFTimegroup, number>","EFTimegroup","#executeCustomFrameTasks","#pendingSeekTime","#currentTime","#seekInProgress","#processingPendingSeek","#customFrameTasks","#handleSlotChange","#previousDurationMs","#resizeObserver","#waitForMediaDurations","loaderTasks: Promise<any>[]"],"sources":["../../src/elements/EFTimegroup.ts"],"sourcesContent":["import { provide } from \"@lit/context\";\nimport { Task, TaskStatus } from \"@lit/task\";\nimport debug from \"debug\";\nimport { css, html, LitElement, type PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\n\nimport { EF_INTERACTIVE } from \"../EF_INTERACTIVE.js\";\nimport { EF_RENDERING } from \"../EF_RENDERING.js\";\nimport { isContextMixin } from \"../gui/ContextMixin.js\";\nimport { efContext } from \"../gui/efContext.js\";\nimport { TWMixin } from \"../gui/TWMixin.js\";\nimport { isTracingEnabled, withSpan } from \"../otel/tracingHelpers.js\";\nimport { deepGetMediaElements, type EFMedia } from \"./EFMedia.js\";\nimport {\n deepGetElementsWithFrameTasks,\n EFTemporal,\n flushStartTimeMsCache,\n resetTemporalCache,\n shallowGetTemporalElements,\n timegroupContext,\n} from \"./EFTemporal.js\";\nimport { parseTimeToMs } from \"./parseTimeToMs.js\";\nimport { renderTemporalAudio } from \"./renderTemporalAudio.js\";\nimport { EFTargetable } from \"./TargetController.js\";\nimport { TimegroupController } from \"./TimegroupController.js\";\nimport {\n evaluateTemporalStateForAnimation,\n updateAnimations,\n} from \"./updateAnimations.ts\";\n\ndeclare global {\n var EF_DEV_WORKBENCH: boolean | undefined;\n}\n\nconst log = debug(\"ef:elements:EFTimegroup\");\n\n// Custom frame task callback type\nexport type FrameTaskCallback = (info: {\n ownCurrentTimeMs: number;\n currentTimeMs: number;\n durationMs: number;\n percentComplete: number;\n element: EFTimegroup;\n}) => void | Promise<void>;\n\n// Cache for sequence mode duration calculations to avoid O(n) recalculation\nlet sequenceDurationCache: WeakMap<EFTimegroup, number> = new WeakMap();\n\nexport const flushSequenceDurationCache = () => {\n sequenceDurationCache = new WeakMap();\n};\n\nexport const shallowGetTimegroups = (\n element: Element,\n groups: EFTimegroup[] = [],\n) => {\n for (const child of Array.from(element.children)) {\n if (child instanceof EFTimegroup) {\n groups.push(child);\n } else {\n shallowGetTimegroups(child, groups);\n }\n }\n return groups;\n};\n\n@customElement(\"ef-timegroup\")\nexport class EFTimegroup extends EFTargetable(EFTemporal(TWMixin(LitElement))) {\n static get observedAttributes(): string[] {\n // biome-ignore lint/complexity/noThisInStatic: It's okay to use this here\n const parentAttributes = super.observedAttributes || [];\n return [\n ...parentAttributes,\n \"mode\",\n \"overlap\",\n \"currenttime\",\n \"fit\",\n \"fps\",\n ];\n }\n\n static styles = css`\n :host {\n display: block;\n position: relative;\n overflow: hidden;\n }\n\n ::slotted(ef-timegroup) {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n overflow: initial;\n }\n `;\n\n @provide({ context: timegroupContext })\n _timeGroupContext = this;\n\n @provide({ context: efContext })\n efContext = this;\n\n mode: \"fit\" | \"fixed\" | \"sequence\" | \"contain\" = \"contain\";\n overlapMs = 0;\n\n @property({ type: Number })\n fps = 30;\n\n attributeChangedCallback(\n name: string,\n old: string | null,\n value: string | null,\n ): void {\n if (name === \"mode\" && value) {\n this.mode = value as typeof this.mode;\n }\n if (name === \"overlap\" && value) {\n this.overlapMs = parseTimeToMs(value);\n }\n if (name === \"fps\" && value) {\n this.fps = Number.parseFloat(value);\n }\n super.attributeChangedCallback(name, old, value);\n }\n\n @property({ type: String })\n fit: \"none\" | \"contain\" | \"cover\" = \"none\";\n\n #resizeObserver?: ResizeObserver;\n\n #currentTime: number | undefined = undefined;\n #seekInProgress = false;\n #pendingSeekTime: number | undefined;\n #processingPendingSeek = false;\n #customFrameTasks: Set<FrameTaskCallback> = new Set();\n\n /**\n * Get the effective FPS for this timegroup.\n * During rendering, uses the render options FPS if available.\n * Otherwise uses the configured fps property.\n */\n get effectiveFps(): number {\n // During rendering, prefer the render options FPS\n if (typeof window !== \"undefined\" && window.EF_FRAMEGEN?.renderOptions) {\n return window.EF_FRAMEGEN.renderOptions.encoderOptions.video.framerate;\n }\n return this.fps;\n }\n\n /**\n * Quantize a time value to the nearest frame boundary based on effectiveFps.\n * @param timeSeconds - Time in seconds\n * @returns Time quantized to frame boundaries in seconds\n */\n private quantizeToFrameTime(timeSeconds: number): number {\n const fps = this.effectiveFps;\n if (!fps || fps <= 0) return timeSeconds;\n const frameDurationS = 1 / fps;\n return Math.round(timeSeconds / frameDurationS) * frameDurationS;\n }\n\n private async runThrottledFrameTask(): Promise<void> {\n if (this.playbackController) {\n return this.playbackController.runThrottledFrameTask();\n }\n await this.frameTask.run();\n }\n\n @property({ type: Number, attribute: \"currenttime\" })\n set currentTime(time: number) {\n // Quantize time to frame boundaries based on fps\n // Do this BEFORE delegating to playbackController to ensure consistency\n time = this.quantizeToFrameTime(time);\n\n if (this.playbackController) {\n this.playbackController.currentTime = time;\n return;\n }\n\n time = Math.max(0, Math.min(this.durationMs / 1000, time));\n if (!this.isRootTimegroup) {\n return;\n }\n if (Number.isNaN(time)) {\n return;\n }\n if (time === this.#currentTime && !this.#processingPendingSeek) {\n return;\n }\n if (this.#pendingSeekTime === time) {\n return;\n }\n\n if (this.#seekInProgress) {\n this.#pendingSeekTime = time;\n this.#currentTime = time;\n return;\n }\n\n this.#currentTime = time;\n this.#seekInProgress = true;\n\n this.seekTask.run().finally(() => {\n if (\n this.#pendingSeekTime !== undefined &&\n this.#pendingSeekTime !== time\n ) {\n const pendingTime = this.#pendingSeekTime;\n this.#pendingSeekTime = undefined;\n this.#processingPendingSeek = true;\n try {\n this.currentTime = pendingTime;\n } finally {\n this.#processingPendingSeek = false;\n }\n } else {\n this.#pendingSeekTime = undefined;\n }\n });\n }\n\n get currentTime() {\n if (this.playbackController) {\n return this.playbackController.currentTime;\n }\n return this.#currentTime ?? 0;\n }\n\n set currentTimeMs(ms: number) {\n this.currentTime = ms / 1000;\n }\n\n get currentTimeMs() {\n return this.currentTime * 1000;\n }\n\n /**\n * Seek to a specific time and wait for all frames to be ready.\n * This is the recommended way to seek in tests and programmatic control.\n *\n * @param timeMs - Time in milliseconds to seek to\n * @returns Promise that resolves when the seek is complete and all visible children are ready\n */\n async seek(timeMs: number): Promise<void> {\n this.currentTimeMs = timeMs;\n await this.seekTask.taskComplete;\n\n // Handle localStorage when playbackController delegates seek\n if (this.playbackController) {\n this.saveTimeToLocalStorage(this.currentTime);\n }\n\n await this.frameTask.taskComplete;\n\n // Ensure all visible elements have completed their reactive update cycles AND frame rendering\n // waitForFrameTasks() calls frameTask.run() on children, but this may happen before child\n // elements have processed property changes from requestUpdate(). To ensure frame data is\n // accurate, we wait for updateComplete first, then ensure the frameTask has run with the\n // updated properties. Elements like EFVideo provide waitForFrameReady() for this pattern.\n const temporalElements = deepGetElementsWithFrameTasks(this);\n const visibleElements = temporalElements.filter((element) => {\n const animationState = evaluateTemporalStateForAnimation(element);\n return animationState.isVisible;\n });\n\n await Promise.all(\n visibleElements.map(async (element) => {\n if (\n \"waitForFrameReady\" in element &&\n typeof element.waitForFrameReady === \"function\"\n ) {\n await (element as any).waitForFrameReady();\n } else {\n await element.updateComplete;\n }\n }),\n );\n }\n\n /**\n * Determines if this is a root timegroup (no parent timegroups)\n */\n get isRootTimegroup(): boolean {\n return !this.parentTimegroup;\n }\n\n /**\n * Register a custom frame task callback that will be executed during frame rendering.\n * The callback receives timing information and can be async or sync.\n * Multiple callbacks can be registered and will execute in parallel.\n *\n * @param callback - Function to execute on each frame\n * @returns A cleanup function that removes the callback when called\n */\n addFrameTask(callback: FrameTaskCallback): () => void {\n if (typeof callback !== \"function\") {\n throw new Error(\"Frame task callback must be a function\");\n }\n this.#customFrameTasks.add(callback);\n return () => {\n this.#customFrameTasks.delete(callback);\n };\n }\n\n /**\n * Remove a previously registered custom frame task callback.\n *\n * @param callback - The callback function to remove\n */\n removeFrameTask(callback: FrameTaskCallback): void {\n this.#customFrameTasks.delete(callback);\n }\n\n saveTimeToLocalStorage(time: number) {\n try {\n if (this.id && this.isConnected && !Number.isNaN(time)) {\n localStorage.setItem(this.storageKey, time.toString());\n }\n } catch (error) {\n log(\"Failed to save time to localStorage\", error);\n }\n }\n\n render() {\n return html`<slot @slotchange=${this.#handleSlotChange}></slot> `;\n }\n\n #handleSlotChange = () => {\n // Invalidate caches when slot content changes\n resetTemporalCache();\n flushSequenceDurationCache();\n flushStartTimeMsCache();\n\n // Request update to trigger recalculation of dependent properties\n this.requestUpdate();\n };\n\n loadTimeFromLocalStorage(): number | undefined {\n if (this.id) {\n try {\n const storedValue = localStorage.getItem(this.storageKey);\n if (storedValue === null) {\n return undefined;\n }\n return Number.parseFloat(storedValue);\n } catch (error) {\n log(\"Failed to load time from localStorage\", error);\n }\n }\n return undefined;\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n if (!this.playbackController) {\n this.waitForMediaDurations().then(() => {\n if (this.id) {\n const maybeLoadedTime = this.loadTimeFromLocalStorage();\n if (maybeLoadedTime !== undefined) {\n this.currentTime = maybeLoadedTime;\n }\n }\n if (EF_INTERACTIVE && this.seekTask.status === TaskStatus.INITIAL) {\n this.seekTask.run();\n }\n });\n }\n\n if (this.parentTimegroup) {\n new TimegroupController(this.parentTimegroup, this);\n }\n\n if (this.shouldWrapWithWorkbench()) {\n this.wrapWithWorkbench();\n }\n }\n\n #previousDurationMs = 0;\n\n protected updated(changedProperties: PropertyValues): void {\n super.updated(changedProperties);\n\n if (changedProperties.has(\"mode\") || changedProperties.has(\"overlapMs\")) {\n sequenceDurationCache.delete(this);\n }\n\n if (this.#previousDurationMs !== this.durationMs) {\n this.#previousDurationMs = this.durationMs;\n this.runThrottledFrameTask();\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#resizeObserver?.disconnect();\n }\n\n get storageKey() {\n if (!this.id) {\n throw new Error(\"Timegroup must have an id to use localStorage.\");\n }\n return `ef-timegroup-${this.id}`;\n }\n\n get intrinsicDurationMs() {\n if (this.hasExplicitDuration) {\n return this.explicitDurationMs;\n }\n return undefined;\n }\n\n get hasOwnDuration() {\n return (\n this.mode === \"contain\" ||\n this.mode === \"sequence\" ||\n (this.mode === \"fixed\" && this.hasExplicitDuration)\n );\n }\n\n get durationMs(): number {\n switch (this.mode) {\n case \"fit\": {\n if (!this.parentTimegroup) {\n return 0;\n }\n return this.parentTimegroup.durationMs;\n }\n case \"fixed\":\n return super.durationMs;\n case \"sequence\": {\n // Check cache first to avoid expensive O(n) recalculation\n const cachedDuration = sequenceDurationCache.get(this);\n if (cachedDuration !== undefined) {\n return cachedDuration;\n }\n\n let duration = 0;\n this.childTemporals.forEach((child, index) => {\n if (child instanceof EFTimegroup && child.mode === \"fit\") {\n return;\n }\n if (index > 0) {\n duration -= this.overlapMs;\n }\n duration += child.durationMs;\n });\n\n // Cache the calculated duration\n sequenceDurationCache.set(this, duration);\n return duration;\n }\n case \"contain\": {\n let maxDuration = 0;\n for (const child of this.childTemporals) {\n // fit timegroups look \"up\" to their parent timegroup for their duration\n // so we need to skip them to avoid an infinite loop\n if (child instanceof EFTimegroup && child.mode === \"fit\") {\n continue;\n }\n if (!child.hasOwnDuration) {\n continue;\n }\n maxDuration = Math.max(maxDuration, child.durationMs);\n }\n return maxDuration;\n }\n default:\n throw new Error(`Invalid time mode: ${this.mode}`);\n }\n }\n\n async getPendingFrameTasks(signal?: AbortSignal) {\n await this.waitForNestedUpdates(signal);\n signal?.throwIfAborted();\n const temporals = deepGetElementsWithFrameTasks(this);\n\n // Filter to only include temporally visible elements for frame processing\n // (but keep all elements for duration calculations)\n // Use the target timeline time if we're in the middle of seeking\n const timelineTimeMs =\n (this.#pendingSeekTime ?? this.#currentTime ?? 0) * 1000;\n const activeTemporals = temporals.filter((temporal) => {\n // Skip timeline filtering if temporal doesn't have timeline position info\n if (!(\"startTimeMs\" in temporal) || !(\"endTimeMs\" in temporal)) {\n return true; // Keep non-temporal elements\n }\n\n // Only process frame tasks for elements that overlap the current timeline\n // Use same epsilon logic as seek task for consistency\n const epsilon = 0.001; // 1µs offset to break ties at boundaries\n const startTimeMs = (temporal as any).startTimeMs as number;\n const endTimeMs = (temporal as any).endTimeMs as number;\n const elementStartsBeforeEnd = startTimeMs <= timelineTimeMs + epsilon;\n // Root timegroups should remain visible at exact end time, but other elements use exclusive end for clean transitions\n const isRootTimegroup =\n temporal.tagName.toLowerCase() === \"ef-timegroup\" &&\n !(temporal as any).parentTimegroup;\n const useInclusiveEnd = isRootTimegroup;\n const elementEndsAfterStart = useInclusiveEnd\n ? endTimeMs >= timelineTimeMs\n : endTimeMs > timelineTimeMs;\n return elementStartsBeforeEnd && elementEndsAfterStart;\n });\n\n const frameTasks = activeTemporals.map((temporal) => temporal.frameTask);\n frameTasks.forEach((task) => {\n task.run();\n });\n\n return frameTasks.filter((task) => task.status < TaskStatus.COMPLETE);\n }\n\n async waitForNestedUpdates(signal?: AbortSignal) {\n const limit = 10;\n let steps = 0;\n let isComplete = true;\n while (true) {\n steps++;\n if (steps > limit) {\n throw new Error(\"Reached update depth limit.\");\n }\n isComplete = await this.updateComplete;\n signal?.throwIfAborted();\n if (isComplete) {\n break;\n }\n }\n }\n\n async waitForFrameTasks() {\n const result = await withSpan(\n \"timegroup.waitForFrameTasks\",\n {\n timegroupId: this.id || \"unknown\",\n mode: this.mode,\n },\n undefined,\n async (span) => {\n const innerStart = performance.now();\n\n const temporalElements = deepGetElementsWithFrameTasks(this);\n if (isTracingEnabled()) {\n span.setAttribute(\"temporalElementsCount\", temporalElements.length);\n }\n\n // Filter to only include temporally visible elements for frame processing\n // Use animation-friendly visibility to prevent animation jumps at exact boundaries\n const visibleElements = temporalElements.filter((element) => {\n const animationState = evaluateTemporalStateForAnimation(element);\n return animationState.isVisible;\n });\n if (isTracingEnabled()) {\n span.setAttribute(\"visibleElementsCount\", visibleElements.length);\n }\n\n const promiseStart = performance.now();\n\n await Promise.all(\n visibleElements.map((element) => element.frameTask.run()),\n );\n const promiseEnd = performance.now();\n\n const innerEnd = performance.now();\n if (isTracingEnabled()) {\n span.setAttribute(\"actualInnerMs\", innerEnd - innerStart);\n span.setAttribute(\"promiseAwaitMs\", promiseEnd - promiseStart);\n }\n },\n );\n\n return result;\n }\n\n mediaDurationsPromise: Promise<void> | undefined = undefined;\n\n async waitForMediaDurations() {\n if (!this.mediaDurationsPromise) {\n this.mediaDurationsPromise = this.#waitForMediaDurations();\n }\n return this.mediaDurationsPromise;\n }\n\n /**\n * Wait for all media elements to load their initial segments.\n * Ideally we would only need the extracted index json data, but\n * that caused issues with constructing audio data. We had negative durations\n * in calculations and it was not clear why.\n */\n async #waitForMediaDurations() {\n return withSpan(\n \"timegroup.waitForMediaDurations\",\n {\n timegroupId: this.id || \"unknown\",\n mode: this.mode,\n },\n undefined,\n async (span) => {\n // We must await updateComplete to ensure all media elements inside this are connected\n // and will match deepGetMediaElements\n await this.updateComplete;\n const mediaElements = deepGetMediaElements(this);\n if (isTracingEnabled()) {\n span.setAttribute(\"mediaElementsCount\", mediaElements.length);\n }\n\n // Then, we must await the fragmentIndexTask to ensure all media elements have their\n // fragment index loaded, which is where their duration is parsed from.\n await Promise.all(\n mediaElements.map((m) =>\n m.mediaEngineTask.value\n ? Promise.resolve()\n : m.mediaEngineTask.run(),\n ),\n );\n\n // After waiting for durations, we must force some updates to cascade and ensure all temporal elements\n // have correct durations and start times. It is not ideal that we have to do this inside here,\n // but it is the best current way to ensure that all temporal elements have correct durations and start times.\n\n // Next, we must flush the startTimeMs cache to ensure all media elements have their\n // startTimeMs parsed fresh, otherwise the startTimeMs is cached per animation frame.\n flushStartTimeMsCache();\n\n // Flush duration cache since child durations may have changed\n flushSequenceDurationCache();\n\n // Request an update to the currentTime of this group, ensuring that time updates will cascade\n // down to children, forcing sequence groups to arrange correctly.\n // This also makes the filmstrip update correctly.\n this.requestUpdate(\"currentTime\");\n // Finally, we must await updateComplete to ensure all temporal elements have their\n // currentTime updated and all animations have run.\n\n await this.updateComplete;\n },\n );\n }\n\n get childTemporals() {\n return shallowGetTemporalElements(this);\n }\n\n get contextProvider() {\n let parent = this.parentNode;\n while (parent) {\n if (isContextMixin(parent)) {\n return parent;\n }\n parent = parent.parentNode;\n }\n return null;\n }\n\n /**\n * Returns true if the timegroup should be wrapped with a workbench.\n *\n * A timegroup should be wrapped with a workbench if:\n * - It's being rendered (EF_RENDERING), OR\n * - It's in interactive mode (EF_INTERACTIVE) with the dev workbench flag set\n *\n * If the timegroup is already wrapped in a context provider like ef-preview,\n * it should NOT be wrapped in a workbench.\n */\n shouldWrapWithWorkbench() {\n const isRendering = EF_RENDERING?.() === true;\n\n // During rendering, always wrap with workbench (needed by EF_FRAMEGEN)\n if (isRendering) {\n return (\n this.closest(\"ef-timegroup\") === this &&\n this.closest(\"ef-preview\") === null &&\n this.closest(\"ef-workbench\") === null &&\n this.closest(\"test-context\") === null\n );\n }\n\n // During interactive mode, respect the dev workbench flag\n if (!globalThis.EF_DEV_WORKBENCH) {\n return false;\n }\n\n return (\n EF_INTERACTIVE &&\n this.closest(\"ef-timegroup\") === this &&\n this.closest(\"ef-preview\") === null &&\n this.closest(\"ef-workbench\") === null &&\n this.closest(\"test-context\") === null\n );\n }\n\n wrapWithWorkbench() {\n const workbench = document.createElement(\"ef-workbench\");\n this.parentElement?.append(workbench);\n if (!this.hasAttribute(\"id\")) {\n this.setAttribute(\"id\", \"root-this\");\n }\n this.setAttribute(\"slot\", \"canvas\");\n workbench.append(this as unknown as Element);\n\n const filmstrip = document.createElement(\"ef-filmstrip\");\n filmstrip.setAttribute(\"slot\", \"timeline\");\n filmstrip.setAttribute(\"target\", this.id);\n workbench.append(filmstrip);\n }\n\n get efElements() {\n return Array.from(\n this.querySelectorAll(\n \"ef-audio, ef-video, ef-image, ef-captions, ef-waveform\",\n ),\n );\n }\n\n /**\n * Returns media elements for playback audio rendering\n * For standalone media, returns [this]; for timegroups, returns all descendants\n * Used by PlaybackController for audio-driven playback\n */\n getMediaElements(): EFMedia[] {\n return deepGetMediaElements(this);\n }\n\n /**\n * Render audio buffer for playback\n * Called by PlaybackController during live playback\n * Delegates to shared renderTemporalAudio utility for consistent behavior\n */\n async renderAudio(fromMs: number, toMs: number): Promise<AudioBuffer> {\n return renderTemporalAudio(this, fromMs, toMs);\n }\n\n /**\n * TEMPORARY TEST METHOD: Renders audio and immediately plays it back\n * Usage: timegroup.testPlayAudio(0, 5000) // Play first 5 seconds\n */\n async testPlayAudio(fromMs: number, toMs: number) {\n // Render the audio using the existing renderAudio method\n const renderedBuffer = await this.renderAudio(fromMs, toMs);\n\n // Create a regular AudioContext for playback\n const playbackContext = new AudioContext();\n\n // Create a buffer source and connect it\n const bufferSource = playbackContext.createBufferSource();\n bufferSource.buffer = renderedBuffer;\n bufferSource.connect(playbackContext.destination);\n\n // Start playback immediately\n bufferSource.start(0);\n\n // Return a promise that resolves when playback ends\n return new Promise<void>((resolve) => {\n bufferSource.onended = () => {\n playbackContext.close();\n resolve();\n };\n });\n }\n\n async loadMd5Sums() {\n const efElements = this.efElements;\n const loaderTasks: Promise<any>[] = [];\n for (const el of efElements) {\n const md5SumLoader = (el as any).md5SumLoader;\n if (md5SumLoader instanceof Task) {\n md5SumLoader.run();\n loaderTasks.push(md5SumLoader.taskComplete);\n }\n }\n\n await Promise.all(loaderTasks);\n\n efElements.forEach((el) => {\n if (\"productionSrc\" in el && el.productionSrc instanceof Function) {\n el.setAttribute(\"src\", el.productionSrc());\n }\n });\n }\n\n frameTask = new Task(this, {\n // autoRun: EF_INTERACTIVE,\n autoRun: false,\n args: () => [this.ownCurrentTimeMs, this.currentTimeMs] as const,\n task: async ([ownCurrentTimeMs, currentTimeMs]) => {\n if (this.isRootTimegroup) {\n await withSpan(\n \"timegroup.frameTask\",\n {\n timegroupId: this.id || \"unknown\",\n ownCurrentTimeMs,\n currentTimeMs,\n },\n undefined,\n async () => {\n await this.waitForFrameTasks();\n await this.#executeCustomFrameTasks();\n updateAnimations(this);\n },\n );\n } else {\n // Non-root timegroups execute their custom frame tasks when called\n await this.#executeCustomFrameTasks();\n }\n },\n });\n\n async #executeCustomFrameTasks() {\n if (this.#customFrameTasks.size > 0) {\n const percentComplete =\n this.durationMs > 0 ? this.ownCurrentTimeMs / this.durationMs : 0;\n const frameInfo = {\n ownCurrentTimeMs: this.ownCurrentTimeMs,\n currentTimeMs: this.currentTimeMs,\n durationMs: this.durationMs,\n percentComplete,\n element: this,\n };\n\n await Promise.all(\n Array.from(this.#customFrameTasks).map((callback) =>\n Promise.resolve(callback(frameInfo)),\n ),\n );\n }\n }\n\n seekTask = new Task(this, {\n autoRun: false,\n args: () => [this.#pendingSeekTime ?? this.#currentTime] as const,\n onComplete: () => {},\n task: async ([targetTime]) => {\n if (this.playbackController) {\n await this.playbackController.seekTask.taskComplete;\n return this.currentTime;\n }\n\n if (!this.isRootTimegroup) {\n return;\n }\n return withSpan(\n \"timegroup.seekTask\",\n {\n timegroupId: this.id || \"unknown\",\n targetTime: targetTime ?? 0,\n durationMs: this.durationMs,\n },\n undefined,\n async (span) => {\n await this.waitForMediaDurations();\n const newTime = Math.max(\n 0,\n Math.min(targetTime ?? 0, this.durationMs / 1000),\n );\n if (isTracingEnabled()) {\n span.setAttribute(\"newTime\", newTime);\n }\n // Apply the clamped time back to currentTime\n\n this.#currentTime = newTime;\n this.requestUpdate(\"currentTime\");\n await this.runThrottledFrameTask();\n this.saveTimeToLocalStorage(this.#currentTime);\n this.#seekInProgress = false;\n return newTime;\n },\n );\n },\n });\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"ef-timegroup\": EFTimegroup & Element;\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EFTimegroup.js","names":["sequenceDurationCache: WeakMap<EFTimegroup, number>","EFTimegroup","#executeCustomFrameTasks","#pendingSeekTime","#currentTime","#seekInProgress","#processingPendingSeek","#customFrameTasks","#handleSlotChange","#previousDurationMs","#resizeObserver","#waitForMediaDurations","loaderTasks: Promise<any>[]"],"sources":["../../src/elements/EFTimegroup.ts"],"sourcesContent":["import { provide } from \"@lit/context\";\nimport { Task, TaskStatus } from \"@lit/task\";\nimport debug from \"debug\";\nimport { css, html, LitElement, type PropertyValues } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\n\nimport { EF_INTERACTIVE } from \"../EF_INTERACTIVE.js\";\nimport { EF_RENDERING } from \"../EF_RENDERING.js\";\nimport { isContextMixin } from \"../gui/ContextMixin.js\";\nimport { efContext } from \"../gui/efContext.js\";\nimport { TWMixin } from \"../gui/TWMixin.js\";\nimport { isTracingEnabled, withSpan } from \"../otel/tracingHelpers.js\";\nimport { deepGetMediaElements, type EFMedia } from \"./EFMedia.js\";\nimport {\n deepGetElementsWithFrameTasks,\n EFTemporal,\n flushStartTimeMsCache,\n resetTemporalCache,\n shallowGetTemporalElements,\n timegroupContext,\n} from \"./EFTemporal.js\";\nimport { parseTimeToMs } from \"./parseTimeToMs.js\";\nimport { renderTemporalAudio } from \"./renderTemporalAudio.js\";\nimport { EFTargetable } from \"./TargetController.js\";\nimport { TimegroupController } from \"./TimegroupController.js\";\nimport {\n evaluateTemporalStateForAnimation,\n updateAnimations,\n} from \"./updateAnimations.ts\";\n\ndeclare global {\n var EF_DEV_WORKBENCH: boolean | undefined;\n}\n\nconst log = debug(\"ef:elements:EFTimegroup\");\n\n// Custom frame task callback type\nexport type FrameTaskCallback = (info: {\n ownCurrentTimeMs: number;\n currentTimeMs: number;\n durationMs: number;\n percentComplete: number;\n element: EFTimegroup;\n}) => void | Promise<void>;\n\n// Cache for sequence mode duration calculations to avoid O(n) recalculation\nlet sequenceDurationCache: WeakMap<EFTimegroup, number> = new WeakMap();\n\nexport const flushSequenceDurationCache = () => {\n sequenceDurationCache = new WeakMap();\n};\n\nexport const shallowGetTimegroups = (\n element: Element,\n groups: EFTimegroup[] = [],\n) => {\n for (const child of Array.from(element.children)) {\n if (child instanceof EFTimegroup) {\n groups.push(child);\n } else {\n shallowGetTimegroups(child, groups);\n }\n }\n return groups;\n};\n\n@customElement(\"ef-timegroup\")\nexport class EFTimegroup extends EFTargetable(EFTemporal(TWMixin(LitElement))) {\n static get observedAttributes(): string[] {\n // biome-ignore lint/complexity/noThisInStatic: It's okay to use this here\n const parentAttributes = super.observedAttributes || [];\n return [\n ...parentAttributes,\n \"mode\",\n \"overlap\",\n \"currenttime\",\n \"fit\",\n \"fps\",\n ];\n }\n\n static styles = css`\n :host {\n display: block;\n position: relative;\n overflow: hidden;\n }\n\n ::slotted(ef-timegroup) {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n overflow: initial;\n }\n `;\n\n @provide({ context: timegroupContext })\n _timeGroupContext = this;\n\n @provide({ context: efContext })\n efContext = this;\n\n mode: \"fit\" | \"fixed\" | \"sequence\" | \"contain\" = \"contain\";\n overlapMs = 0;\n\n @property({ type: Number })\n fps = 30;\n\n attributeChangedCallback(\n name: string,\n old: string | null,\n value: string | null,\n ): void {\n if (name === \"mode\" && value) {\n this.mode = value as typeof this.mode;\n }\n if (name === \"overlap\" && value) {\n this.overlapMs = parseTimeToMs(value);\n }\n if (name === \"fps\" && value) {\n this.fps = Number.parseFloat(value);\n }\n super.attributeChangedCallback(name, old, value);\n }\n\n @property({ type: String })\n fit: \"none\" | \"contain\" | \"cover\" = \"none\";\n\n #resizeObserver?: ResizeObserver;\n\n #currentTime: number | undefined = undefined;\n #seekInProgress = false;\n #pendingSeekTime: number | undefined;\n #processingPendingSeek = false;\n #customFrameTasks: Set<FrameTaskCallback> = new Set();\n\n /**\n * Get the effective FPS for this timegroup.\n * During rendering, uses the render options FPS if available.\n * Otherwise uses the configured fps property.\n */\n get effectiveFps(): number {\n // During rendering, prefer the render options FPS\n if (typeof window !== \"undefined\" && window.EF_FRAMEGEN?.renderOptions) {\n return window.EF_FRAMEGEN.renderOptions.encoderOptions.video.framerate;\n }\n return this.fps;\n }\n\n /**\n * Quantize a time value to the nearest frame boundary based on effectiveFps.\n * @param timeSeconds - Time in seconds\n * @returns Time quantized to frame boundaries in seconds\n */\n private quantizeToFrameTime(timeSeconds: number): number {\n const fps = this.effectiveFps;\n if (!fps || fps <= 0) return timeSeconds;\n const frameDurationS = 1 / fps;\n return Math.round(timeSeconds / frameDurationS) * frameDurationS;\n }\n\n private async runThrottledFrameTask(): Promise<void> {\n if (this.playbackController) {\n return this.playbackController.runThrottledFrameTask();\n }\n await this.frameTask.run();\n }\n\n @property({ type: Number, attribute: \"currenttime\" })\n set currentTime(time: number) {\n // Quantize time to frame boundaries based on fps\n // Do this BEFORE delegating to playbackController to ensure consistency\n time = this.quantizeToFrameTime(time);\n\n if (this.playbackController) {\n this.playbackController.currentTime = time;\n return;\n }\n\n time = Math.max(0, Math.min(this.durationMs / 1000, time));\n if (!this.isRootTimegroup) {\n return;\n }\n if (Number.isNaN(time)) {\n return;\n }\n if (time === this.#currentTime && !this.#processingPendingSeek) {\n return;\n }\n if (this.#pendingSeekTime === time) {\n return;\n }\n\n if (this.#seekInProgress) {\n this.#pendingSeekTime = time;\n this.#currentTime = time;\n return;\n }\n\n this.#currentTime = time;\n this.#seekInProgress = true;\n\n this.seekTask.run().finally(() => {\n if (\n this.#pendingSeekTime !== undefined &&\n this.#pendingSeekTime !== time\n ) {\n const pendingTime = this.#pendingSeekTime;\n this.#pendingSeekTime = undefined;\n this.#processingPendingSeek = true;\n try {\n this.currentTime = pendingTime;\n } finally {\n this.#processingPendingSeek = false;\n }\n } else {\n this.#pendingSeekTime = undefined;\n }\n });\n }\n\n get currentTime() {\n if (this.playbackController) {\n return this.playbackController.currentTime;\n }\n return this.#currentTime ?? 0;\n }\n\n set currentTimeMs(ms: number) {\n this.currentTime = ms / 1000;\n }\n\n get currentTimeMs() {\n return this.currentTime * 1000;\n }\n\n /**\n * Seek to a specific time and wait for all frames to be ready.\n * This is the recommended way to seek in tests and programmatic control.\n *\n * @param timeMs - Time in milliseconds to seek to\n * @returns Promise that resolves when the seek is complete and all visible children are ready\n */\n async seek(timeMs: number): Promise<void> {\n this.currentTimeMs = timeMs;\n await this.seekTask.taskComplete;\n\n // Handle localStorage when playbackController delegates seek\n if (this.playbackController) {\n this.saveTimeToLocalStorage(this.currentTime);\n }\n\n await this.frameTask.taskComplete;\n\n // Ensure all visible elements have completed their reactive update cycles AND frame rendering\n // waitForFrameTasks() calls frameTask.run() on children, but this may happen before child\n // elements have processed property changes from requestUpdate(). To ensure frame data is\n // accurate, we wait for updateComplete first, then ensure the frameTask has run with the\n // updated properties. Elements like EFVideo provide waitForFrameReady() for this pattern.\n const temporalElements = deepGetElementsWithFrameTasks(this);\n const visibleElements = temporalElements.filter((element) => {\n const animationState = evaluateTemporalStateForAnimation(element);\n return animationState.isVisible;\n });\n\n await Promise.all(\n visibleElements.map(async (element) => {\n if (\n \"waitForFrameReady\" in element &&\n typeof element.waitForFrameReady === \"function\"\n ) {\n await (element as any).waitForFrameReady();\n } else {\n await element.updateComplete;\n }\n }),\n );\n }\n\n /**\n * Determines if this is a root timegroup (no parent timegroups)\n */\n get isRootTimegroup(): boolean {\n return !this.parentTimegroup;\n }\n\n /**\n * Register a custom frame task callback that will be executed during frame rendering.\n * The callback receives timing information and can be async or sync.\n * Multiple callbacks can be registered and will execute in parallel.\n *\n * @param callback - Function to execute on each frame\n * @returns A cleanup function that removes the callback when called\n */\n addFrameTask(callback: FrameTaskCallback): () => void {\n if (typeof callback !== \"function\") {\n throw new Error(\"Frame task callback must be a function\");\n }\n this.#customFrameTasks.add(callback);\n return () => {\n this.#customFrameTasks.delete(callback);\n };\n }\n\n /**\n * Remove a previously registered custom frame task callback.\n *\n * @param callback - The callback function to remove\n */\n removeFrameTask(callback: FrameTaskCallback): void {\n this.#customFrameTasks.delete(callback);\n }\n\n saveTimeToLocalStorage(time: number) {\n try {\n if (this.id && this.isConnected && !Number.isNaN(time)) {\n localStorage.setItem(this.storageKey, time.toString());\n }\n } catch (error) {\n log(\"Failed to save time to localStorage\", error);\n }\n }\n\n render() {\n return html`<slot @slotchange=${this.#handleSlotChange}></slot> `;\n }\n\n #handleSlotChange = () => {\n // Invalidate caches when slot content changes\n resetTemporalCache();\n flushSequenceDurationCache();\n flushStartTimeMsCache();\n\n // Request update to trigger recalculation of dependent properties\n this.requestUpdate();\n };\n\n loadTimeFromLocalStorage(): number | undefined {\n if (this.id) {\n try {\n const storedValue = localStorage.getItem(this.storageKey);\n if (storedValue === null) {\n return undefined;\n }\n return Number.parseFloat(storedValue);\n } catch (error) {\n log(\"Failed to load time from localStorage\", error);\n }\n }\n return undefined;\n }\n\n connectedCallback() {\n super.connectedCallback();\n\n if (!this.playbackController) {\n this.waitForMediaDurations().then(async () => {\n let didLoadFromStorage = false;\n if (this.id) {\n const maybeLoadedTime = this.loadTimeFromLocalStorage();\n if (maybeLoadedTime !== undefined) {\n this.currentTime = maybeLoadedTime;\n didLoadFromStorage = true;\n }\n }\n if (EF_INTERACTIVE && this.seekTask.status === TaskStatus.INITIAL) {\n this.seekTask.run();\n } else if (didLoadFromStorage) {\n await this.seekTask.run();\n }\n });\n }\n\n if (this.parentTimegroup) {\n new TimegroupController(this.parentTimegroup, this);\n }\n\n if (this.shouldWrapWithWorkbench()) {\n this.wrapWithWorkbench();\n }\n }\n\n #previousDurationMs = 0;\n\n protected updated(changedProperties: PropertyValues): void {\n super.updated(changedProperties);\n\n if (changedProperties.has(\"mode\") || changedProperties.has(\"overlapMs\")) {\n sequenceDurationCache.delete(this);\n }\n\n if (this.#previousDurationMs !== this.durationMs) {\n this.#previousDurationMs = this.durationMs;\n this.runThrottledFrameTask();\n }\n }\n\n disconnectedCallback() {\n super.disconnectedCallback();\n this.#resizeObserver?.disconnect();\n }\n\n get storageKey() {\n if (!this.id) {\n throw new Error(\"Timegroup must have an id to use localStorage.\");\n }\n return `ef-timegroup-${this.id}`;\n }\n\n get intrinsicDurationMs() {\n if (this.hasExplicitDuration) {\n return this.explicitDurationMs;\n }\n return undefined;\n }\n\n get hasOwnDuration() {\n return (\n this.mode === \"contain\" ||\n this.mode === \"sequence\" ||\n (this.mode === \"fixed\" && this.hasExplicitDuration)\n );\n }\n\n get durationMs(): number {\n switch (this.mode) {\n case \"fit\": {\n if (!this.parentTimegroup) {\n return 0;\n }\n return this.parentTimegroup.durationMs;\n }\n case \"fixed\":\n return super.durationMs;\n case \"sequence\": {\n // Check cache first to avoid expensive O(n) recalculation\n const cachedDuration = sequenceDurationCache.get(this);\n if (cachedDuration !== undefined) {\n return cachedDuration;\n }\n\n let duration = 0;\n this.childTemporals.forEach((child, index) => {\n if (child instanceof EFTimegroup && child.mode === \"fit\") {\n return;\n }\n if (index > 0) {\n duration -= this.overlapMs;\n }\n duration += child.durationMs;\n });\n\n // Cache the calculated duration\n sequenceDurationCache.set(this, duration);\n return duration;\n }\n case \"contain\": {\n let maxDuration = 0;\n for (const child of this.childTemporals) {\n // fit timegroups look \"up\" to their parent timegroup for their duration\n // so we need to skip them to avoid an infinite loop\n if (child instanceof EFTimegroup && child.mode === \"fit\") {\n continue;\n }\n if (!child.hasOwnDuration) {\n continue;\n }\n maxDuration = Math.max(maxDuration, child.durationMs);\n }\n return maxDuration;\n }\n default:\n throw new Error(`Invalid time mode: ${this.mode}`);\n }\n }\n\n async getPendingFrameTasks(signal?: AbortSignal) {\n await this.waitForNestedUpdates(signal);\n signal?.throwIfAborted();\n const temporals = deepGetElementsWithFrameTasks(this);\n\n // Filter to only include temporally visible elements for frame processing\n // (but keep all elements for duration calculations)\n // Use the target timeline time if we're in the middle of seeking\n const timelineTimeMs =\n (this.#pendingSeekTime ?? this.#currentTime ?? 0) * 1000;\n const activeTemporals = temporals.filter((temporal) => {\n // Skip timeline filtering if temporal doesn't have timeline position info\n if (!(\"startTimeMs\" in temporal) || !(\"endTimeMs\" in temporal)) {\n return true; // Keep non-temporal elements\n }\n\n // Only process frame tasks for elements that overlap the current timeline\n // Use same epsilon logic as seek task for consistency\n const epsilon = 0.001; // 1µs offset to break ties at boundaries\n const startTimeMs = (temporal as any).startTimeMs as number;\n const endTimeMs = (temporal as any).endTimeMs as number;\n const elementStartsBeforeEnd = startTimeMs <= timelineTimeMs + epsilon;\n // Root timegroups should remain visible at exact end time, but other elements use exclusive end for clean transitions\n const isRootTimegroup =\n temporal.tagName.toLowerCase() === \"ef-timegroup\" &&\n !(temporal as any).parentTimegroup;\n const useInclusiveEnd = isRootTimegroup;\n const elementEndsAfterStart = useInclusiveEnd\n ? endTimeMs >= timelineTimeMs\n : endTimeMs > timelineTimeMs;\n return elementStartsBeforeEnd && elementEndsAfterStart;\n });\n\n const frameTasks = activeTemporals.map((temporal) => temporal.frameTask);\n frameTasks.forEach((task) => {\n task.run();\n });\n\n return frameTasks.filter((task) => task.status < TaskStatus.COMPLETE);\n }\n\n async waitForNestedUpdates(signal?: AbortSignal) {\n const limit = 10;\n let steps = 0;\n let isComplete = true;\n while (true) {\n steps++;\n if (steps > limit) {\n throw new Error(\"Reached update depth limit.\");\n }\n isComplete = await this.updateComplete;\n signal?.throwIfAborted();\n if (isComplete) {\n break;\n }\n }\n }\n\n async waitForFrameTasks() {\n const result = await withSpan(\n \"timegroup.waitForFrameTasks\",\n {\n timegroupId: this.id || \"unknown\",\n mode: this.mode,\n },\n undefined,\n async (span) => {\n const innerStart = performance.now();\n\n const temporalElements = deepGetElementsWithFrameTasks(this);\n if (isTracingEnabled()) {\n span.setAttribute(\"temporalElementsCount\", temporalElements.length);\n }\n\n // Filter to only include temporally visible elements for frame processing\n // Use animation-friendly visibility to prevent animation jumps at exact boundaries\n const visibleElements = temporalElements.filter((element) => {\n const animationState = evaluateTemporalStateForAnimation(element);\n return animationState.isVisible;\n });\n if (isTracingEnabled()) {\n span.setAttribute(\"visibleElementsCount\", visibleElements.length);\n }\n\n const promiseStart = performance.now();\n\n await Promise.all(\n visibleElements.map((element) => element.frameTask.run()),\n );\n const promiseEnd = performance.now();\n\n const innerEnd = performance.now();\n if (isTracingEnabled()) {\n span.setAttribute(\"actualInnerMs\", innerEnd - innerStart);\n span.setAttribute(\"promiseAwaitMs\", promiseEnd - promiseStart);\n }\n },\n );\n\n return result;\n }\n\n mediaDurationsPromise: Promise<void> | undefined = undefined;\n\n async waitForMediaDurations() {\n if (!this.mediaDurationsPromise) {\n this.mediaDurationsPromise = this.#waitForMediaDurations();\n }\n return this.mediaDurationsPromise;\n }\n\n /**\n * Wait for all media elements to load their initial segments.\n * Ideally we would only need the extracted index json data, but\n * that caused issues with constructing audio data. We had negative durations\n * in calculations and it was not clear why.\n */\n async #waitForMediaDurations() {\n return withSpan(\n \"timegroup.waitForMediaDurations\",\n {\n timegroupId: this.id || \"unknown\",\n mode: this.mode,\n },\n undefined,\n async (span) => {\n // We must await updateComplete to ensure all media elements inside this are connected\n // and will match deepGetMediaElements\n await this.updateComplete;\n const mediaElements = deepGetMediaElements(this);\n if (isTracingEnabled()) {\n span.setAttribute(\"mediaElementsCount\", mediaElements.length);\n }\n\n // Then, we must await the fragmentIndexTask to ensure all media elements have their\n // fragment index loaded, which is where their duration is parsed from.\n await Promise.all(\n mediaElements.map((m) =>\n m.mediaEngineTask.value\n ? Promise.resolve()\n : m.mediaEngineTask.run(),\n ),\n );\n\n // After waiting for durations, we must force some updates to cascade and ensure all temporal elements\n // have correct durations and start times. It is not ideal that we have to do this inside here,\n // but it is the best current way to ensure that all temporal elements have correct durations and start times.\n\n // Next, we must flush the startTimeMs cache to ensure all media elements have their\n // startTimeMs parsed fresh, otherwise the startTimeMs is cached per animation frame.\n flushStartTimeMsCache();\n\n // Flush duration cache since child durations may have changed\n flushSequenceDurationCache();\n\n // Request an update to the currentTime of this group, ensuring that time updates will cascade\n // down to children, forcing sequence groups to arrange correctly.\n // This also makes the filmstrip update correctly.\n this.requestUpdate(\"currentTime\");\n // Finally, we must await updateComplete to ensure all temporal elements have their\n // currentTime updated and all animations have run.\n\n await this.updateComplete;\n },\n );\n }\n\n get childTemporals() {\n return shallowGetTemporalElements(this);\n }\n\n get contextProvider() {\n let parent = this.parentNode;\n while (parent) {\n if (isContextMixin(parent)) {\n return parent;\n }\n parent = parent.parentNode;\n }\n return null;\n }\n\n /**\n * Returns true if the timegroup should be wrapped with a workbench.\n *\n * A timegroup should be wrapped with a workbench if:\n * - It's being rendered (EF_RENDERING), OR\n * - It's in interactive mode (EF_INTERACTIVE) with the dev workbench flag set\n *\n * If the timegroup is already wrapped in a context provider like ef-preview,\n * it should NOT be wrapped in a workbench.\n */\n shouldWrapWithWorkbench() {\n const isRendering = EF_RENDERING?.() === true;\n\n // During rendering, always wrap with workbench (needed by EF_FRAMEGEN)\n if (isRendering) {\n return (\n this.closest(\"ef-timegroup\") === this &&\n this.closest(\"ef-preview\") === null &&\n this.closest(\"ef-workbench\") === null &&\n this.closest(\"test-context\") === null\n );\n }\n\n // During interactive mode, respect the dev workbench flag\n if (!globalThis.EF_DEV_WORKBENCH) {\n return false;\n }\n\n return (\n EF_INTERACTIVE &&\n this.closest(\"ef-timegroup\") === this &&\n this.closest(\"ef-preview\") === null &&\n this.closest(\"ef-workbench\") === null &&\n this.closest(\"test-context\") === null\n );\n }\n\n wrapWithWorkbench() {\n const workbench = document.createElement(\"ef-workbench\");\n this.parentElement?.append(workbench);\n if (!this.hasAttribute(\"id\")) {\n this.setAttribute(\"id\", \"root-this\");\n }\n this.setAttribute(\"slot\", \"canvas\");\n workbench.append(this as unknown as Element);\n\n const filmstrip = document.createElement(\"ef-filmstrip\");\n filmstrip.setAttribute(\"slot\", \"timeline\");\n filmstrip.setAttribute(\"target\", this.id);\n workbench.append(filmstrip);\n }\n\n get efElements() {\n return Array.from(\n this.querySelectorAll(\n \"ef-audio, ef-video, ef-image, ef-captions, ef-waveform\",\n ),\n );\n }\n\n /**\n * Returns media elements for playback audio rendering\n * For standalone media, returns [this]; for timegroups, returns all descendants\n * Used by PlaybackController for audio-driven playback\n */\n getMediaElements(): EFMedia[] {\n return deepGetMediaElements(this);\n }\n\n /**\n * Render audio buffer for playback\n * Called by PlaybackController during live playback\n * Delegates to shared renderTemporalAudio utility for consistent behavior\n */\n async renderAudio(fromMs: number, toMs: number): Promise<AudioBuffer> {\n return renderTemporalAudio(this, fromMs, toMs);\n }\n\n /**\n * TEMPORARY TEST METHOD: Renders audio and immediately plays it back\n * Usage: timegroup.testPlayAudio(0, 5000) // Play first 5 seconds\n */\n async testPlayAudio(fromMs: number, toMs: number) {\n // Render the audio using the existing renderAudio method\n const renderedBuffer = await this.renderAudio(fromMs, toMs);\n\n // Create a regular AudioContext for playback\n const playbackContext = new AudioContext();\n\n // Create a buffer source and connect it\n const bufferSource = playbackContext.createBufferSource();\n bufferSource.buffer = renderedBuffer;\n bufferSource.connect(playbackContext.destination);\n\n // Start playback immediately\n bufferSource.start(0);\n\n // Return a promise that resolves when playback ends\n return new Promise<void>((resolve) => {\n bufferSource.onended = () => {\n playbackContext.close();\n resolve();\n };\n });\n }\n\n async loadMd5Sums() {\n const efElements = this.efElements;\n const loaderTasks: Promise<any>[] = [];\n for (const el of efElements) {\n const md5SumLoader = (el as any).md5SumLoader;\n if (md5SumLoader instanceof Task) {\n md5SumLoader.run();\n loaderTasks.push(md5SumLoader.taskComplete);\n }\n }\n\n await Promise.all(loaderTasks);\n\n efElements.forEach((el) => {\n if (\"productionSrc\" in el && el.productionSrc instanceof Function) {\n el.setAttribute(\"src\", el.productionSrc());\n }\n });\n }\n\n frameTask = new Task(this, {\n // autoRun: EF_INTERACTIVE,\n autoRun: false,\n args: () => [this.ownCurrentTimeMs, this.currentTimeMs] as const,\n task: async ([ownCurrentTimeMs, currentTimeMs]) => {\n if (this.isRootTimegroup) {\n await withSpan(\n \"timegroup.frameTask\",\n {\n timegroupId: this.id || \"unknown\",\n ownCurrentTimeMs,\n currentTimeMs,\n },\n undefined,\n async () => {\n await this.waitForFrameTasks();\n await this.#executeCustomFrameTasks();\n updateAnimations(this);\n },\n );\n } else {\n // Non-root timegroups execute their custom frame tasks when called\n await this.#executeCustomFrameTasks();\n }\n },\n });\n\n async #executeCustomFrameTasks() {\n if (this.#customFrameTasks.size > 0) {\n const percentComplete =\n this.durationMs > 0 ? this.ownCurrentTimeMs / this.durationMs : 0;\n const frameInfo = {\n ownCurrentTimeMs: this.ownCurrentTimeMs,\n currentTimeMs: this.currentTimeMs,\n durationMs: this.durationMs,\n percentComplete,\n element: this,\n };\n\n await Promise.all(\n Array.from(this.#customFrameTasks).map((callback) =>\n Promise.resolve(callback(frameInfo)),\n ),\n );\n }\n }\n\n seekTask = new Task(this, {\n autoRun: false,\n args: () => [this.#pendingSeekTime ?? this.#currentTime] as const,\n onComplete: () => {},\n task: async ([targetTime]) => {\n if (this.playbackController) {\n await this.playbackController.seekTask.taskComplete;\n return this.currentTime;\n }\n\n if (!this.isRootTimegroup) {\n return;\n }\n return withSpan(\n \"timegroup.seekTask\",\n {\n timegroupId: this.id || \"unknown\",\n targetTime: targetTime ?? 0,\n durationMs: this.durationMs,\n },\n undefined,\n async (span) => {\n await this.waitForMediaDurations();\n const newTime = Math.max(\n 0,\n Math.min(targetTime ?? 0, this.durationMs / 1000),\n );\n if (isTracingEnabled()) {\n span.setAttribute(\"newTime\", newTime);\n }\n // Apply the clamped time back to currentTime\n\n this.#currentTime = newTime;\n this.requestUpdate(\"currentTime\");\n await this.runThrottledFrameTask();\n this.saveTimeToLocalStorage(this.#currentTime);\n this.#seekInProgress = false;\n return newTime;\n },\n );\n },\n });\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"ef-timegroup\": EFTimegroup & Element;\n }\n}\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@editframe/elements",
|
|
3
|
-
"version": "0.26.
|
|
3
|
+
"version": "0.26.3-beta.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"scripts": {
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"license": "UNLICENSED",
|
|
14
14
|
"dependencies": {
|
|
15
15
|
"@bramus/style-observer": "^1.3.0",
|
|
16
|
-
"@editframe/assets": "0.26.
|
|
16
|
+
"@editframe/assets": "0.26.3-beta.0",
|
|
17
17
|
"@lit/context": "^1.1.6",
|
|
18
18
|
"@lit/task": "^1.0.3",
|
|
19
19
|
"@opentelemetry/api": "^1.9.0",
|
|
@@ -866,5 +866,69 @@ describe("Dynamic content updates", () => {
|
|
|
866
866
|
assert.equal(syncExecuted, true);
|
|
867
867
|
assert.equal(asyncExecuted, true);
|
|
868
868
|
}, 1000);
|
|
869
|
+
|
|
870
|
+
test("executes callbacks when currentTime is loaded from localStorage", async () => {
|
|
871
|
+
const timegroupId = "localStorage-frame-task-test";
|
|
872
|
+
const storageKey = `ef-timegroup-${timegroupId}`;
|
|
873
|
+
|
|
874
|
+
localStorage.setItem(storageKey, "2.5");
|
|
875
|
+
|
|
876
|
+
const container = document.createElement("div");
|
|
877
|
+
document.body.appendChild(container);
|
|
878
|
+
|
|
879
|
+
const timegroup = document.createElement("ef-timegroup") as EFTimegroup;
|
|
880
|
+
timegroup.setAttribute("id", timegroupId);
|
|
881
|
+
timegroup.setAttribute("mode", "fixed");
|
|
882
|
+
timegroup.setAttribute("duration", "5s");
|
|
883
|
+
|
|
884
|
+
let callbackExecutionCount = 0;
|
|
885
|
+
const receivedTimes: number[] = [];
|
|
886
|
+
|
|
887
|
+
timegroup.addFrameTask((info) => {
|
|
888
|
+
callbackExecutionCount++;
|
|
889
|
+
receivedTimes.push(info.currentTimeMs);
|
|
890
|
+
});
|
|
891
|
+
|
|
892
|
+
container.appendChild(timegroup);
|
|
893
|
+
|
|
894
|
+
await timegroup.updateComplete;
|
|
895
|
+
await timegroup.waitForMediaDurations();
|
|
896
|
+
|
|
897
|
+
await new Promise((resolve) => {
|
|
898
|
+
const checkComplete = async () => {
|
|
899
|
+
if (
|
|
900
|
+
timegroup.currentTime === 2.5 &&
|
|
901
|
+
receivedTimes[receivedTimes.length - 1] === 2500
|
|
902
|
+
) {
|
|
903
|
+
resolve(undefined);
|
|
904
|
+
} else if (timegroup.currentTime === 2.5) {
|
|
905
|
+
await new Promise((r) => setTimeout(r, 10));
|
|
906
|
+
checkComplete();
|
|
907
|
+
} else {
|
|
908
|
+
setTimeout(checkComplete, 10);
|
|
909
|
+
}
|
|
910
|
+
};
|
|
911
|
+
checkComplete();
|
|
912
|
+
});
|
|
913
|
+
|
|
914
|
+
assert.equal(
|
|
915
|
+
timegroup.currentTime,
|
|
916
|
+
2.5,
|
|
917
|
+
"Timegroup should have loaded time from localStorage",
|
|
918
|
+
);
|
|
919
|
+
assert.isAtLeast(
|
|
920
|
+
callbackExecutionCount,
|
|
921
|
+
1,
|
|
922
|
+
"Frame callback should be executed at least once",
|
|
923
|
+
);
|
|
924
|
+
assert.equal(
|
|
925
|
+
receivedTimes[receivedTimes.length - 1],
|
|
926
|
+
2500,
|
|
927
|
+
`Last callback execution should receive the time loaded from localStorage. Got: ${receivedTimes.join(", ")}`,
|
|
928
|
+
);
|
|
929
|
+
|
|
930
|
+
container.remove();
|
|
931
|
+
localStorage.removeItem(storageKey);
|
|
932
|
+
}, 1000);
|
|
869
933
|
});
|
|
870
934
|
});
|
|
@@ -356,15 +356,19 @@ export class EFTimegroup extends EFTargetable(EFTemporal(TWMixin(LitElement))) {
|
|
|
356
356
|
super.connectedCallback();
|
|
357
357
|
|
|
358
358
|
if (!this.playbackController) {
|
|
359
|
-
this.waitForMediaDurations().then(() => {
|
|
359
|
+
this.waitForMediaDurations().then(async () => {
|
|
360
|
+
let didLoadFromStorage = false;
|
|
360
361
|
if (this.id) {
|
|
361
362
|
const maybeLoadedTime = this.loadTimeFromLocalStorage();
|
|
362
363
|
if (maybeLoadedTime !== undefined) {
|
|
363
364
|
this.currentTime = maybeLoadedTime;
|
|
365
|
+
didLoadFromStorage = true;
|
|
364
366
|
}
|
|
365
367
|
}
|
|
366
368
|
if (EF_INTERACTIVE && this.seekTask.status === TaskStatus.INITIAL) {
|
|
367
369
|
this.seekTask.run();
|
|
370
|
+
} else if (didLoadFromStorage) {
|
|
371
|
+
await this.seekTask.run();
|
|
368
372
|
}
|
|
369
373
|
});
|
|
370
374
|
}
|