@hyperframes/producer 0.4.22 → 0.5.0-alpha.1

package/dist/index.js

@@ -99130,7 +99130,7 @@ function getAttr(tag, attr) {
   return match2 ? match2[1] ?? null : null;
 }
 function hasAttr(tag, attr) {
-  return new RegExp(`${attr}=["']`).test(tag);
+  return new RegExp(`\\s${attr}(?:\\s|=|>|/)`).test(tag);
 }
 function injectAttr(tag, attr, value) {
   return tag.replace(/>$/, ` ${attr}="${value}">`);
@@ -99241,7 +99241,8 @@ function extractResolvedMedia(html) {
       src: getAttr(tag, "src") ?? void 0,
       start: startStr !== null ? parseFloat(startStr) : 0,
       duration,
-      mediaStart: mediaStartStr ? parseFloat(mediaStartStr) : 0
+      mediaStart: mediaStartStr ? parseFloat(mediaStartStr) : 0,
+      loop: hasAttr(tag, "loop")
     });
   }
   return resolved;
@@ -101437,8 +101438,12 @@ async function initializeSession(session) {
     }
   });
   page.on("pageerror", (err) => {
-    const text = `[Browser:PAGEERROR] ${err instanceof Error ? err.message : String(err)}`;
-    console.error(text);
+    const message = err instanceof Error ? err.message : String(err);
+    const text = `[Browser:PAGEERROR] ${message}`;
+    const isPlayAbort = /^AbortError:/.test(message) && message.includes("play()") && message.includes("pause()");
+    if (!isPlayAbort) {
+      console.error(text);
+    }
     session.browserConsoleBuffer.push(text);
     if (session.browserConsoleBuffer.length > BROWSER_CONSOLE_BUFFER_SIZE) {
       session.browserConsoleBuffer.shift();
@@ -102709,6 +102714,7 @@ async function extractMediaMetadata(filePath) {
           videoCodec: "png",
           hasAudio: false,
           isVFR: false,
+          hasAlpha: false,
           colorSpace: stillImageMeta.colorSpace
         };
       }
@@ -102723,6 +102729,9 @@ async function extractMediaMetadata(filePath) {
     const colorSpaceVal = videoStream.color_space || "";
     const ffprobeColorSpace = colorTransfer || colorPrimaries || colorSpaceVal ? { colorTransfer, colorPrimaries, colorSpace: colorSpaceVal } : null;
     const colorSpace = ffprobeColorSpace ?? stillImageMeta?.colorSpace ?? null;
+    const pixelFormat = videoStream.pix_fmt || "";
+    const alphaMode = videoStream.tags?.alpha_mode || "";
+    const hasAlpha = /(^|[^a-z])yuva|rgba|argb|bgra|gbrap|gray[a-z0-9]*a/i.test(pixelFormat) || alphaMode === "1";
     return {
       durationSeconds: output2?.format.duration ? parseFloat(output2.format.duration) : 0,
       width: videoStream.width || stillImageMeta?.width || 0,
@@ -102731,6 +102740,7 @@ async function extractMediaMetadata(filePath) {
       videoCodec: videoStream.codec_name || "unknown",
       hasAudio: output2?.streams.some((s) => s.codec_type === "audio") ?? false,
       isVFR,
+      hasAlpha,
       colorSpace
     };
   })();
@@ -103031,6 +103041,7 @@ function parseVideoElements(html) {
       start,
       end,
       mediaStart: mediaStartAttr ? parseFloat(mediaStartAttr) : 0,
+      loop: el.hasAttribute("loop"),
       hasAudio: hasAudioAttr === "true"
     });
   }
@@ -103066,10 +103077,11 @@ function parseImageElements(html) {
 }
 async function extractVideoFramesRange(videoPath, videoId, startTime, duration, options, signal, config2, outputDirOverride) {
   const ffmpegProcessTimeout = config2?.ffmpegProcessTimeout ?? DEFAULT_CONFIG.ffmpegProcessTimeout;
-  const { fps, outputDir, quality = 95, format: format3 = "jpg" } = options;
+  const { fps, outputDir, quality = 95 } = options;
   const videoOutputDir = outputDirOverride ?? join9(outputDir, videoId);
   if (!existsSync9(videoOutputDir)) mkdirSync6(videoOutputDir, { recursive: true });
   const metadata = await extractMediaMetadata(videoPath);
+  const format3 = resolveFrameFormat(metadata, options.format);
   const framePattern = `${FRAME_FILENAME_PREFIX}%05d.${format3}`;
   const outputPattern = join9(videoOutputDir, framePattern);
   const isHdr = isHdrColorSpace(metadata.colorSpace);
@@ -103078,6 +103090,9 @@ async function extractVideoFramesRange(videoPath, videoId, startTime, duration,
   if (isHdr && isMacOS) {
     args.push("-hwaccel", "videotoolbox");
   }
+  if (metadata.hasAlpha && metadata.videoCodec === "vp9") {
+    args.push("-c:v", "libvpx-vp9");
+  }
   args.push("-ss", String(startTime), "-i", videoPath, "-t", String(duration));
   const vfFilters = [];
   if (isHdr && isMacOS) {
@@ -103189,6 +103204,10 @@ function resolveSegmentDuration(requested, mediaStart, metadata) {
   const sourceRemaining = metadata.durationSeconds - mediaStart;
   return sourceRemaining > 0 ? sourceRemaining : metadata.durationSeconds;
 }
+function resolveFrameFormat(metadata, requested) {
+  if (requested) return requested;
+  return metadata.hasAlpha ? "png" : "jpg";
+}
 async function convertVfrToCfr(inputPath, outputPath, targetFps, startTime, duration, signal, config2) {
   const timeout2 = config2?.ffmpegProcessTimeout ?? DEFAULT_CONFIG.ffmpegProcessTimeout;
   const args = [
@@ -103381,12 +103400,12 @@ async function extractAllVideoFrames(videos, baseDir, options, signal, config2,
   breakdown.vfrPreflightMs = Date.now() - vfrPreflightStart;
   const phase3Start = Date.now();
   const cacheRootDir = config2?.extractCacheDir;
-  const cacheFormat = options.format ?? "jpg";
   async function tryCachedExtract(video, videoPath, videoDuration, i) {
     if (!cacheRootDir) return null;
     const keyInput = cacheKeyInputs[i];
     const probedMeta = videoMetadata[i];
     if (!keyInput || !probedMeta) return null;
+    const cacheFormat = resolveFrameFormat(probedMeta, options.format);
     const keyDuration = resolveSegmentDuration(
       keyInput.end - keyInput.start,
       keyInput.mediaStart,
@@ -103419,7 +103438,7 @@ async function extractAllVideoFrames(videos, baseDir, options, signal, config2,
       video.id,
       video.mediaStart,
       videoDuration,
-      options,
+      { ...options, format: cacheFormat },
       signal,
       config2,
       lookup.entry.dir
@@ -103449,7 +103468,7 @@ async function extractAllVideoFrames(videos, baseDir, options, signal, config2,
           video.id,
           video.mediaStart,
           videoDuration,
-          options,
+          { ...options, format: resolveFrameFormat(probedMeta, options.format) },
           signal,
           config2
         );
@@ -103482,10 +103501,17 @@ async function extractAllVideoFrames(videos, baseDir, options, signal, config2,
     phaseBreakdown: breakdown
   };
 }
-function getFrameAtTime(extracted, globalTime, videoStart) {
-  const localTime = globalTime - videoStart;
+function getFrameAtTime(extracted, globalTime, videoStart, loop = false, mediaStart = 0) {
+  let localTime = globalTime - videoStart;
   if (localTime < 0) return null;
+  const loopDuration = Math.max(0, extracted.metadata.durationSeconds - mediaStart);
+  if (loop && loopDuration > 0 && localTime >= loopDuration) {
+    localTime %= loopDuration;
+  }
   const frameIndex = Math.floor(localTime * extracted.fps);
+  if (loop && frameIndex >= extracted.totalFrames && extracted.totalFrames > 0) {
+    return extracted.framePaths.get(extracted.totalFrames - 1) || null;
+  }
   if (frameIndex < 0 || frameIndex >= extracted.totalFrames) return null;
   return extracted.framePaths.get(frameIndex) || null;
 }
@@ -103495,8 +103521,8 @@ var FrameLookupTable = class {
   activeVideoIds = /* @__PURE__ */ new Set();
   startCursor = 0;
   lastTime = null;
-  addVideo(extracted, start, end, mediaStart) {
-    this.videos.set(extracted.videoId, { extracted, start, end, mediaStart });
+  addVideo(extracted, start, end, mediaStart, loop = false) {
+    this.videos.set(extracted.videoId, { extracted, start, end, mediaStart, loop });
     this.orderedVideos = Array.from(this.videos.entries()).map(([videoId, video]) => ({ videoId, ...video })).sort((a, b) => a.start - b.start);
     this.resetActiveState();
   }
@@ -103504,7 +103530,7 @@ var FrameLookupTable = class {
     const video = this.videos.get(videoId);
     if (!video) return null;
     if (globalTime < video.start || globalTime >= video.end) return null;
-    return getFrameAtTime(video.extracted, globalTime, video.start);
+    return getFrameAtTime(video.extracted, globalTime, video.start, video.loop, video.mediaStart);
   }
   resetActiveState() {
     this.activeVideoIds.clear();
@@ -103553,8 +103579,19 @@ var FrameLookupTable = class {
     for (const videoId of this.activeVideoIds) {
       const video = this.videos.get(videoId);
       if (!video) continue;
-      const localTime = globalTime - video.start;
+      let localTime = globalTime - video.start;
+      const loopDuration = Math.max(0, video.extracted.metadata.durationSeconds - video.mediaStart);
+      if (video.loop && loopDuration > 0 && localTime >= loopDuration) {
+        localTime %= loopDuration;
+      }
       const frameIndex = Math.floor(localTime * video.extracted.fps);
+      if (video.loop && frameIndex >= video.extracted.totalFrames) {
+        const framePath2 = video.extracted.framePaths.get(video.extracted.totalFrames - 1);
+        if (framePath2) {
+          frames.set(videoId, { framePath: framePath2, frameIndex: video.extracted.totalFrames - 1 });
+        }
+        continue;
+      }
       if (frameIndex < 0 || frameIndex >= video.extracted.totalFrames) continue;
       const framePath = video.extracted.framePaths.get(frameIndex);
       if (!framePath) continue;
@@ -103588,7 +103625,7 @@ function createFrameLookupTable(videos, extracted) {
   for (const ext of extracted) extractedMap.set(ext.videoId, ext);
   for (const video of videos) {
     const ext = extractedMap.get(video.id);
-    if (ext) table.addVideo(ext, video.start, video.end, video.mediaStart);
+    if (ext) table.addVideo(ext, video.start, video.end, video.mediaStart, video.loop);
   }
   return table;
 }
@@ -109135,7 +109172,7 @@ async function compileHtmlFile(html, baseDir, downloadDir) {
   let compiledHtml = resolutions.length > 0 ? injectDurations(staticCompiled, resolutions) : staticCompiled;
   const preResolved = extractResolvedMedia(compiledHtml);
   const clampResults = await Promise.all(
-    preResolved.filter((el) => !!el.src).map(async (el) => {
+    preResolved.filter((el) => !!el.src && !el.loop).map(async (el) => {
       const { duration: maxDuration } = await resolveMediaDuration(
         el.src,
         el.mediaStart,
@@ -109743,6 +109780,7 @@ async function discoverMediaFromBrowser(page) {
       const end = parseFloat(htmlEl.getAttribute("data-end") || "0");
       const duration = parseFloat(htmlEl.getAttribute("data-duration") || "0");
       const mediaStart = parseFloat(htmlEl.getAttribute("data-media-start") || "0");
+      const loop = htmlEl.hasAttribute("loop");
       const hasAudio = htmlEl.getAttribute("data-has-audio") === "true";
       const volume = parseFloat(htmlEl.getAttribute("data-volume") || "1");
       results.push({
@@ -109753,6 +109791,7 @@ async function discoverMediaFromBrowser(page) {
         end,
         duration,
         mediaStart,
+        loop,
         hasAudio,
         volume
       });
@@ -110627,6 +110666,9 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
                 if (el.hasAudio && !existing.hasAudio) {
                   existing.hasAudio = true;
                 }
+                if (el.loop && !existing.loop) {
+                  existing.loop = true;
+                }
               }
             } else {
               composition.videos.push({
@@ -110635,6 +110677,7 @@ async function executeRenderJob(job, projectDir, outputPath, onProgress, abortSi
                 start: el.start,
                 end: el.end,
                 mediaStart: el.mediaStart,
+                loop: el.loop,
                 hasAudio: el.hasAudio
               });
               existingVideoIds.add(el.id);