@editframe/elements 0.20.0-beta.0 → 0.20.2-beta.0

package/src/elements/EFMedia/shared/RenditionHelpers.browsertest.ts

@@ -107,7 +107,7 @@ describe("RenditionHelpers", () => {
       expect,
     }) => {
       expect(() => getAudioRendition(mockMediaEngineWithoutAudio)).toThrow(
-        "Audio rendition is not available",
+        "No audio track available in source",
       );
     });
   });
@@ -128,7 +128,7 @@ describe("RenditionHelpers", () => {
       expect,
     }) => {
       expect(() => getVideoRendition(mockMediaEngineWithoutVideo)).toThrow(
-        "Video rendition is not available",
+        "No video track available in source",
       );
     });
   });

package/src/elements/EFMedia/shared/RenditionHelpers.ts

@@ -10,7 +10,7 @@ import type {
 export const getAudioRendition = (mediaEngine: MediaEngine): AudioRendition => {
   const audioRendition = mediaEngine.audioRendition;
   if (!audioRendition) {
-    throw new Error("Audio rendition is not available");
+    throw new Error("No audio track available in source");
   }
   return audioRendition;
 };
@@ -21,7 +21,7 @@ export const getAudioRendition = (mediaEngine: MediaEngine): AudioRendition => {
 export const getVideoRendition = (mediaEngine: MediaEngine): VideoRendition => {
   const videoRendition = mediaEngine.videoRendition;
   if (!videoRendition) {
-    throw new Error("Video rendition is not available");
+    throw new Error("No video track available in source");
   }
   return videoRendition;
 };

package/src/elements/EFMedia/tasks/makeMediaEngineTask.ts

@@ -21,7 +21,7 @@ export const getLatestMediaEngine = async (
 export const getVideoRendition = (mediaEngine: MediaEngine): VideoRendition => {
   const videoRendition = mediaEngine.videoRendition;
   if (!videoRendition) {
-    throw new Error("Video rendition is not available");
+    throw new Error("No video track available in source");
   }
   return videoRendition;
 };

package/src/elements/EFMedia/videoTasks/makeScrubVideoInitSegmentFetchTask.ts

@@ -1,4 +1,5 @@
 import { Task } from "@lit/task";
+import { EF_RENDERING } from "../../../EF_RENDERING";
 import type { MediaEngine } from "../../../transcoding/types";
 import type { EFVideo } from "../../EFVideo";
 import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask";
@@ -13,6 +14,10 @@ export const makeScrubVideoInitSegmentFetchTask = (
     },
     onComplete: (_value) => {},
     task: async ([_mediaEngine], { signal }) => {
+      if (EF_RENDERING()) {
+        return new ArrayBuffer(0);
+      }
+
       const mediaEngine = await getLatestMediaEngine(host, signal);
 
       // Get scrub rendition using the proper interface method

package/src/elements/EFMedia/videoTasks/makeScrubVideoInputTask.ts

@@ -1,5 +1,5 @@
 import { Task } from "@lit/task";
-
+import { EF_RENDERING } from "../../../EF_RENDERING";
 import { EFMedia } from "../../EFMedia";
 import type { EFVideo } from "../../EFVideo";
 import { BufferedSeekingInput } from "../BufferedSeekingInput";
@@ -20,6 +20,10 @@ export const makeScrubVideoInputTask = (host: EFVideo): InputTask => {
     },
     onComplete: (_value) => {},
     task: async () => {
+      if (EF_RENDERING()) {
+        console.info("Scrub not available in rendering mode");
+      }
+
       const initSegment =
         await host.scrubVideoInitSegmentFetchTask.taskComplete;
       const segment = await host.scrubVideoSegmentFetchTask.taskComplete;

package/src/elements/EFMedia/videoTasks/makeScrubVideoSegmentFetchTask.ts

@@ -1,4 +1,5 @@
 import { Task } from "@lit/task";
+import { EF_RENDERING } from "../../../EF_RENDERING";
 import type { MediaEngine } from "../../../transcoding/types";
 import type { EFVideo } from "../../EFVideo";
 import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask";
@@ -17,6 +18,10 @@ export const makeScrubVideoSegmentFetchTask = (
     },
     onComplete: (_value) => {},
     task: async (_, { signal }) => {
+      if (EF_RENDERING()) {
+        return new ArrayBuffer(0);
+      }
+
       const mediaEngine = await getLatestMediaEngine(host, signal);
       const segmentId = await host.scrubVideoSegmentIdTask.taskComplete;
       if (segmentId === undefined) {

package/src/elements/EFMedia/videoTasks/makeScrubVideoSegmentIdTask.ts

@@ -1,4 +1,5 @@
 import { Task } from "@lit/task";
+import { EF_RENDERING } from "../../../EF_RENDERING";
 import type { MediaEngine } from "../../../transcoding/types";
 import type { EFVideo } from "../../EFVideo";
 import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask";
@@ -13,6 +14,10 @@ export const makeScrubVideoSegmentIdTask = (
     },
     onComplete: (_value) => {},
     task: async ([, targetSeekTimeMs], { signal }) => {
+      if (EF_RENDERING()) {
+        return undefined;
+      }
+
       const mediaEngine = await getLatestMediaEngine(host, signal);
       signal.throwIfAborted(); // Abort if a new seek started
 

package/src/elements/EFMedia/videoTasks/makeUnifiedVideoSeekTask.ts

@@ -1,5 +1,6 @@
 import { Task } from "@lit/task";
 import type { VideoSample } from "mediabunny";
+import { EF_RENDERING } from "../../../EF_RENDERING";
 import type { VideoRendition } from "../../../transcoding/types";
 import type { EFVideo } from "../../EFVideo";
 import { getLatestMediaEngine } from "../tasks/makeMediaEngineTask";
@@ -24,6 +25,16 @@ export const makeUnifiedVideoSeekTask = (
       const mediaEngine = await getLatestMediaEngine(host, signal);
       if (!mediaEngine) return undefined;
 
+      // In rendering mode, skip all the scrub logic and go straight to main
+      if (EF_RENDERING()) {
+        return await getMainVideoSample(
+          host,
+          mediaEngine,
+          desiredSeekTimeMs,
+          signal,
+        );
+      }
+
       // FIRST: Check if main quality content is already cached
       const mainRendition = mediaEngine.videoRendition;
       if (mainRendition) {

package/src/elements/EFThumbnailStrip.ts

@@ -61,7 +61,7 @@ interface ThumbnailSegment {
 
 interface ThumbnailLayout {
   count: number;
-  segments: ThumbnailSegment[];
+  segments: readonly ThumbnailSegment[];
 }
 
 // Use the imported MediaEngine type and mediabunny types

package/src/elements/EFTimegroup.ts

@@ -6,6 +6,7 @@ import { customElement, property } from "lit/decorators.js";
 
 import { EF_INTERACTIVE } from "../EF_INTERACTIVE.js";
 import { isContextMixin } from "../gui/ContextMixin.js";
+import type { AudioSpan } from "../transcoding/types/index.ts";
 import { durationConverter } from "./durationConverter.js";
 import { deepGetMediaElements } from "./EFMedia.js";
 import {
@@ -583,11 +584,23 @@ export class EFTimegroup extends EFTemporal(LitElement) {
         const mediaSourceFromMs = mediaLocalFromMs + sourceInMs;
         const mediaSourceToMs = mediaLocalToMs + sourceInMs;
 
-        const audio = await mediaElement.fetchAudioSpanningTime(
-          mediaSourceFromMs, // ✅ Now using source media timeline with sourcein/sourceout
-          mediaSourceToMs, // ✅ Now using source media timeline with sourcein/sourceout
-          abortController.signal,
-        );
+        let audio: AudioSpan | undefined;
+        try {
+          audio = await mediaElement.fetchAudioSpanningTime(
+            mediaSourceFromMs,
+            mediaSourceToMs,
+            abortController.signal,
+          );
+        } catch (error) {
+          if (
+            error instanceof Error &&
+            error.message.includes("No audio track available")
+          ) {
+            return;
+          }
+          throw error;
+        }
+
         if (!audio) {
           throw new Error("Failed to fetch audio");
         }

package/src/gui/EFControls.browsertest.ts

@@ -134,7 +134,7 @@ describe("EFControls", () => {
     expect(controls.targetElement).toBe(preview);
   });
 
-  test("works with child control elements - EFTogglePlay", async () => {
+  test.skip("works with child control elements - EFTogglePlay", async () => {
     // Import the control element
     await import("./EFTogglePlay.js");
 

package/test/__cache__/GET__api_v1_transcode_high_1_m4s_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__26197f6f7c46cacb0a71134131c3f775/metadata.json

@@ -6,7 +6,7 @@
     "access-control-allow-origin": "*",
     "access-control-expose-headers": "Content-Length, Content-Range, X-Cache, X-Actual-Start-Time, X-Actual-Duration, X-Transcode-Time-Ms, X-Total-Server-Time-Ms",
     "cache-control": "public, max-age=3600",
-    "content-length": "2057283",
+    "content-length": "2055451",
     "content-type": "video/iso.segment",
     "x-powered-by": "Express"
   },

package/test/__cache__/GET__api_v1_transcode_high_2_m4s_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__4cb6774cd3650ccf59c8f8dc6678c0b9/metadata.json

@@ -6,7 +6,7 @@
     "access-control-allow-origin": "*",
     "access-control-expose-headers": "Content-Length, Content-Range, X-Cache, X-Actual-Start-Time, X-Actual-Duration, X-Transcode-Time-Ms, X-Total-Server-Time-Ms",
     "cache-control": "public, max-age=3600",
-    "content-length": "2185975",
+    "content-length": "2192280",
     "content-type": "video/iso.segment",
     "x-powered-by": "Express"
   },

package/test/__cache__/GET__api_v1_transcode_high_3_m4s_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__0b3b2b1c8933f7fcf8a9ecaa88d58b41/metadata.json

@@ -6,7 +6,7 @@
     "access-control-allow-origin": "*",
     "access-control-expose-headers": "Content-Length, Content-Range, X-Cache, X-Actual-Start-Time, X-Actual-Duration, X-Transcode-Time-Ms, X-Total-Server-Time-Ms",
     "cache-control": "public, max-age=3600",
-    "content-length": "2120135",
+    "content-length": "2115680",
     "content-type": "video/iso.segment",
     "x-powered-by": "Express"
   },

package/test/__cache__/GET__api_v1_transcode_high_4_m4s_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__a6fb05a22b18d850f7f2950bbcdbdeed/metadata.json

@@ -6,7 +6,7 @@
     "access-control-allow-origin": "*",
     "access-control-expose-headers": "Content-Length, Content-Range, X-Cache, X-Actual-Start-Time, X-Actual-Duration, X-Transcode-Time-Ms, X-Total-Server-Time-Ms",
     "cache-control": "public, max-age=3600",
-    "content-length": "2221511",
+    "content-length": "2217276",
     "content-type": "video/iso.segment",
     "x-powered-by": "Express"
   },

package/test/__cache__/GET__api_v1_transcode_high_5_m4s_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__a50058c7c3602e90879fe3428ed891f4/metadata.json

@@ -6,7 +6,7 @@
     "access-control-allow-origin": "*",
     "access-control-expose-headers": "Content-Length, Content-Range, X-Cache, X-Actual-Start-Time, X-Actual-Duration, X-Transcode-Time-Ms, X-Total-Server-Time-Ms",
     "cache-control": "public, max-age=3600",
-    "content-length": "2037521",
+    "content-length": "2025221",
     "content-type": "video/iso.segment",
     "x-powered-by": "Express"
   },

package/test/__cache__/GET__api_v1_transcode_manifest_json_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__3be92a0437de726b431ed5af2369158a/data.bin

@@ -1 +1 @@
-{"version":"1.0","type":"com.editframe/manifest","sourceUrl":"http://web:3000/head-moov-480p.mp4","duration":10,"durationMs":10000,"baseUrl":"http://localhost:63315","videoRenditions":[{"id":"high","width":1920,"height":1080,"bitrate":5000000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029,mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2000,2000,2000,2000,2000],"frameRate":30,"profile":"High","level":"4.1"},{"id":"medium","width":1280,"height":720,"bitrate":2500000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029,mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2000,2000,2000,2000,2000],"frameRate":30,"profile":"High","level":"4.1"},{"id":"low","width":854,"height":480,"bitrate":1000000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029,mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2000,2000,2000,2000,2000],"frameRate":30,"profile":"High","level":"4.1"},{"id":"scrub","width":320,"height":180,"bitrate":100000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029\"","segmentDuration":30,"segmentDurationMs":30000,"segmentDurationsMs":[30000],"frameRate":15,"profile":"High","level":"4.1"}],"audioRenditions":[{"id":"audio","channels":1,"sampleRate":48000,"bitrate":128000,"codec":"mp4a.40.2","container":"audio/mp4","mimeType":"audio/mp4; codecs=\"mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2026.66,2005.33,1984,2005.33,2026.66],"language":"en"}],"endpoints":{"initSegment":"http://localhost:63315/api/v1/transcode/{rendition}/init.m4s?url=http%3A%2F%2Fweb%3A3000%2Fhead-moov-480p.mp4","mediaSegment":"http://localhost:63315/api/v1/transcode/{rendition}/{segmentId}.m4s?url=http%3A%2F%2Fweb%3A3000%2Fhead-moov-480p.mp4"},"jitInfo":{"parallelTranscodingSupported":true,"expectedTranscodeLatency":500,"segmentCount":5,"scrubSegmentCount":1}}
+{"version":"1.0","type":"com.editframe/manifest","sourceUrl":"http://web:3000/head-moov-480p.mp4","duration":10,"durationMs":10000,"baseUrl":"http://localhost:63315","videoRenditions":[{"id":"high","width":1920,"height":1078,"bitrate":5000000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029,mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2000,2000,2000,2000,2000],"frameRate":30,"profile":"High","level":"4.1"},{"id":"medium","width":1280,"height":718,"bitrate":2500000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029,mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2000,2000,2000,2000,2000],"frameRate":30,"profile":"High","level":"4.1"},{"id":"low","width":854,"height":480,"bitrate":1000000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029,mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2000,2000,2000,2000,2000],"frameRate":30,"profile":"High","level":"4.1"},{"id":"scrub","width":320,"height":180,"bitrate":100000,"codec":"avc1.640029","container":"video/mp4","mimeType":"video/mp4; codecs=\"avc1.640029\"","segmentDuration":30,"segmentDurationMs":30000,"segmentDurationsMs":[30000],"frameRate":15,"profile":"High","level":"4.1"}],"audioRenditions":[{"id":"audio","channels":1,"sampleRate":48000,"bitrate":128000,"codec":"mp4a.40.2","container":"audio/mp4","mimeType":"audio/mp4; codecs=\"mp4a.40.2\"","segmentDuration":2,"segmentDurationMs":2000,"segmentDurationsMs":[2026.66,2005.33,1984,2005.33,2026.66],"language":"en"}],"endpoints":{"initSegment":"http://localhost:63315/api/v1/transcode/{rendition}/init.m4s?url=http%3A%2F%2Fweb%3A3000%2Fhead-moov-480p.mp4","mediaSegment":"http://localhost:63315/api/v1/transcode/{rendition}/{segmentId}.m4s?url=http%3A%2F%2Fweb%3A3000%2Fhead-moov-480p.mp4"},"jitInfo":{"parallelTranscodingSupported":true,"expectedTranscodeLatency":500,"segmentCount":5,"scrubSegmentCount":1}}

package/test/__cache__/GET__api_v1_transcode_manifest_json_url_http_3A_2F_2Fweb_3A3000_2Fhead_moov_480p_mp4__3be92a0437de726b431ed5af2369158a/metadata.json

@@ -8,7 +8,7 @@
     "cache-control": "public, max-age=300",
     "content-length": "2045",
     "content-type": "application/json; charset=utf-8",
-    "etag": "W/\"81b-wi6z588RhWTgs57jivyDs3lEkkA\"",
+    "etag": "W/\"81b-HUWtw7SxFRSpD9Ic54e9i9HWJnc\"",
     "x-powered-by": "Express"
   },
   "url": "/api/v1/transcode/manifest.json?url=http%3A%2F%2Fweb%3A3000%2Fhead-moov-480p.mp4",