@remotion/webcodecs 4.0.325 → 4.0.327

package/dist/esm/index.mjs

@@ -365,7 +365,7 @@ var rotateAndResizeVideoFrame = ({
   needsToBeMultipleOfTwo = false,
   resizeOperation
 }) => {
-  const normalized = (rotation % 360 + 360) % 360;
+  const normalized = normalizeVideoRotation(rotation);
   if (normalized === 0 && resizeOperation === null) {
     return frame;
   }
@@ -389,15 +389,17 @@ var rotateAndResizeVideoFrame = ({
   }
   canvas.width = width;
   canvas.height = height;
-  if (normalized === 90) {
+  const frameRotation = frame.rotation ?? 0;
+  const canvasRotationToApply = normalizeVideoRotation(normalized + frameRotation);
+  if (canvasRotationToApply === 90) {
     ctx.translate(width, 0);
-  } else if (normalized === 180) {
+  } else if (canvasRotationToApply === 180) {
     ctx.translate(width, height);
-  } else if (normalized === 270) {
+  } else if (canvasRotationToApply === 270) {
     ctx.translate(0, height);
   }
-  if (normalized !== 0) {
-    ctx.rotate(normalized * (Math.PI / 180));
+  if (canvasRotationToApply !== 0) {
+    ctx.rotate(canvasRotationToApply * (Math.PI / 180));
   }
   if (frame.displayHeight !== height || frame.displayWidth !== width) {
     const dimensionsAfterRotate = calculateNewDimensionsFromRotate({

package/dist/rotate-and-resize-video-frame.js

@@ -7,7 +7,7 @@ const normalizeVideoRotation = (rotation) => {
 };
 exports.normalizeVideoRotation = normalizeVideoRotation;
 const rotateAndResizeVideoFrame = ({ frame, rotation, needsToBeMultipleOfTwo = false, resizeOperation, }) => {
-    const normalized = ((rotation % 360) + 360) % 360;
+    const normalized = (0, exports.normalizeVideoRotation)(rotation);
     // No resize, no rotation
     if (normalized === 0 && resizeOperation === null) {
         return frame;
@@ -35,17 +35,20 @@ const rotateAndResizeVideoFrame = ({ frame, rotation, needsToBeMultipleOfTwo = f
     }
     canvas.width = width;
     canvas.height = height;
-    if (normalized === 90) {
+    // @ts-expect-error
+    const frameRotation = frame.rotation ?? 0;
+    const canvasRotationToApply = (0, exports.normalizeVideoRotation)(normalized + frameRotation);
+    if (canvasRotationToApply === 90) {
         ctx.translate(width, 0);
     }
-    else if (normalized === 180) {
+    else if (canvasRotationToApply === 180) {
         ctx.translate(width, height);
     }
-    else if (normalized === 270) {
+    else if (canvasRotationToApply === 270) {
         ctx.translate(0, height);
     }
-    if (normalized !== 0) {
-        ctx.rotate(normalized * (Math.PI / 180));
+    if (canvasRotationToApply !== 0) {
+        ctx.rotate(canvasRotationToApply * (Math.PI / 180));
     }
     if (frame.displayHeight !== height || frame.displayWidth !== width) {
         const dimensionsAfterRotate = (0, rotation_1.calculateNewDimensionsFromRotate)({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remotion/webcodecs",
-  "version": "4.0.325",
+  "version": "4.0.327",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "module": "dist/esm/index.mjs",
@@ -19,8 +19,8 @@
   "author": "Jonny Burger <jonny@remotion.dev>",
   "license": "Remotion License (See https://remotion.dev/docs/webcodecs#license)",
   "dependencies": {
-    "@remotion/media-parser": "4.0.325",
-    "@remotion/licensing": "4.0.325"
+    "@remotion/media-parser": "4.0.327",
+    "@remotion/licensing": "4.0.327"
   },
   "peerDependencies": {},
   "devDependencies": {
@@ -29,8 +29,8 @@
     "vite": "5.4.19",
     "@playwright/test": "1.51.1",
     "eslint": "9.19.0",
-    "@remotion/example-videos": "4.0.325",
-    "@remotion/eslint-config-internal": "4.0.325"
+    "@remotion/example-videos": "4.0.327",
+    "@remotion/eslint-config-internal": "4.0.327"
   },
   "keywords": [],
   "publishConfig": {