@remotion/studio 4.0.365 → 4.0.366

package/dist/components/Timeline/TimelineVideoInfo.js

@@ -2,12 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TimelineVideoInfo = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const media_parser_1 = require("@remotion/media-parser");
-const webcodecs_1 = require("@remotion/webcodecs");
-const worker_1 = require("@remotion/webcodecs/worker");
 const react_1 = require("react");
 const remotion_1 = require("remotion");
+const extract_frames_1 = require("../../helpers/extract-frames");
 const frame_database_1 = require("../../helpers/frame-database");
+const resize_video_frame_1 = require("../../helpers/resize-video-frame");
 const timeline_layout_1 = require("../../helpers/timeline-layout");
 const HEIGHT = (0, timeline_layout_1.getTimelineLayerHeight)('video') - 2;
 const containerStyle = {
@@ -20,10 +19,11 @@ const containerStyle = {
     fontSize: 10,
     fontFamily: 'Arial, Helvetica',
 };
-const MAX_TIME_DEVIATION = media_parser_1.WEBCODECS_TIMESCALE * 0.05;
+const WEBCODECS_TIMESCALE = 1000000;
+const MAX_TIME_DEVIATION = WEBCODECS_TIMESCALE * 0.05;
 const getDurationOfOneFrame = ({ visualizationWidth, aspectRatio, segmentDuration, }) => {
     const framesFitInWidthUnrounded = visualizationWidth / (HEIGHT * aspectRatio);
-    return (segmentDuration / framesFitInWidthUnrounded) * media_parser_1.WEBCODECS_TIMESCALE;
+    return (segmentDuration / framesFitInWidthUnrounded) * WEBCODECS_TIMESCALE;
 };
 const fixRounding = (value) => {
     if (value % 1 >= 0.49999999) {
@@ -41,7 +41,7 @@ const calculateTimestampSlots = ({ visualizationWidth, fromSeconds, segmentDurat
     });
     const timestampTargets = [];
     for (let i = 0; i < framesFitInWidth + 1; i++) {
-        const target = fromSeconds * media_parser_1.WEBCODECS_TIMESCALE + durationOfOneFrame * (i + 0.5);
+        const target = fromSeconds * WEBCODECS_TIMESCALE + durationOfOneFrame * (i + 0.5);
         const snappedToDuration = (Math.round(fixRounding(target / durationOfOneFrame)) - 1) *
             durationOfOneFrame;
         timestampTargets.push(snappedToDuration);
@@ -68,7 +68,7 @@ const drawSlot = ({ frame, ctx, filledSlots, visualizationWidth, timestamp, segm
         aspectRatio: frame.displayWidth / frame.displayHeight,
         segmentDuration,
     });
-    const relativeTimestamp = timestamp - fromSeconds * media_parser_1.WEBCODECS_TIMESCALE;
+    const relativeTimestamp = timestamp - fromSeconds * WEBCODECS_TIMESCALE;
     const frameIndex = relativeTimestamp / durationOfOneFrame;
     const left = Math.floor((frameIndex * frame.displayWidth) / window.devicePixelRatio); // round to avoid antialiasing
     ctx.drawImage(frame, left, 0, frame.displayWidth / window.devicePixelRatio, frame.displayHeight / window.devicePixelRatio);
@@ -189,9 +189,8 @@ const TimelineVideoInfo = ({ src, visualizationWidth, startFrom, durationInFrame
             }
         }
         (0, frame_database_1.clearOldFrames)();
-        (0, worker_1.extractFramesOnWebWorker)({
-            acknowledgeRemotionLicense: true,
-            timestampsInSeconds: ({ track }) => {
+        (0, extract_frames_1.extractFrames)({
+            timestampsInSeconds: ({ track, }) => {
                 aspectRatio.current = track.width / track.height;
                 frame_database_1.aspectRatioCache.set(src, aspectRatio.current);
                 ensureSlots({
@@ -201,19 +200,14 @@ const TimelineVideoInfo = ({ src, visualizationWidth, startFrom, durationInFrame
                     visualizationWidth,
                     aspectRatio: aspectRatio.current,
                 });
-                return Array.from(filledSlots.keys()).map((timestamp) => timestamp / media_parser_1.WEBCODECS_TIMESCALE);
+                return Array.from(filledSlots.keys()).map((timestamp) => timestamp / WEBCODECS_TIMESCALE);
             },
             src,
             onFrame: (frame) => {
                 const scale = (HEIGHT / frame.displayHeight) * window.devicePixelRatio;
-                const transformed = (0, webcodecs_1.rotateAndResizeVideoFrame)({
+                const transformed = (0, resize_video_frame_1.resizeVideoFrame)({
                     frame,
-                    resizeOperation: {
-                        mode: 'scale',
-                        scale,
-                    },
-                    rotation: 0,
-                    needsToBeMultipleOfTwo: false,
+                    scale,
                 });
                 if (transformed !== frame) {
                     frame.close();
@@ -259,9 +253,6 @@ const TimelineVideoInfo = ({ src, visualizationWidth, startFrom, durationInFrame
             });
         })
             .catch((e) => {
-            if ((0, media_parser_1.hasBeenAborted)(e)) {
-                return;
-            }
             setError(e);
         })
             .finally(() => {