@remotion/effects 4.0.507 → 4.0.508
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/exposure.mjs +318 -0
- package/dist/esm/levels.mjs +347 -0
- package/dist/esm/shadows-highlights.mjs +337 -0
- package/dist/esm/vibrance.mjs +314 -0
- package/dist/esm/white-balance.mjs +333 -0
- package/dist/exposure.d.ts +7 -0
- package/dist/levels.d.ts +11 -0
- package/dist/shadows-highlights.d.ts +9 -0
- package/dist/vibrance.d.ts +7 -0
- package/dist/white-balance.d.ts +9 -0
- package/package.json +43 -3
|
@@ -0,0 +1,337 @@
|
|
|
1
|
+
// src/shadows-highlights.ts
|
|
2
|
+
import { Internals } from "remotion";
|
|
3
|
+
|
|
4
|
+
// src/validate-effect-param.ts
|
|
5
|
+
var assertEffectParamsObject = (params, effectLabel) => {
|
|
6
|
+
if (params === null || typeof params !== "object") {
|
|
7
|
+
throw new TypeError(`${effectLabel} effect requires a parameters object, but got ${JSON.stringify(params)}`);
|
|
8
|
+
}
|
|
9
|
+
};
|
|
10
|
+
var assertRequiredFiniteNumber = (value, name) => {
|
|
11
|
+
if (typeof value !== "number" || !Number.isFinite(value)) {
|
|
12
|
+
throw new TypeError(`"${name}" must be a finite number, but got ${JSON.stringify(value)}`);
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
var assertRequiredColor = (value, name) => {
|
|
16
|
+
if (typeof value !== "string" || value.length === 0) {
|
|
17
|
+
throw new TypeError(`"${name}" must be a non-empty string, but got ${JSON.stringify(value)}`);
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
var assertOptionalColor = (value, name) => {
|
|
21
|
+
if (value === undefined) {
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
assertRequiredColor(value, name);
|
|
25
|
+
};
|
|
26
|
+
var assertOptionalBoolean = (value, name) => {
|
|
27
|
+
if (value === undefined) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
if (typeof value !== "boolean") {
|
|
31
|
+
throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
// src/color-utils.ts
|
|
36
|
+
var DEFAULT_AMOUNT = 1;
|
|
37
|
+
var DEFAULT_BRIGHTNESS_AMOUNT = 0;
|
|
38
|
+
var DEFAULT_HUE_DEGREES = 0;
|
|
39
|
+
var colorAmountSchema = {
|
|
40
|
+
type: "number",
|
|
41
|
+
min: 0,
|
|
42
|
+
max: 1,
|
|
43
|
+
step: 0.01,
|
|
44
|
+
default: DEFAULT_AMOUNT,
|
|
45
|
+
description: "Amount",
|
|
46
|
+
hiddenFromList: false
|
|
47
|
+
};
|
|
48
|
+
var colorMultiplierSchema = {
|
|
49
|
+
type: "number",
|
|
50
|
+
min: 0,
|
|
51
|
+
step: 0.01,
|
|
52
|
+
default: DEFAULT_AMOUNT,
|
|
53
|
+
description: "Amount",
|
|
54
|
+
hiddenFromList: false
|
|
55
|
+
};
|
|
56
|
+
var brightnessAmountSchema = {
|
|
57
|
+
type: "number",
|
|
58
|
+
min: -1,
|
|
59
|
+
max: 1,
|
|
60
|
+
step: 0.01,
|
|
61
|
+
default: DEFAULT_BRIGHTNESS_AMOUNT,
|
|
62
|
+
description: "Amount",
|
|
63
|
+
hiddenFromList: false
|
|
64
|
+
};
|
|
65
|
+
var hueDegreesSchema = {
|
|
66
|
+
type: "rotation-degrees",
|
|
67
|
+
step: 1,
|
|
68
|
+
default: DEFAULT_HUE_DEGREES,
|
|
69
|
+
description: "Degrees"
|
|
70
|
+
};
|
|
71
|
+
var assertOptionalFiniteNumber = (value, name) => {
|
|
72
|
+
if (value === undefined) {
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
assertRequiredFiniteNumber(value, name);
|
|
76
|
+
};
|
|
77
|
+
var validateUnitInterval = (value, name) => {
|
|
78
|
+
if (value < 0) {
|
|
79
|
+
throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
|
|
80
|
+
}
|
|
81
|
+
if (value > 1) {
|
|
82
|
+
throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
var validateNonNegative = (value, name) => {
|
|
86
|
+
if (value < 0) {
|
|
87
|
+
throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
var validateSignedUnitInterval = (value, name) => {
|
|
91
|
+
if (value < -1) {
|
|
92
|
+
throw new TypeError(`"${name}" must be >= -1, but got ${JSON.stringify(value)}`);
|
|
93
|
+
}
|
|
94
|
+
if (value > 1) {
|
|
95
|
+
throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
|
|
96
|
+
}
|
|
97
|
+
};
|
|
98
|
+
var clampColorChannel = (value) => {
|
|
99
|
+
return Math.max(0, Math.min(255, value));
|
|
100
|
+
};
|
|
101
|
+
var parseColorRgba = (ctx, color) => {
|
|
102
|
+
ctx.clearRect(0, 0, 1, 1);
|
|
103
|
+
ctx.fillStyle = color;
|
|
104
|
+
ctx.fillRect(0, 0, 1, 1);
|
|
105
|
+
const { data } = ctx.getImageData(0, 0, 1, 1);
|
|
106
|
+
return [data[0], data[1], data[2], data[3]];
|
|
107
|
+
};
|
|
108
|
+
|
|
109
|
+
// src/shadows-highlights.ts
|
|
110
|
+
var { createEffect, createWebGL2ContextError } = Internals;
|
|
111
|
+
var DEFAULT_SHADOWS = 0;
|
|
112
|
+
var DEFAULT_HIGHLIGHTS = 0;
|
|
113
|
+
var shadowsHighlightsSchema = {
|
|
114
|
+
shadows: {
|
|
115
|
+
type: "number",
|
|
116
|
+
min: -1,
|
|
117
|
+
max: 1,
|
|
118
|
+
step: 0.01,
|
|
119
|
+
default: DEFAULT_SHADOWS,
|
|
120
|
+
description: "Shadows",
|
|
121
|
+
hiddenFromList: false
|
|
122
|
+
},
|
|
123
|
+
highlights: {
|
|
124
|
+
type: "number",
|
|
125
|
+
min: -1,
|
|
126
|
+
max: 1,
|
|
127
|
+
step: 0.01,
|
|
128
|
+
default: DEFAULT_HIGHLIGHTS,
|
|
129
|
+
description: "Highlights",
|
|
130
|
+
hiddenFromList: false
|
|
131
|
+
}
|
|
132
|
+
};
|
|
133
|
+
var resolve = (params) => ({
|
|
134
|
+
shadows: params.shadows ?? DEFAULT_SHADOWS,
|
|
135
|
+
highlights: params.highlights ?? DEFAULT_HIGHLIGHTS
|
|
136
|
+
});
|
|
137
|
+
var validateShadowsHighlightsParams = (params) => {
|
|
138
|
+
assertEffectParamsObject(params, "Shadows and highlights");
|
|
139
|
+
assertOptionalFiniteNumber(params.shadows, "shadows");
|
|
140
|
+
assertOptionalFiniteNumber(params.highlights, "highlights");
|
|
141
|
+
const { shadows, highlights } = resolve(params);
|
|
142
|
+
validateSignedUnitInterval(shadows, "shadows");
|
|
143
|
+
validateSignedUnitInterval(highlights, "highlights");
|
|
144
|
+
};
|
|
145
|
+
var VERTEX_SHADER = `#version 300 es
|
|
146
|
+
in vec2 aPos;
|
|
147
|
+
in vec2 aUv;
|
|
148
|
+
out vec2 vUv;
|
|
149
|
+
|
|
150
|
+
void main() {
|
|
151
|
+
vUv = aUv;
|
|
152
|
+
gl_Position = vec4(aPos, 0.0, 1.0);
|
|
153
|
+
}
|
|
154
|
+
`;
|
|
155
|
+
var FRAGMENT_SHADER = `#version 300 es
|
|
156
|
+
precision highp float;
|
|
157
|
+
|
|
158
|
+
in vec2 vUv;
|
|
159
|
+
out vec4 fragColor;
|
|
160
|
+
|
|
161
|
+
uniform sampler2D uSource;
|
|
162
|
+
uniform float uShadows;
|
|
163
|
+
uniform float uHighlights;
|
|
164
|
+
|
|
165
|
+
vec3 srgbToLinear(vec3 color) {
|
|
166
|
+
vec3 lower = color / 12.92;
|
|
167
|
+
vec3 upper = pow((color + 0.055) / 1.055, vec3(2.4));
|
|
168
|
+
return mix(lower, upper, step(vec3(0.04045), color));
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
vec3 linearToSrgb(vec3 color) {
|
|
172
|
+
vec3 nonNegative = max(color, vec3(0.0));
|
|
173
|
+
vec3 lower = nonNegative * 12.92;
|
|
174
|
+
vec3 upper = 1.055 * pow(nonNegative, vec3(1.0 / 2.4)) - 0.055;
|
|
175
|
+
return mix(lower, upper, step(vec3(0.0031308), nonNegative));
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
void main() {
|
|
179
|
+
vec4 sourceColor = texture(uSource, vUv);
|
|
180
|
+
float alpha = sourceColor.a;
|
|
181
|
+
|
|
182
|
+
if (alpha <= 0.0) {
|
|
183
|
+
fragColor = vec4(0.0);
|
|
184
|
+
return;
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
vec3 color = sourceColor.rgb / alpha;
|
|
188
|
+
float luminance = dot(color, vec3(0.2126, 0.7152, 0.0722));
|
|
189
|
+
float shadowWeight = 1.0 - smoothstep(0.0, 0.6, luminance);
|
|
190
|
+
float highlightWeight = smoothstep(0.4, 1.0, luminance);
|
|
191
|
+
shadowWeight *= shadowWeight;
|
|
192
|
+
highlightWeight *= highlightWeight;
|
|
193
|
+
|
|
194
|
+
float stops = uShadows * shadowWeight + uHighlights * highlightWeight;
|
|
195
|
+
vec3 linear = srgbToLinear(color);
|
|
196
|
+
vec3 adjusted = linear * exp2(stops);
|
|
197
|
+
vec3 corrected = linearToSrgb(adjusted);
|
|
198
|
+
|
|
199
|
+
fragColor = vec4(corrected * alpha, alpha);
|
|
200
|
+
}
|
|
201
|
+
`;
|
|
202
|
+
var compileShader = (gl, type, source) => {
|
|
203
|
+
const shader = gl.createShader(type);
|
|
204
|
+
if (!shader) {
|
|
205
|
+
throw new Error("Failed to create shadows and highlights shader");
|
|
206
|
+
}
|
|
207
|
+
gl.shaderSource(shader, source);
|
|
208
|
+
gl.compileShader(shader);
|
|
209
|
+
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
|
|
210
|
+
const log = gl.getShaderInfoLog(shader);
|
|
211
|
+
gl.deleteShader(shader);
|
|
212
|
+
throw new Error(`Shadows and highlights shader compile failed: ${log ?? "(no log)"}`);
|
|
213
|
+
}
|
|
214
|
+
return shader;
|
|
215
|
+
};
|
|
216
|
+
var createProgram = (gl) => {
|
|
217
|
+
const vertexShader = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
|
|
218
|
+
const fragmentShader = compileShader(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
|
|
219
|
+
const program = gl.createProgram();
|
|
220
|
+
if (!program) {
|
|
221
|
+
throw new Error("Failed to create shadows and highlights shader program");
|
|
222
|
+
}
|
|
223
|
+
gl.attachShader(program, vertexShader);
|
|
224
|
+
gl.attachShader(program, fragmentShader);
|
|
225
|
+
gl.linkProgram(program);
|
|
226
|
+
gl.deleteShader(vertexShader);
|
|
227
|
+
gl.deleteShader(fragmentShader);
|
|
228
|
+
if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
|
|
229
|
+
const log = gl.getProgramInfoLog(program);
|
|
230
|
+
gl.deleteProgram(program);
|
|
231
|
+
throw new Error(`Shadows and highlights shader link failed: ${log ?? "(no log)"}`);
|
|
232
|
+
}
|
|
233
|
+
return program;
|
|
234
|
+
};
|
|
235
|
+
var createTexture = (gl) => {
|
|
236
|
+
const texture = gl.createTexture();
|
|
237
|
+
if (!texture) {
|
|
238
|
+
throw new Error("Failed to create shadows and highlights texture");
|
|
239
|
+
}
|
|
240
|
+
gl.bindTexture(gl.TEXTURE_2D, texture);
|
|
241
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
|
|
242
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
|
|
243
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
|
244
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
|
245
|
+
gl.bindTexture(gl.TEXTURE_2D, null);
|
|
246
|
+
return texture;
|
|
247
|
+
};
|
|
248
|
+
var setupShadowsHighlights = (target) => {
|
|
249
|
+
const gl = target.getContext("webgl2", {
|
|
250
|
+
premultipliedAlpha: true,
|
|
251
|
+
alpha: true,
|
|
252
|
+
preserveDrawingBuffer: true
|
|
253
|
+
});
|
|
254
|
+
if (!gl) {
|
|
255
|
+
throw createWebGL2ContextError("shadows and highlights effect");
|
|
256
|
+
}
|
|
257
|
+
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
|
|
258
|
+
const program = createProgram(gl);
|
|
259
|
+
const vao = gl.createVertexArray();
|
|
260
|
+
if (!vao) {
|
|
261
|
+
throw new Error("Failed to create shadows and highlights vertex array");
|
|
262
|
+
}
|
|
263
|
+
const vbo = gl.createBuffer();
|
|
264
|
+
if (!vbo) {
|
|
265
|
+
throw new Error("Failed to create shadows and highlights vertex buffer");
|
|
266
|
+
}
|
|
267
|
+
gl.bindVertexArray(vao);
|
|
268
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
|
|
269
|
+
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1]), gl.STATIC_DRAW);
|
|
270
|
+
const aPos = gl.getAttribLocation(program, "aPos");
|
|
271
|
+
const aUv = gl.getAttribLocation(program, "aUv");
|
|
272
|
+
gl.enableVertexAttribArray(aPos);
|
|
273
|
+
gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
|
|
274
|
+
gl.enableVertexAttribArray(aUv);
|
|
275
|
+
gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);
|
|
276
|
+
gl.bindVertexArray(null);
|
|
277
|
+
return {
|
|
278
|
+
gl,
|
|
279
|
+
program,
|
|
280
|
+
vao,
|
|
281
|
+
vbo,
|
|
282
|
+
textureSource: createTexture(gl),
|
|
283
|
+
uniforms: {
|
|
284
|
+
uSource: gl.getUniformLocation(program, "uSource"),
|
|
285
|
+
uShadows: gl.getUniformLocation(program, "uShadows"),
|
|
286
|
+
uHighlights: gl.getUniformLocation(program, "uHighlights")
|
|
287
|
+
}
|
|
288
|
+
};
|
|
289
|
+
};
|
|
290
|
+
var shadowsHighlights = createEffect({
|
|
291
|
+
type: "remotion/shadows-highlights",
|
|
292
|
+
label: "shadowsHighlights()",
|
|
293
|
+
documentationLink: "https://www.remotion.dev/docs/effects/shadows-highlights",
|
|
294
|
+
backend: "webgl2",
|
|
295
|
+
calculateKey: (params) => {
|
|
296
|
+
const { shadows, highlights } = resolve(params);
|
|
297
|
+
return `shadows-highlights-${shadows}-${highlights}`;
|
|
298
|
+
},
|
|
299
|
+
setup: setupShadowsHighlights,
|
|
300
|
+
apply: ({ source, width, height, params, state, flipSourceY }) => {
|
|
301
|
+
const { shadows, highlights } = resolve(params);
|
|
302
|
+
const { gl, program, textureSource, uniforms, vao } = state;
|
|
303
|
+
gl.viewport(0, 0, width, height);
|
|
304
|
+
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
|
|
305
|
+
gl.clearColor(0, 0, 0, 0);
|
|
306
|
+
gl.clear(gl.COLOR_BUFFER_BIT);
|
|
307
|
+
gl.activeTexture(gl.TEXTURE0);
|
|
308
|
+
gl.bindTexture(gl.TEXTURE_2D, textureSource);
|
|
309
|
+
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipSourceY);
|
|
310
|
+
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
|
|
311
|
+
gl.useProgram(program);
|
|
312
|
+
if (uniforms.uSource)
|
|
313
|
+
gl.uniform1i(uniforms.uSource, 0);
|
|
314
|
+
if (uniforms.uShadows) {
|
|
315
|
+
gl.uniform1f(uniforms.uShadows, shadows);
|
|
316
|
+
}
|
|
317
|
+
if (uniforms.uHighlights) {
|
|
318
|
+
gl.uniform1f(uniforms.uHighlights, highlights);
|
|
319
|
+
}
|
|
320
|
+
gl.bindVertexArray(vao);
|
|
321
|
+
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
|
|
322
|
+
gl.bindVertexArray(null);
|
|
323
|
+
gl.bindTexture(gl.TEXTURE_2D, null);
|
|
324
|
+
gl.useProgram(null);
|
|
325
|
+
},
|
|
326
|
+
cleanup: ({ gl, program, vao, vbo, textureSource }) => {
|
|
327
|
+
gl.deleteTexture(textureSource);
|
|
328
|
+
gl.deleteBuffer(vbo);
|
|
329
|
+
gl.deleteProgram(program);
|
|
330
|
+
gl.deleteVertexArray(vao);
|
|
331
|
+
},
|
|
332
|
+
schema: shadowsHighlightsSchema,
|
|
333
|
+
validateParams: validateShadowsHighlightsParams
|
|
334
|
+
});
|
|
335
|
+
export {
|
|
336
|
+
shadowsHighlights
|
|
337
|
+
};
|
|
@@ -0,0 +1,314 @@
|
|
|
1
|
+
// src/vibrance.ts
|
|
2
|
+
import { Internals } from "remotion";
|
|
3
|
+
|
|
4
|
+
// src/validate-effect-param.ts
|
|
5
|
+
var assertEffectParamsObject = (params, effectLabel) => {
|
|
6
|
+
if (params === null || typeof params !== "object") {
|
|
7
|
+
throw new TypeError(`${effectLabel} effect requires a parameters object, but got ${JSON.stringify(params)}`);
|
|
8
|
+
}
|
|
9
|
+
};
|
|
10
|
+
var assertRequiredFiniteNumber = (value, name) => {
|
|
11
|
+
if (typeof value !== "number" || !Number.isFinite(value)) {
|
|
12
|
+
throw new TypeError(`"${name}" must be a finite number, but got ${JSON.stringify(value)}`);
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
var assertRequiredColor = (value, name) => {
|
|
16
|
+
if (typeof value !== "string" || value.length === 0) {
|
|
17
|
+
throw new TypeError(`"${name}" must be a non-empty string, but got ${JSON.stringify(value)}`);
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
var assertOptionalColor = (value, name) => {
|
|
21
|
+
if (value === undefined) {
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
assertRequiredColor(value, name);
|
|
25
|
+
};
|
|
26
|
+
var assertOptionalBoolean = (value, name) => {
|
|
27
|
+
if (value === undefined) {
|
|
28
|
+
return;
|
|
29
|
+
}
|
|
30
|
+
if (typeof value !== "boolean") {
|
|
31
|
+
throw new TypeError(`"${name}" must be a boolean, but got ${JSON.stringify(value)}`);
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
// src/color-utils.ts
|
|
36
|
+
var DEFAULT_AMOUNT = 1;
|
|
37
|
+
var DEFAULT_BRIGHTNESS_AMOUNT = 0;
|
|
38
|
+
var DEFAULT_HUE_DEGREES = 0;
|
|
39
|
+
var colorAmountSchema = {
|
|
40
|
+
type: "number",
|
|
41
|
+
min: 0,
|
|
42
|
+
max: 1,
|
|
43
|
+
step: 0.01,
|
|
44
|
+
default: DEFAULT_AMOUNT,
|
|
45
|
+
description: "Amount",
|
|
46
|
+
hiddenFromList: false
|
|
47
|
+
};
|
|
48
|
+
var colorMultiplierSchema = {
|
|
49
|
+
type: "number",
|
|
50
|
+
min: 0,
|
|
51
|
+
step: 0.01,
|
|
52
|
+
default: DEFAULT_AMOUNT,
|
|
53
|
+
description: "Amount",
|
|
54
|
+
hiddenFromList: false
|
|
55
|
+
};
|
|
56
|
+
var brightnessAmountSchema = {
|
|
57
|
+
type: "number",
|
|
58
|
+
min: -1,
|
|
59
|
+
max: 1,
|
|
60
|
+
step: 0.01,
|
|
61
|
+
default: DEFAULT_BRIGHTNESS_AMOUNT,
|
|
62
|
+
description: "Amount",
|
|
63
|
+
hiddenFromList: false
|
|
64
|
+
};
|
|
65
|
+
var hueDegreesSchema = {
|
|
66
|
+
type: "rotation-degrees",
|
|
67
|
+
step: 1,
|
|
68
|
+
default: DEFAULT_HUE_DEGREES,
|
|
69
|
+
description: "Degrees"
|
|
70
|
+
};
|
|
71
|
+
var assertOptionalFiniteNumber = (value, name) => {
|
|
72
|
+
if (value === undefined) {
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
assertRequiredFiniteNumber(value, name);
|
|
76
|
+
};
|
|
77
|
+
var validateUnitInterval = (value, name) => {
|
|
78
|
+
if (value < 0) {
|
|
79
|
+
throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
|
|
80
|
+
}
|
|
81
|
+
if (value > 1) {
|
|
82
|
+
throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
var validateNonNegative = (value, name) => {
|
|
86
|
+
if (value < 0) {
|
|
87
|
+
throw new TypeError(`"${name}" must be >= 0, but got ${JSON.stringify(value)}`);
|
|
88
|
+
}
|
|
89
|
+
};
|
|
90
|
+
var validateSignedUnitInterval = (value, name) => {
|
|
91
|
+
if (value < -1) {
|
|
92
|
+
throw new TypeError(`"${name}" must be >= -1, but got ${JSON.stringify(value)}`);
|
|
93
|
+
}
|
|
94
|
+
if (value > 1) {
|
|
95
|
+
throw new TypeError(`"${name}" must be <= 1, but got ${JSON.stringify(value)}`);
|
|
96
|
+
}
|
|
97
|
+
};
|
|
98
|
+
var clampColorChannel = (value) => {
|
|
99
|
+
return Math.max(0, Math.min(255, value));
|
|
100
|
+
};
|
|
101
|
+
var parseColorRgba = (ctx, color) => {
|
|
102
|
+
ctx.clearRect(0, 0, 1, 1);
|
|
103
|
+
ctx.fillStyle = color;
|
|
104
|
+
ctx.fillRect(0, 0, 1, 1);
|
|
105
|
+
const { data } = ctx.getImageData(0, 0, 1, 1);
|
|
106
|
+
return [data[0], data[1], data[2], data[3]];
|
|
107
|
+
};
|
|
108
|
+
|
|
109
|
+
// src/vibrance.ts
|
|
110
|
+
var { createEffect, createWebGL2ContextError } = Internals;
|
|
111
|
+
var DEFAULT_AMOUNT2 = 0;
|
|
112
|
+
var vibranceSchema = {
|
|
113
|
+
amount: {
|
|
114
|
+
type: "number",
|
|
115
|
+
min: -1,
|
|
116
|
+
max: 1,
|
|
117
|
+
step: 0.01,
|
|
118
|
+
default: DEFAULT_AMOUNT2,
|
|
119
|
+
description: "Amount",
|
|
120
|
+
hiddenFromList: false
|
|
121
|
+
}
|
|
122
|
+
};
|
|
123
|
+
var resolve = (params) => ({
|
|
124
|
+
amount: params.amount ?? DEFAULT_AMOUNT2
|
|
125
|
+
});
|
|
126
|
+
var validateVibranceParams = (params) => {
|
|
127
|
+
assertEffectParamsObject(params, "Vibrance");
|
|
128
|
+
assertOptionalFiniteNumber(params.amount, "amount");
|
|
129
|
+
const { amount } = resolve(params);
|
|
130
|
+
validateSignedUnitInterval(amount, "amount");
|
|
131
|
+
};
|
|
132
|
+
var VERTEX_SHADER = `#version 300 es
|
|
133
|
+
in vec2 aPos;
|
|
134
|
+
in vec2 aUv;
|
|
135
|
+
out vec2 vUv;
|
|
136
|
+
|
|
137
|
+
void main() {
|
|
138
|
+
vUv = aUv;
|
|
139
|
+
gl_Position = vec4(aPos, 0.0, 1.0);
|
|
140
|
+
}
|
|
141
|
+
`;
|
|
142
|
+
var FRAGMENT_SHADER = `#version 300 es
|
|
143
|
+
precision highp float;
|
|
144
|
+
|
|
145
|
+
in vec2 vUv;
|
|
146
|
+
out vec4 fragColor;
|
|
147
|
+
|
|
148
|
+
uniform sampler2D uSource;
|
|
149
|
+
uniform float uAmount;
|
|
150
|
+
|
|
151
|
+
void main() {
|
|
152
|
+
vec4 sourceColor = texture(uSource, vUv);
|
|
153
|
+
float alpha = sourceColor.a;
|
|
154
|
+
|
|
155
|
+
if (alpha <= 0.0) {
|
|
156
|
+
fragColor = vec4(0.0);
|
|
157
|
+
return;
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
vec3 color = sourceColor.rgb / alpha;
|
|
161
|
+
float maximum = max(max(color.r, color.g), color.b);
|
|
162
|
+
float minimum = min(min(color.r, color.g), color.b);
|
|
163
|
+
float lightness = (maximum + minimum) * 0.5;
|
|
164
|
+
float chroma = maximum - minimum;
|
|
165
|
+
float saturationDenominator = 1.0 - abs(2.0 * lightness - 1.0);
|
|
166
|
+
float saturation = saturationDenominator <= 0.0
|
|
167
|
+
? 0.0
|
|
168
|
+
: chroma / saturationDenominator;
|
|
169
|
+
|
|
170
|
+
if (saturation <= 0.000001) {
|
|
171
|
+
fragColor = sourceColor;
|
|
172
|
+
return;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
float targetSaturation = uAmount >= 0.0
|
|
176
|
+
? saturation + uAmount * (1.0 - saturation)
|
|
177
|
+
: saturation * (1.0 + uAmount);
|
|
178
|
+
vec3 adjusted = vec3(lightness) +
|
|
179
|
+
(color - vec3(lightness)) * (targetSaturation / saturation);
|
|
180
|
+
|
|
181
|
+
fragColor = vec4(clamp(adjusted, 0.0, 1.0) * alpha, alpha);
|
|
182
|
+
}
|
|
183
|
+
`;
|
|
184
|
+
var compileShader = (gl, type, source) => {
|
|
185
|
+
const shader = gl.createShader(type);
|
|
186
|
+
if (!shader) {
|
|
187
|
+
throw new Error("Failed to create vibrance shader");
|
|
188
|
+
}
|
|
189
|
+
gl.shaderSource(shader, source);
|
|
190
|
+
gl.compileShader(shader);
|
|
191
|
+
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
|
|
192
|
+
const log = gl.getShaderInfoLog(shader);
|
|
193
|
+
gl.deleteShader(shader);
|
|
194
|
+
throw new Error(`Vibrance shader compile failed: ${log ?? "(no log)"}`);
|
|
195
|
+
}
|
|
196
|
+
return shader;
|
|
197
|
+
};
|
|
198
|
+
var createProgram = (gl) => {
|
|
199
|
+
const vertexShader = compileShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER);
|
|
200
|
+
const fragmentShader = compileShader(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER);
|
|
201
|
+
const program = gl.createProgram();
|
|
202
|
+
if (!program) {
|
|
203
|
+
throw new Error("Failed to create vibrance shader program");
|
|
204
|
+
}
|
|
205
|
+
gl.attachShader(program, vertexShader);
|
|
206
|
+
gl.attachShader(program, fragmentShader);
|
|
207
|
+
gl.linkProgram(program);
|
|
208
|
+
gl.deleteShader(vertexShader);
|
|
209
|
+
gl.deleteShader(fragmentShader);
|
|
210
|
+
if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
|
|
211
|
+
const log = gl.getProgramInfoLog(program);
|
|
212
|
+
gl.deleteProgram(program);
|
|
213
|
+
throw new Error(`Vibrance shader link failed: ${log ?? "(no log)"}`);
|
|
214
|
+
}
|
|
215
|
+
return program;
|
|
216
|
+
};
|
|
217
|
+
var createTexture = (gl) => {
|
|
218
|
+
const texture = gl.createTexture();
|
|
219
|
+
if (!texture) {
|
|
220
|
+
throw new Error("Failed to create vibrance texture");
|
|
221
|
+
}
|
|
222
|
+
gl.bindTexture(gl.TEXTURE_2D, texture);
|
|
223
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
|
|
224
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
|
|
225
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
|
226
|
+
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
|
227
|
+
gl.bindTexture(gl.TEXTURE_2D, null);
|
|
228
|
+
return texture;
|
|
229
|
+
};
|
|
230
|
+
var setupVibrance = (target) => {
|
|
231
|
+
const gl = target.getContext("webgl2", {
|
|
232
|
+
premultipliedAlpha: true,
|
|
233
|
+
alpha: true,
|
|
234
|
+
preserveDrawingBuffer: true
|
|
235
|
+
});
|
|
236
|
+
if (!gl) {
|
|
237
|
+
throw createWebGL2ContextError("vibrance effect");
|
|
238
|
+
}
|
|
239
|
+
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, true);
|
|
240
|
+
const program = createProgram(gl);
|
|
241
|
+
const vao = gl.createVertexArray();
|
|
242
|
+
if (!vao) {
|
|
243
|
+
throw new Error("Failed to create vibrance vertex array");
|
|
244
|
+
}
|
|
245
|
+
const vbo = gl.createBuffer();
|
|
246
|
+
if (!vbo) {
|
|
247
|
+
throw new Error("Failed to create vibrance vertex buffer");
|
|
248
|
+
}
|
|
249
|
+
gl.bindVertexArray(vao);
|
|
250
|
+
gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
|
|
251
|
+
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-1, -1, 0, 0, 1, -1, 1, 0, -1, 1, 0, 1, 1, 1, 1, 1]), gl.STATIC_DRAW);
|
|
252
|
+
const aPos = gl.getAttribLocation(program, "aPos");
|
|
253
|
+
const aUv = gl.getAttribLocation(program, "aUv");
|
|
254
|
+
gl.enableVertexAttribArray(aPos);
|
|
255
|
+
gl.vertexAttribPointer(aPos, 2, gl.FLOAT, false, 16, 0);
|
|
256
|
+
gl.enableVertexAttribArray(aUv);
|
|
257
|
+
gl.vertexAttribPointer(aUv, 2, gl.FLOAT, false, 16, 8);
|
|
258
|
+
gl.bindVertexArray(null);
|
|
259
|
+
return {
|
|
260
|
+
gl,
|
|
261
|
+
program,
|
|
262
|
+
vao,
|
|
263
|
+
vbo,
|
|
264
|
+
textureSource: createTexture(gl),
|
|
265
|
+
uniforms: {
|
|
266
|
+
uSource: gl.getUniformLocation(program, "uSource"),
|
|
267
|
+
uAmount: gl.getUniformLocation(program, "uAmount")
|
|
268
|
+
}
|
|
269
|
+
};
|
|
270
|
+
};
|
|
271
|
+
var vibrance = createEffect({
|
|
272
|
+
type: "remotion/vibrance",
|
|
273
|
+
label: "vibrance()",
|
|
274
|
+
documentationLink: "https://www.remotion.dev/docs/effects/vibrance",
|
|
275
|
+
backend: "webgl2",
|
|
276
|
+
calculateKey: (params) => {
|
|
277
|
+
const { amount } = resolve(params);
|
|
278
|
+
return `vibrance-${amount}`;
|
|
279
|
+
},
|
|
280
|
+
setup: setupVibrance,
|
|
281
|
+
apply: ({ source, width, height, params, state, flipSourceY }) => {
|
|
282
|
+
const { amount } = resolve(params);
|
|
283
|
+
const { gl, program, textureSource, uniforms, vao } = state;
|
|
284
|
+
gl.viewport(0, 0, width, height);
|
|
285
|
+
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
|
|
286
|
+
gl.clearColor(0, 0, 0, 0);
|
|
287
|
+
gl.clear(gl.COLOR_BUFFER_BIT);
|
|
288
|
+
gl.activeTexture(gl.TEXTURE0);
|
|
289
|
+
gl.bindTexture(gl.TEXTURE_2D, textureSource);
|
|
290
|
+
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipSourceY);
|
|
291
|
+
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, source);
|
|
292
|
+
gl.useProgram(program);
|
|
293
|
+
if (uniforms.uSource)
|
|
294
|
+
gl.uniform1i(uniforms.uSource, 0);
|
|
295
|
+
if (uniforms.uAmount)
|
|
296
|
+
gl.uniform1f(uniforms.uAmount, amount);
|
|
297
|
+
gl.bindVertexArray(vao);
|
|
298
|
+
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
|
|
299
|
+
gl.bindVertexArray(null);
|
|
300
|
+
gl.bindTexture(gl.TEXTURE_2D, null);
|
|
301
|
+
gl.useProgram(null);
|
|
302
|
+
},
|
|
303
|
+
cleanup: ({ gl, program, vao, vbo, textureSource }) => {
|
|
304
|
+
gl.deleteTexture(textureSource);
|
|
305
|
+
gl.deleteBuffer(vbo);
|
|
306
|
+
gl.deleteProgram(program);
|
|
307
|
+
gl.deleteVertexArray(vao);
|
|
308
|
+
},
|
|
309
|
+
schema: vibranceSchema,
|
|
310
|
+
validateParams: validateVibranceParams
|
|
311
|
+
});
|
|
312
|
+
export {
|
|
313
|
+
vibrance
|
|
314
|
+
};
|