@remotion/effects 4.0.540 → 4.0.542

package/dist/esm/preview/index-r0v18b2n.mjs

@@ -0,0 +1,425 @@
+import {
+  publicUvToShaderUv
+} from "./index-gnsce796.mjs";
+import {
+  WEBGPU_SINGLE_PASS_VERTEX,
+  setupWebGpuSinglePass,
+  cleanupWebGpuSinglePass,
+  applyWebGpuSinglePass
+} from "./index-tvfexb7s.mjs";
+import {
+  assertEffectParamsObject
+} from "./index-4fvp93ps.mjs";
+
+// src/corner-pin/index.ts
+import { Internals as Internals2 } from "remotion";
+
+// src/corner-pin/corner-pin-runtime.ts
+import { Internals } from "remotion";
+
+// src/corner-pin/corner-pin-shaders.ts
+var CORNER_PIN_VS = `#version 300 es
+layout(location = 0) in vec2 aPos;
+layout(location = 1) in vec2 aUv;
+out vec2 vUv;
+
+void main() {
+	vUv = aUv;
+	gl_Position = vec4(aPos, 0.0, 1.0);
+}
+`;
+var CORNER_PIN_FS = `#version 300 es
+precision highp float;
+
+in vec2 vUv;
+out vec4 fragColor;
+
+uniform sampler2D uSource;
+uniform vec2 uTopLeft;
+uniform vec2 uTopRight;
+uniform vec2 uBottomRight;
+uniform vec2 uBottomLeft;
+
+bool solveProjectiveInverse(vec2 p, out vec2 uv) {
+	vec2 p0 = uBottomLeft;
+	vec2 p1 = uBottomRight;
+	vec2 p2 = uTopRight;
+	vec2 p3 = uTopLeft;
+
+	vec2 dx1 = p1 - p2;
+	vec2 dx2 = p3 - p2;
+	vec2 dx3 = p0 - p1 + p2 - p3;
+
+	float g = 0.0;
+	float h = 0.0;
+
+	if (abs(dx3.x) > 0.000001 || abs(dx3.y) > 0.000001) {
+		float denominator = dx1.x * dx2.y - dx2.x * dx1.y;
+		if (abs(denominator) < 0.000001) {
+			return false;
+		}
+
+		g = (dx3.x * dx2.y - dx2.x * dx3.y) / denominator;
+		h = (dx1.x * dx3.y - dx3.x * dx1.y) / denominator;
+	}
+
+	float a = p1.x - p0.x + g * p1.x;
+	float b = p3.x - p0.x + h * p3.x;
+	float c = p0.x;
+	float d = p1.y - p0.y + g * p1.y;
+	float e = p3.y - p0.y + h * p3.y;
+	float f = p0.y;
+
+	float inverseX =
+		(e - f * h) * p.x +
+		(c * h - b) * p.y +
+		(b * f - c * e);
+	float inverseY =
+		(f * g - d) * p.x +
+		(a - c * g) * p.y +
+		(c * d - a * f);
+	float inverseW =
+		(d * h - e * g) * p.x +
+		(b * g - a * h) * p.y +
+		(a * e - b * d);
+
+	if (abs(inverseW) < 0.000001) {
+		return false;
+	}
+
+	uv = vec2(inverseX / inverseW, inverseY / inverseW);
+	return true;
+}
+
+void main() {
+	vec2 sourceUv;
+	if (!solveProjectiveInverse(vUv, sourceUv)) {
+		fragColor = vec4(0.0);
+		return;
+	}
+
+	if (
+		sourceUv.x < 0.0 ||
+		sourceUv.x > 1.0 ||
+		sourceUv.y < 0.0 ||
+		sourceUv.y > 1.0
+	) {
+		fragColor = vec4(0.0);
+		return;
+	}
+
+	fragColor = texture(uSource, sourceUv);
+}
+`;
+
+// src/corner-pin/corner-pin-runtime.ts
+var { createWebGL2ContextError } = Internals;
+var compileShader = (gl, type, source) => {
+  const shader = gl.createShader(type);
+  if (!shader) {
+    throw new Error("Failed to create WebGL shader");
+  }
+  gl.shaderSource(shader, source);
+  gl.compileShader(shader);
+  if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
+    const log = gl.getShaderInfoLog(shader);
+    gl.deleteShader(shader);
+    throw new Error(`Shader compile failed: ${log ?? "(no log)"}`);
+  }
+  return shader;
+};
+var linkProgram = (gl, vs, fs) => {
+  const program = gl.createProgram();
+  if (!program) {
+    throw new Error("Failed to create WebGL program");
+  }
+  gl.attachShader(program, vs);
+  gl.attachShader(program, fs);
+  gl.linkProgram(program);
+  if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
+    const log = gl.getProgramInfoLog(program);
+    gl.deleteProgram(program);
+    throw new Error(`Program link failed: ${log ?? "(no log)"}`);
+  }
+  return program;
+};
+var createProgram = (gl, vertexSource, fragmentSource) => {
+  const vs = compileShader(gl, gl.VERTEX_SHADER, vertexSource);
+  const fs = compileShader(gl, gl.FRAGMENT_SHADER, fragmentSource);
+  const program = linkProgram(gl, vs, fs);
+  gl.deleteShader(vs);
+  gl.deleteShader(fs);
+  return program;
+};
+var createRgbaTexture = (gl) => {
+  const texture = gl.createTexture();
+  if (!texture) {
+    throw new Error("Failed to create WebGL texture");
+  }
+  gl.bindTexture(gl.TEXTURE_2D, texture);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+  gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+  gl.bindTexture(gl.TEXTURE_2D, null);
+  return texture;
+};
+var setupCornerPin = (target) => {
+  const gl = target.getContext("webgl2", {
+    premultipliedAlpha: true,
+    alpha: true,
+    preserveDrawingBuffer: true
+  });
+  if (!gl) {
+    throw createWebGL2ContextError("corner pin effect");
+  }
+  gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
+  const program = createProgram(gl, CORNER_PIN_VS, CORNER_PIN_FS);
+  const vao = gl.createVertexArray();
+  if (!vao) {
+    throw new Error("Failed to create WebGL vertex array");
+  }
+  gl.bindVertexArray(vao);
+  const data = new Float32Array([
+    -1,
+    -1,
+    0,
+    0,
+    1,
+    -1,
+    1,
+    0,
+    -1,
+    1,
+    0,
+    1,
+    1,
+    1,
+    1,
+    1
+  ]);
+  const vbo = gl.createBuffer();
+  if (!vbo) {
+    throw new Error("Failed to create WebGL buffer");
+  }
+  gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
+  gl.bufferData(gl.ARRAY_BUFFER, data, gl.STATIC_DRAW);
+  gl.enableVertexAttribArray(0);
+  gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 16, 0);
+  gl.enableVertexAttribArray(1);
+  gl.vertexAttribPointer(1, 2, gl.FLOAT, false, 16, 8);
+  gl.bindVertexArray(null);
+  const textureSource = createRgbaTexture(gl);
+  return {
+    gl,
+    program,
+    vao,
+    vbo,
+    textureSource,
+    uniforms: {
+      uSource: gl.getUniformLocation(program, "uSource"),
+      uTopLeft: gl.getUniformLocation(program, "uTopLeft"),
+      uTopRight: gl.getUniformLocation(program, "uTopRight"),
+      uBottomRight: gl.getUniformLocation(program, "uBottomRight"),
+      uBottomLeft: gl.getUniformLocation(program, "uBottomLeft")
+    }
+  };
+};
+var cleanupCornerPin = (state) => {
+  const { gl, program, vao, vbo, textureSource } = state;
+  gl.deleteTexture(textureSource);
+  gl.deleteBuffer(vbo);
+  gl.deleteProgram(program);
+  gl.deleteVertexArray(vao);
+};
+var drawFullscreenQuad = (state) => {
+  const { gl, vao } = state;
+  gl.bindVertexArray(vao);
+  gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
+  gl.bindVertexArray(null);
+};
+var setUvUniform = (gl, location, uv) => {
+  if (!location) {
+    return;
+  }
+  const shaderUv = publicUvToShaderUv(uv);
+  gl.uniform2f(location, shaderUv[0], shaderUv[1]);
+};
+var applyCornerPin = ({
+  state,
+  source,
+  width,
+  height,
+  topLeft,
+  topRight,
+  bottomRight,
+  bottomLeft,
+  flipSourceY
+}) => {
+  const { gl, program, textureSource, uniforms } = state;
+  gl.viewport(0, 0, width, height);
+  gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipSourceY);
+  gl.bindTexture(gl.TEXTURE_2D, textureSource);
+  gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
+  gl.bindTexture(gl.TEXTURE_2D, null);
+  gl.bindFramebuffer(gl.FRAMEBUFFER, null);
+  gl.clearColor(0, 0, 0, 0);
+  gl.clear(gl.COLOR_BUFFER_BIT);
+  gl.useProgram(program);
+  if (uniforms.uSource)
+    gl.uniform1i(uniforms.uSource, 0);
+  setUvUniform(gl, uniforms.uTopLeft, topLeft);
+  setUvUniform(gl, uniforms.uTopRight, topRight);
+  setUvUniform(gl, uniforms.uBottomRight, bottomRight);
+  setUvUniform(gl, uniforms.uBottomLeft, bottomLeft);
+  gl.activeTexture(gl.TEXTURE0);
+  gl.bindTexture(gl.TEXTURE_2D, textureSource);
+  drawFullscreenQuad(state);
+  gl.bindTexture(gl.TEXTURE_2D, null);
+  gl.useProgram(null);
+};
+
+// src/corner-pin/webgpu-shader.ts
+var CORNER_PIN_WEBGPU_SHADER = `
+${WEBGPU_SINGLE_PASS_VERTEX}
+@group(0) @binding(0) var source: texture_2d<f32>;
+@group(0) @binding(1) var sourceSampler: sampler;
+@group(0) @binding(2) var<uniform> params: Params;
+struct Params {top: vec4f, bottom: vec4f,}
+@fragment fn fragment(input: VertexOutput) -> @location(0) vec4f {
+ let p0 = params.bottom.zw; let p1 = params.bottom.xy;
+ let p2 = params.top.zw; let p3 = params.top.xy;
+ let dx1 = p1 - p2; let dx2 = p3 - p2; let dx3 = p0 - p1 + p2 - p3;
+ var g = 0.0; var h = 0.0;
+ if (abs(dx3.x) > 0.000001 || abs(dx3.y) > 0.000001) {
+  let denominator = dx1.x * dx2.y - dx2.x * dx1.y;
+  if (abs(denominator) < 0.000001) {return vec4f(0);}
+  g = (dx3.x * dx2.y - dx2.x * dx3.y) / denominator;
+  h = (dx1.x * dx3.y - dx3.x * dx1.y) / denominator;
+ }
+ let a = p1.x - p0.x + g * p1.x; let b = p3.x - p0.x + h * p3.x; let c = p0.x;
+ let d = p1.y - p0.y + g * p1.y; let e = p3.y - p0.y + h * p3.y; let f = p0.y;
+ let p = input.uv;
+ let x = (e-f*h)*p.x + (c*h-b)*p.y + (b*f-c*e);
+ let y = (f*g-d)*p.x + (a-c*g)*p.y + (c*d-a*f);
+ let w = (d*h-e*g)*p.x + (b*g-a*h)*p.y + (a*e-b*d);
+ if (abs(w) < 0.000001) {return vec4f(0);}
+ let uv = vec2f(x/w, 1.0-y/w);
+ if (any(uv < vec2f(0)) || any(uv > vec2f(1))) {return vec4f(0);}
+ return textureSampleLevel(source, sourceSampler, uv, 0);
+}
+`;
+
+// src/corner-pin/index.ts
+var { createEffect } = Internals2;
+var DEFAULT_TOP_LEFT = [0, 0];
+var DEFAULT_TOP_RIGHT = [1, 0];
+var DEFAULT_BOTTOM_RIGHT = [1, 1];
+var DEFAULT_BOTTOM_LEFT = [0, 1];
+var cornerSchema = (defaultValue) => ({
+  type: "uv-coordinate",
+  min: -1,
+  max: 2,
+  step: 0.01,
+  default: defaultValue,
+  description: "Corner"
+});
+var cornerPinSchema = {
+  topLeft: {
+    ...cornerSchema(DEFAULT_TOP_LEFT),
+    description: "Top left"
+  },
+  topRight: {
+    ...cornerSchema(DEFAULT_TOP_RIGHT),
+    description: "Top right"
+  },
+  bottomRight: {
+    ...cornerSchema(DEFAULT_BOTTOM_RIGHT),
+    description: "Bottom right"
+  },
+  bottomLeft: {
+    ...cornerSchema(DEFAULT_BOTTOM_LEFT),
+    description: "Bottom left"
+  }
+};
+var resolve = (p) => ({
+  topLeft: [...p.topLeft ?? DEFAULT_TOP_LEFT],
+  topRight: [...p.topRight ?? DEFAULT_TOP_RIGHT],
+  bottomRight: [
+    ...p.bottomRight ?? DEFAULT_BOTTOM_RIGHT
+  ],
+  bottomLeft: [
+    ...p.bottomLeft ?? DEFAULT_BOTTOM_LEFT
+  ]
+});
+var assertOptionalUvCoordinate = (value, name) => {
+  if (value === undefined) {
+    return;
+  }
+  if (!Array.isArray(value) || value.length !== 2 || value.some((item) => typeof item !== "number" || !Number.isFinite(item))) {
+    throw new TypeError(`"${name}" must be a [number, number] tuple`);
+  }
+};
+var validateCornerPinParams = (params) => {
+  assertEffectParamsObject(params, "Corner pin");
+  assertOptionalUvCoordinate(params.topLeft, "topLeft");
+  assertOptionalUvCoordinate(params.topRight, "topRight");
+  assertOptionalUvCoordinate(params.bottomRight, "bottomRight");
+  assertOptionalUvCoordinate(params.bottomLeft, "bottomLeft");
+};
+var cornerPin2 = createEffect({
+  type: "dev.remotion.effects.cornerPin",
+  label: "cornerPin()",
+  documentationLink: "https://www.remotion.dev/docs/effects/corner-pin",
+  calculateKey: (params) => {
+    const r = resolve(params);
+    return `corner-pin-${r.topLeft.join(":")}-${r.topRight.join(":")}-${r.bottomRight.join(":")}-${r.bottomLeft.join(":")}`;
+  },
+  implementations: {
+    webgpu: Internals2.createEffectImplementation({
+      setup: (target) => setupWebGpuSinglePass(target, "corner-pin"),
+      apply: ({ source, width, height, params, state, gpuDevice }) => {
+        if (!gpuDevice)
+          throw new Error("A WebGPU device is required for this effect");
+        const r = resolve(params);
+        applyWebGpuSinglePass({
+          state,
+          source,
+          width,
+          height,
+          device: gpuDevice,
+          shader: CORNER_PIN_WEBGPU_SHADER,
+          uniformData: new Float32Array([
+            ...r.topLeft,
+            ...r.topRight,
+            ...r.bottomRight,
+            ...r.bottomLeft
+          ])
+        });
+      },
+      cleanup: cleanupWebGpuSinglePass
+    }),
+    webgl2: Internals2.createEffectImplementation({
+      setup: (target) => setupCornerPin(target),
+      apply: ({ source, width, height, params, state, flipSourceY }) => {
+        const r = resolve(params);
+        applyCornerPin({
+          state,
+          source,
+          width,
+          height,
+          topLeft: r.topLeft,
+          topRight: r.topRight,
+          bottomRight: r.bottomRight,
+          bottomLeft: r.bottomLeft,
+          flipSourceY
+        });
+      },
+      cleanup: (state) => cleanupCornerPin(state)
+    })
+  },
+  schema: cornerPinSchema,
+  validateParams: validateCornerPinParams
+});
+
+export { cornerPin2 };