@editframe/elements 0.18.23-beta.0 → 0.18.27-beta.0

package/dist/elements/EFMedia/videoTasks/makeScrubVideoSegmentFetchTask.js

@@ -0,0 +1,23 @@
+import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask.js";
+import { Task } from "@lit/task";
+const makeScrubVideoSegmentFetchTask = (host) => {
+	return new Task(host, {
+		args: () => [host.mediaEngineTask.value, host.scrubVideoSegmentIdTask.value],
+		onError: (error) => {
+			console.error("scrubVideoSegmentFetchTask error", error);
+		},
+		onComplete: (_value) => {},
+		task: async (_, { signal }) => {
+			const mediaEngine = await getLatestMediaEngine(host, signal);
+			const segmentId = await host.scrubVideoSegmentIdTask.taskComplete;
+			if (segmentId === void 0) throw new Error("Scrub segment ID is not available for video");
+			const scrubRendition = mediaEngine.getScrubVideoRendition();
+			if (!scrubRendition) throw new Error("No scrub rendition available");
+			return mediaEngine.fetchMediaSegment(segmentId, {
+				...scrubRendition,
+				src: mediaEngine.src
+			}, signal);
+		}
+	});
+};
+export { makeScrubVideoSegmentFetchTask };

package/dist/elements/EFMedia/videoTasks/makeScrubVideoSegmentIdTask.d.ts

@@ -0,0 +1,4 @@
+import { Task } from '@lit/task';
+import { MediaEngine } from '../../../transcoding/types';
+import { EFVideo } from '../../EFVideo';
+export declare const makeScrubVideoSegmentIdTask: (host: EFVideo) => Task<readonly [MediaEngine | undefined, number], number | undefined>;

package/dist/elements/EFMedia/videoTasks/{makeVideoSegmentIdTask.js → makeScrubVideoSegmentIdTask.js}

@@ -1,17 +1,22 @@
 import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask.js";
 import { Task } from "@lit/task";
-const makeVideoSegmentIdTask = (host) => {
+const makeScrubVideoSegmentIdTask = (host) => {
 	return new Task(host, {
 		args: () => [host.mediaEngineTask.value, host.desiredSeekTimeMs],
 		onError: (error) => {
-			console.error("videoSegmentIdTask error", error);
+			console.error("scrubVideoSegmentIdTask error", error);
 		},
 		onComplete: (_value) => {},
 		task: async ([, targetSeekTimeMs], { signal }) => {
 			const mediaEngine = await getLatestMediaEngine(host, signal);
 			signal.throwIfAborted();
-			return mediaEngine.computeSegmentId(targetSeekTimeMs, mediaEngine.getVideoRendition());
+			const scrubRendition = mediaEngine.getScrubVideoRendition();
+			if (!scrubRendition) return void 0;
+			return mediaEngine.computeSegmentId(targetSeekTimeMs, {
+				...scrubRendition,
+				src: mediaEngine.src
+			});
 		}
 	});
 };
-export { makeVideoSegmentIdTask };
+export { makeScrubVideoSegmentIdTask };

package/dist/elements/EFMedia/videoTasks/makeUnifiedVideoSeekTask.d.ts

@@ -0,0 +1,6 @@
+import { Task } from '@lit/task';
+import { VideoSample } from 'mediabunny';
+import { EFVideo } from '../../EFVideo';
+type UnifiedVideoSeekTask = Task<readonly [number], VideoSample | undefined>;
+export declare const makeUnifiedVideoSeekTask: (host: EFVideo) => UnifiedVideoSeekTask;
+export {};

package/dist/elements/EFMedia/videoTasks/makeUnifiedVideoSeekTask.js

@@ -0,0 +1,112 @@
+import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask.js";
+import { ScrubInputCache } from "./ScrubInputCache.js";
+import { Task } from "@lit/task";
+const scrubInputCache = new ScrubInputCache();
+const makeUnifiedVideoSeekTask = (host) => {
+	return new Task(host, {
+		args: () => [host.desiredSeekTimeMs],
+		onError: (error) => {
+			console.error("unifiedVideoSeekTask error", error);
+		},
+		onComplete: (_value) => {},
+		task: async ([desiredSeekTimeMs], { signal }) => {
+			signal.throwIfAborted();
+			const mediaEngine = await getLatestMediaEngine(host, signal);
+			if (!mediaEngine) return void 0;
+			const mainRendition = mediaEngine.videoRendition;
+			if (mainRendition) {
+				const mainSegmentId = mediaEngine.computeSegmentId(desiredSeekTimeMs, mainRendition);
+				if (mainSegmentId !== void 0 && mediaEngine.isSegmentCached(mainSegmentId, mainRendition)) return await getMainVideoSample(host, mediaEngine, desiredSeekTimeMs, signal);
+			}
+			const scrubSample = await tryGetScrubSample(mediaEngine, desiredSeekTimeMs, signal);
+			if (scrubSample || signal.aborted) {
+				if (scrubSample) startMainQualityUpgrade(host, mediaEngine, desiredSeekTimeMs, signal).catch(() => {});
+				return scrubSample;
+			}
+			return await getMainVideoSample(host, mediaEngine, desiredSeekTimeMs, signal);
+		}
+	});
+};
+/**
+* Try to get scrub sample from cache (instant if available)
+*/
+async function tryGetScrubSample(mediaEngine, desiredSeekTimeMs, signal) {
+	try {
+		let scrubRendition;
+		if ("data" in mediaEngine && mediaEngine.data?.videoRenditions) scrubRendition = mediaEngine.data.videoRenditions.find((r) => r.id === "scrub");
+		if (!scrubRendition) return void 0;
+		const scrubRenditionWithSrc = {
+			...scrubRendition,
+			src: mediaEngine.src
+		};
+		const segmentId = mediaEngine.computeSegmentId(desiredSeekTimeMs, scrubRenditionWithSrc);
+		if (segmentId === void 0) return void 0;
+		const isCached = mediaEngine.isSegmentCached(segmentId, scrubRenditionWithSrc);
+		if (!isCached) return void 0;
+		const scrubInput = await scrubInputCache.getOrCreateInput(segmentId, async () => {
+			const [initSegment, mediaSegment] = await Promise.all([mediaEngine.fetchInitSegment(scrubRenditionWithSrc, signal), mediaEngine.fetchMediaSegment(segmentId, scrubRenditionWithSrc)]);
+			if (!initSegment || !mediaSegment || signal.aborted) return void 0;
+			const { BufferedSeekingInput } = await import("../BufferedSeekingInput.js");
+			const { EFMedia } = await import("../../EFMedia.js");
+			return new BufferedSeekingInput(await new Blob([initSegment, mediaSegment]).arrayBuffer(), {
+				videoBufferSize: EFMedia.VIDEO_SAMPLE_BUFFER_SIZE,
+				audioBufferSize: EFMedia.AUDIO_SAMPLE_BUFFER_SIZE,
+				startTimeOffsetMs: scrubRendition.startTimeOffsetMs
+			});
+		});
+		if (!scrubInput) return void 0;
+		const videoTrack = await scrubInput.getFirstVideoTrack();
+		if (!videoTrack) return void 0;
+		const sample = await scrubInput.seek(videoTrack.id, desiredSeekTimeMs);
+		return sample;
+	} catch (_error) {
+		if (signal.aborted) return void 0;
+		return void 0;
+	}
+}
+/**
+* Get main video sample (slower path with fetching)
+*/
+async function getMainVideoSample(_host, mediaEngine, desiredSeekTimeMs, signal) {
+	try {
+		const segmentId = mediaEngine.computeSegmentId(desiredSeekTimeMs, mediaEngine.getVideoRendition());
+		if (segmentId === void 0) return void 0;
+		const [initSegment, mediaSegment] = await Promise.all([mediaEngine.fetchInitSegment(mediaEngine.getVideoRendition(), signal), mediaEngine.fetchMediaSegment(segmentId, mediaEngine.getVideoRendition(), signal)]);
+		if (!initSegment || !mediaSegment) return void 0;
+		signal.throwIfAborted();
+		const { BufferedSeekingInput } = await import("../BufferedSeekingInput.js");
+		const { EFMedia } = await import("../../EFMedia.js");
+		const videoRendition = mediaEngine.videoRendition;
+		const startTimeOffsetMs = videoRendition?.startTimeOffsetMs;
+		const mainInput = new BufferedSeekingInput(await new Blob([initSegment, mediaSegment]).arrayBuffer(), {
+			videoBufferSize: EFMedia.VIDEO_SAMPLE_BUFFER_SIZE,
+			audioBufferSize: EFMedia.AUDIO_SAMPLE_BUFFER_SIZE,
+			startTimeOffsetMs
+		});
+		const videoTrack = await mainInput.getFirstVideoTrack();
+		if (!videoTrack) return void 0;
+		signal.throwIfAborted();
+		const sample = await mainInput.seek(videoTrack.id, desiredSeekTimeMs);
+		return sample;
+	} catch (error) {
+		if (signal.aborted) return void 0;
+		throw error;
+	}
+}
+/**
+* Start background upgrade to main quality (non-blocking)
+*/
+async function startMainQualityUpgrade(host, mediaEngine, targetSeekTimeMs, signal) {
+	await new Promise((resolve) => setTimeout(resolve, 50));
+	if (signal.aborted || host.desiredSeekTimeMs !== targetSeekTimeMs) return;
+	const mainSample = await getMainVideoSample(host, mediaEngine, targetSeekTimeMs, signal);
+	if (mainSample && !signal.aborted && host.desiredSeekTimeMs === targetSeekTimeMs) {
+		const videoFrame = mainSample.toVideoFrame();
+		try {
+			host.displayFrame(videoFrame, targetSeekTimeMs);
+		} finally {
+			videoFrame.close();
+		}
+	}
+}
+export { makeUnifiedVideoSeekTask };

package/dist/elements/EFMedia/videoTasks/makeVideoBufferTask.js

@@ -6,12 +6,12 @@ import { Task } from "@lit/task";
 const makeVideoBufferTask = (host) => {
 	let currentState = {
 		currentSeekTimeMs: 0,
+		requestedSegments: /* @__PURE__ */ new Set(),
 		activeRequests: /* @__PURE__ */ new Set(),
-		cachedSegments: /* @__PURE__ */ new Set(),
 		requestQueue: []
 	};
 	return new Task(host, {
-		autoRun: EF_INTERACTIVE,
+		autoRun: EF_INTERACTIVE && !EF_RENDERING(),
 		args: () => [host.desiredSeekTimeMs],
 		onError: (error) => {
 			console.error("videoBufferTask error", error);
@@ -20,19 +20,25 @@ const makeVideoBufferTask = (host) => {
 			currentState = value;
 		},
 		task: async ([seekTimeMs], { signal }) => {
+			if (EF_RENDERING()) return currentState;
 			const currentConfig = {
 				bufferDurationMs: host.videoBufferDurationMs,
 				maxParallelFetches: host.maxVideoBufferFetches,
-				enableBuffering: host.enableVideoBuffering && !EF_RENDERING
+				enableBuffering: host.enableVideoBuffering
 			};
 			return manageMediaBuffer(seekTimeMs, currentConfig, currentState, host.intrinsicDurationMs || 1e4, signal, {
 				computeSegmentId: async (timeMs, rendition) => {
 					const mediaEngine = await getLatestMediaEngine(host, signal);
 					return mediaEngine.computeSegmentId(timeMs, rendition);
 				},
-				fetchSegment: async (segmentId, rendition) => {
+				prefetchSegment: async (segmentId, rendition) => {
 					const mediaEngine = await getLatestMediaEngine(host, signal);
-					return mediaEngine.fetchMediaSegment(segmentId, rendition);
+					await mediaEngine.fetchMediaSegment(segmentId, rendition);
+				},
+				isSegmentCached: (segmentId, rendition) => {
+					const mediaEngine = host.mediaEngineTask.value;
+					if (!mediaEngine) return false;
+					return mediaEngine.isSegmentCached(segmentId, rendition);
 				},
 				getRendition: async () => {
 					const mediaEngine = await getLatestMediaEngine(host, signal);

package/dist/elements/EFMedia.d.ts

@@ -84,15 +84,5 @@ export declare class EFMedia extends EFMedia_base {
      * Now powered by clean, testable utility functions
      */
     fetchAudioSpanningTime(fromMs: number, toMs: number, signal?: AbortSignal): Promise<AudioSpan>;
-    /**
-     * Check if an audio segment is cached in the unified buffer system
-     * Now uses the same caching approach as video for consistency
-     */
-    getCachedAudioSegment(segmentId: number): boolean;
-    /**
-     * Get cached audio segments from the unified buffer system
-     * Now uses the same caching approach as video for consistency
-     */
-    getCachedAudioSegments(segmentIds: number[]): Set<number>;
 }
 export {};

package/dist/elements/EFMedia.js

@@ -28,7 +28,7 @@ var EFMedia = class extends EFTargetable(EFSourceMixin(EFTemporal(FetchMixin(Lit
 	constructor(..._args) {
 		super(..._args);
 		this.currentTimeMs = 0;
-		this.audioBufferDurationMs = 3e4;
+		this.audioBufferDurationMs = 1e4;
 		this.maxAudioBufferFetches = 2;
 		this.enableAudioBuffering = true;
 		this.mute = false;
@@ -128,22 +128,6 @@ var EFMedia = class extends EFTargetable(EFSourceMixin(EFTemporal(FetchMixin(Lit
 	async fetchAudioSpanningTime(fromMs, toMs, signal = new AbortController().signal) {
 		return fetchAudioSpanningTime(this, fromMs, toMs, signal);
 	}
-	/**
-	* Check if an audio segment is cached in the unified buffer system
-	* Now uses the same caching approach as video for consistency
-	*/
-	getCachedAudioSegment(segmentId) {
-		return this.audioBufferTask.value?.cachedSegments.has(segmentId) ?? false;
-	}
-	/**
-	* Get cached audio segments from the unified buffer system
-	* Now uses the same caching approach as video for consistency
-	*/
-	getCachedAudioSegments(segmentIds) {
-		const bufferState = this.audioBufferTask.value;
-		if (!bufferState) return /* @__PURE__ */ new Set();
-		return new Set(segmentIds.filter((id) => bufferState.cachedSegments.has(id)));
-	}
 };
 _decorate([property({ type: Number })], EFMedia.prototype, "currentTimeMs", void 0);
 _decorate([property({

package/dist/elements/EFVideo.d.ts

@@ -28,12 +28,14 @@ export declare class EFVideo extends EFVideo_base {
      * @domAttribute "enable-video-buffering"
      */
     enableVideoBuffering: boolean;
-    videoSegmentIdTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined, number], number | undefined>;
-    videoInitSegmentFetchTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined], ArrayBuffer>;
-    videoSegmentFetchTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined, number | undefined], ArrayBuffer>;
-    videoInputTask: import('./EFMedia/shared/MediaTaskUtils.ts').InputTask;
-    videoSeekTask: Task<readonly [number, import('./EFMedia/BufferedSeekingInput.ts').BufferedSeekingInput | undefined], import('mediabunny').VideoSample | undefined>;
+    unifiedVideoSeekTask: Task<readonly [number], import('mediabunny').VideoSample | undefined>;
     videoBufferTask: Task<readonly [number], import('./EFMedia/videoTasks/makeVideoBufferTask.ts').VideoBufferState>;
+    scrubVideoBufferTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined], unknown>;
+    scrubVideoInputTask: import('./EFMedia/shared/MediaTaskUtils.ts').InputTask;
+    scrubVideoSeekTask: Task<readonly [number], import('mediabunny').VideoSample | undefined>;
+    scrubVideoSegmentIdTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined, number], number | undefined>;
+    scrubVideoSegmentFetchTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined, number | undefined], ArrayBuffer>;
+    scrubVideoInitSegmentFetchTask: Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined], ArrayBuffer>;
     /**
      * Delayed loading state manager for user feedback
      */
@@ -69,7 +71,7 @@ export declare class EFVideo extends EFVideo_base {
     /**
      * Display a video frame on the canvas
      */
-    private displayFrame;
+    displayFrame(frame: VideoFrame, seekToMs: number): number;
     /**
      * Check if we're in production rendering mode (EF_FRAMEGEN active) vs preview mode
      */
@@ -79,10 +81,10 @@ export declare class EFVideo extends EFVideo_base {
      */
     private isFrameRenderingActive;
     /**
-     * Legacy getter for fragment index task (maps to videoSegmentIdTask)
-     * Still used by EFCaptions
+     * Legacy getter for fragment index task
+     * Still used by EFCaptions - maps to unified video seek task
      */
-    get fragmentIndexTask(): Task<readonly [import('../transcoding/types/index.ts').MediaEngine | undefined, number], number | undefined>;
+    get fragmentIndexTask(): Task<readonly [number], import('mediabunny').VideoSample | undefined>;
     /**
      * Clean up resources when component is disconnected
      */

package/dist/elements/EFVideo.js

@@ -2,12 +2,14 @@ import { EF_INTERACTIVE } from "../EF_INTERACTIVE.js";
 import { EFMedia } from "./EFMedia.js";
 import { TWMixin } from "../gui/TWMixin2.js";
 import { DelayedLoadingState } from "../DelayedLoadingState.js";
+import { makeScrubVideoBufferTask } from "./EFMedia/videoTasks/makeScrubVideoBufferTask.js";
+import { makeScrubVideoInitSegmentFetchTask } from "./EFMedia/videoTasks/makeScrubVideoInitSegmentFetchTask.js";
+import { makeScrubVideoInputTask } from "./EFMedia/videoTasks/makeScrubVideoInputTask.js";
+import { makeScrubVideoSeekTask } from "./EFMedia/videoTasks/makeScrubVideoSeekTask.js";
+import { makeScrubVideoSegmentFetchTask } from "./EFMedia/videoTasks/makeScrubVideoSegmentFetchTask.js";
+import { makeScrubVideoSegmentIdTask } from "./EFMedia/videoTasks/makeScrubVideoSegmentIdTask.js";
+import { makeUnifiedVideoSeekTask } from "./EFMedia/videoTasks/makeUnifiedVideoSeekTask.js";
 import { makeVideoBufferTask } from "./EFMedia/videoTasks/makeVideoBufferTask.js";
-import { makeVideoInitSegmentFetchTask } from "./EFMedia/videoTasks/makeVideoInitSegmentFetchTask.js";
-import { makeVideoInputTask } from "./EFMedia/videoTasks/makeVideoInputTask.js";
-import { makeVideoSeekTask } from "./EFMedia/videoTasks/makeVideoSeekTask.js";
-import { makeVideoSegmentFetchTask } from "./EFMedia/videoTasks/makeVideoSegmentFetchTask.js";
-import { makeVideoSegmentIdTask } from "./EFMedia/videoTasks/makeVideoSegmentIdTask.js";
 import { Task } from "@lit/task";
 import debug from "debug";
 import { css, html } from "lit";
@@ -80,15 +82,17 @@ let EFVideo = class EFVideo$1 extends TWMixin(EFMedia) {
 	constructor() {
 		super();
 		this.canvasRef = createRef();
-		this.videoBufferDurationMs = 6e4;
+		this.videoBufferDurationMs = 1e4;
 		this.maxVideoBufferFetches = 2;
 		this.enableVideoBuffering = true;
-		this.videoSegmentIdTask = makeVideoSegmentIdTask(this);
-		this.videoInitSegmentFetchTask = makeVideoInitSegmentFetchTask(this);
-		this.videoSegmentFetchTask = makeVideoSegmentFetchTask(this);
-		this.videoInputTask = makeVideoInputTask(this);
-		this.videoSeekTask = makeVideoSeekTask(this);
+		this.unifiedVideoSeekTask = makeUnifiedVideoSeekTask(this);
 		this.videoBufferTask = makeVideoBufferTask(this);
+		this.scrubVideoBufferTask = makeScrubVideoBufferTask(this);
+		this.scrubVideoInputTask = makeScrubVideoInputTask(this);
+		this.scrubVideoSeekTask = makeScrubVideoSeekTask(this);
+		this.scrubVideoSegmentIdTask = makeScrubVideoSegmentIdTask(this);
+		this.scrubVideoSegmentFetchTask = makeScrubVideoSegmentFetchTask(this);
+		this.scrubVideoInitSegmentFetchTask = makeScrubVideoInitSegmentFetchTask(this);
 		this.loadingState = {
 			isLoading: false,
 			operation: null,
@@ -102,7 +106,7 @@ let EFVideo = class EFVideo$1 extends TWMixin(EFMedia) {
 			},
 			onComplete: () => {},
 			task: async ([_desiredSeekTimeMs], { signal }) => {
-				await this.videoSeekTask.taskComplete;
+				await this.unifiedVideoSeekTask.taskComplete;
 				await this.paintTask.taskComplete;
 				if (signal.aborted) return;
 			}
@@ -114,16 +118,20 @@ let EFVideo = class EFVideo$1 extends TWMixin(EFMedia) {
 			},
 			onComplete: () => {},
 			task: async ([_seekToMs], { signal }) => {
-				await this.videoSeekTask.taskComplete;
 				const isProductionRendering = this.isInProductionRenderingMode();
-				const sample = this.videoSeekTask.value;
-				if (sample) {
-					const videoFrame = sample.toVideoFrame();
-					try {
-						this.displayFrame(videoFrame, _seekToMs);
-					} finally {
-						videoFrame.close();
+				try {
+					await this.unifiedVideoSeekTask.taskComplete;
+					const videoSample = this.unifiedVideoSeekTask.value;
+					if (videoSample) {
+						const videoFrame = videoSample.toVideoFrame();
+						try {
+							this.displayFrame(videoFrame, _seekToMs);
+						} finally {
+							videoFrame.close();
+						}
 					}
+				} catch (error) {
+					console.warn("Unified video pipeline error:", error);
 				}
 				if (!isProductionRendering) {
 					if (!this.rootTimegroup || this.rootTimegroup.currentTimeMs === 0 && this.desiredSeekTimeMs === 0) return;
@@ -243,11 +251,11 @@ let EFVideo = class EFVideo$1 extends TWMixin(EFMedia) {
 		return currentTime >= renderStartTime;
 	}
 	/**
-	* Legacy getter for fragment index task (maps to videoSegmentIdTask)
-	* Still used by EFCaptions
+	* Legacy getter for fragment index task
+	* Still used by EFCaptions - maps to unified video seek task
 	*/
 	get fragmentIndexTask() {
-		return this.videoSegmentIdTask;
+		return this.unifiedVideoSeekTask;
 	}
 	/**
 	* Clean up resources when component is disconnected

package/dist/gui/EFConfiguration.d.ts

@@ -7,6 +7,7 @@ export declare class EFConfiguration extends LitElement {
     efConfiguration: this;
     apiHost?: string;
     signingURL?: string;
+    mediaEngine?: "cloud" | "local";
     render(): import('lit-html').TemplateResult<1>;
 }
 declare global {

package/dist/gui/EFConfiguration.js

@@ -7,6 +7,7 @@ let EFConfiguration = class EFConfiguration$1 extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this.efConfiguration = this;
+		this.mediaEngine = "cloud";
 	}
 	static {
 		this.styles = [css`
@@ -28,5 +29,9 @@ _decorate([property({
 	type: String,
 	attribute: "signing-url"
 })], EFConfiguration.prototype, "signingURL", void 0);
+_decorate([property({
+	type: String,
+	attribute: "media-engine"
+})], EFConfiguration.prototype, "mediaEngine", void 0);
 EFConfiguration = _decorate([customElement("ef-configuration")], EFConfiguration);
 export { EFConfiguration, efConfigurationContext };

package/dist/gui/EFFilmstrip.d.ts

@@ -1,4 +1,4 @@
-import { LitElement, PropertyValueMap, ReactiveController, TemplateResult, nothing } from 'lit';
+import { LitElement, nothing, PropertyValueMap, ReactiveController, TemplateResult } from 'lit';
 import { EFAudio } from '../elements/EFAudio.js';
 import { EFImage } from '../elements/EFImage.js';
 import { TemporalMixinInterface } from '../elements/EFTemporal.js';

package/dist/index.d.ts

@@ -3,7 +3,7 @@ export { EFImage } from './elements/EFImage.js';
 export type { EFMedia } from './elements/EFMedia.js';
 export { EFAudio } from './elements/EFAudio.js';
 export { EFVideo } from './elements/EFVideo.js';
-export { EFCaptions, EFCaptionsActiveWord, EFCaptionsSegment, EFCaptionsBeforeActiveWord, EFCaptionsAfterActiveWord, } from './elements/EFCaptions.js';
+export { EFCaptions, EFCaptionsActiveWord, EFCaptionsAfterActiveWord, EFCaptionsBeforeActiveWord, EFCaptionsSegment, } from './elements/EFCaptions.js';
 export { EFWaveform } from './elements/EFWaveform.js';
 export { EFConfiguration } from './gui/EFConfiguration.ts';
 export { EFWorkbench } from './gui/EFWorkbench.js';

package/dist/transcoding/types/index.d.ts

@@ -214,6 +214,17 @@ export interface MediaEngine {
      * Get the audio rendition, or throws if no audio rendition is available
      */
     getAudioRendition: () => AudioRendition;
+    /**
+     * Check if a segment is cached for a given rendition
+     */
+    isSegmentCached: (segmentId: number, rendition: AudioRendition | VideoRendition) => boolean;
+    /**
+     * Get scrub video rendition if available, otherwise return undefined
+     * Each engine implements this based on their capabilities:
+     * - JitMediaEngine: looks for "scrub" rendition in manifest
+     * - AssetMediaEngine: returns regular video rendition (no separate scrub)
+     */
+    getScrubVideoRendition(): VideoRendition | undefined;
     /**
      * Calculate audio segments needed for a time range
      * Each media engine implements this based on their segment structure

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@editframe/elements",
-  "version": "0.18.23-beta.0",
+  "version": "0.18.27-beta.0",
   "description": "",
   "exports": {
     ".": {
@@ -27,7 +27,7 @@
   "license": "UNLICENSED",
   "dependencies": {
     "@bramus/style-observer": "^1.3.0",
-    "@editframe/assets": "0.18.23-beta.0",
+    "@editframe/assets": "0.18.27-beta.0",
     "@lit/context": "^1.1.2",
     "@lit/task": "^1.0.1",
     "d3": "^7.9.0",

package/src/elements/EFCaptions.ts

@@ -1,5 +1,5 @@
 import { Task } from "@lit/task";
-import { LitElement, type PropertyValueMap, css, html } from "lit";
+import { css, html, LitElement, type PropertyValueMap } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import type { GetISOBMFFFileTranscriptionResult } from "../../../api/src/index.js";
 import { EF_INTERACTIVE } from "../EF_INTERACTIVE.js";

package/src/elements/EFImage.ts

@@ -1,5 +1,5 @@
 import { Task } from "@lit/task";
-import { LitElement, css, html } from "lit";
+import { css, html, LitElement } from "lit";
 import { customElement, property } from "lit/decorators.js";
 import { createRef, ref } from "lit/directives/ref.js";
 import { EF_INTERACTIVE } from "../EF_INTERACTIVE.js";

package/src/elements/EFMedia/AssetMediaEngine.ts

@@ -5,6 +5,7 @@ import type {
   InitSegmentPaths,
   MediaEngine,
   SegmentTimeRange,
+  VideoRendition,
 } from "../../transcoding/types";
 import type { UrlGenerator } from "../../transcoding/utils/UrlGenerator";
 import type { EFMedia } from "../EFMedia";
@@ -277,4 +278,9 @@ export class AssetMediaEngine extends BaseMediaEngine implements MediaEngine {
 
     return nearestSegmentIndex;
   }
+
+  getScrubVideoRendition(): VideoRendition | undefined {
+    // AssetMediaEngine only has one video rendition - return it for scrub too
+    return this.videoRendition;
+  }
 }

package/src/elements/EFMedia/BaseMediaEngine.ts

@@ -333,4 +333,58 @@ export abstract class BaseMediaEngine {
 
     return segments;
   }
+
+  /**
+   * Check if a segment is cached for a given rendition
+   * This needs to check the URL-based cache since that's where segments are actually stored
+   */
+  isSegmentCached(
+    segmentId: number,
+    rendition: AudioRendition | VideoRendition,
+  ): boolean {
+    try {
+      // Check if this is a JIT engine by looking for urlGenerator property
+      const maybeJitEngine = this as any;
+      if (
+        maybeJitEngine.urlGenerator &&
+        typeof maybeJitEngine.urlGenerator.generateSegmentUrl === "function"
+      ) {
+        // This is a JIT engine - generate the URL and check URL-based cache
+        if (!rendition.id) {
+          return false;
+        }
+
+        const segmentUrl = maybeJitEngine.urlGenerator.generateSegmentUrl(
+          segmentId,
+          rendition.id,
+          maybeJitEngine,
+        );
+        const urlIsCached = mediaCache.has(segmentUrl);
+
+        return urlIsCached;
+      }
+      // For other engine types, fall back to the old segment-based key approach
+      const cacheKey = `${rendition.src}-${rendition.id || "default"}-${segmentId}-${rendition.trackId}`;
+      const isCached = mediaCache.has(cacheKey);
+      return isCached;
+    } catch (error) {
+      console.warn(
+        `🎬 BaseMediaEngine: Error checking if segment ${segmentId} is cached:`,
+        error,
+      );
+      return false;
+    }
+  }
+
+  /**
+   * Get cached segment IDs from a list for a given rendition
+   */
+  getCachedSegments(
+    segmentIds: number[],
+    rendition: AudioRendition | VideoRendition,
+  ): Set<number> {
+    return new Set(
+      segmentIds.filter((id) => this.isSegmentCached(id, rendition)),
+    );
+  }
 }

package/src/elements/EFMedia/JitMediaEngine.ts

@@ -172,4 +172,22 @@ export class JitMediaEngine extends BaseMediaEngine implements MediaEngine {
 
     return segmentIndex + 1; // Convert 0-based to 1-based
   }
+
+  getScrubVideoRendition(): VideoRendition | undefined {
+    if (!this.data.videoRenditions) return undefined;
+
+    const scrubManifestRendition = this.data.videoRenditions.find(
+      (r) => r.id === "scrub",
+    );
+
+    if (!scrubManifestRendition) return this.videoRendition; // Fallback to main
+
+    return {
+      id: scrubManifestRendition.id as any,
+      trackId: undefined,
+      src: this.src,
+      segmentDurationMs: scrubManifestRendition.segmentDurationMs,
+      segmentDurationsMs: scrubManifestRendition.segmentDurationsMs,
+    };
+  }
 }